chore(dao-ui): codex reviews (#182)

Co-authored-by: Gustavo Gonzalez <ggonzalez94@users.noreply.github.com>
Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: 3 people

packages/ui/src/components/WalletContainer.tsx

@@ -1,6 +1,8 @@
 import { PUB_CHAIN, PUB_CHAIN_NAME } from "@/constants";
+import { useWalletChainPolicy } from "@/context/WalletChainPolicy";
 import { config } from "@/context/Web3Modal";
 import { formatHexString } from "@/utils/evm";
+import { shouldForcePrimaryChainSwitch } from "@/utils/wallet-chain-policy";
 import { MemberAvatar } from "@aragon/ods";
 import { useWeb3Modal } from "@web3modal/wagmi/react";
 import classNames from "classnames";
@@ -16,6 +18,7 @@ const WalletContainer = () => {
   const { open } = useWeb3Modal();
   const { address, isConnected, chainId } = useAccount();
   const { switchChain } = useSwitchChain();
+  const { allowedSecondaryChainIds } = useWalletChainPolicy();
 
   const { data: ensName } = useEnsName({
     config,
@@ -32,11 +35,10 @@ const WalletContainer = () => {
   });
 
   useEffect(() => {
-    if (!chainId) return;
-    else if (chainId === PUB_CHAIN.id) return;
+    if (!shouldForcePrimaryChainSwitch(chainId, PUB_CHAIN.id, allowedSecondaryChainIds)) return;
 
     switchChain({ chainId: PUB_CHAIN.id });
-  }, [chainId, switchChain]);
+  }, [allowedSecondaryChainIds, chainId, switchChain]);
 
   return (
     <button

packages/ui/src/components/l2Execution/ProposalL2Execution.tsx

@@ -1,10 +1,13 @@
+import { useEffect } from "react";
 import { AlertInline, Button, Spinner } from "@aragon/ods";
 import { useWeb3Modal } from "@web3modal/wagmi/react";
 import { type Hex } from "viem";
 import { useAccount, useSwitchChain } from "wagmi";
 import { PUB_TAIKO_BRIDGE_ADDRESS, TAIKO_L2_CHAIN_ID } from "@/constants";
+import { useWalletChainPolicy } from "@/context/WalletChainPolicy";
 import { useL2AnchorSync } from "@/hooks/useL2AnchorSync";
 import { useL2LegExecution } from "@/hooks/useL2LegExecution";
+import { shouldRenderL2ExecutionCard } from "@/utils/l2-execution";
 import { type RawAction } from "@/utils/types";
 
 interface ProposalL2ExecutionProps {
@@ -36,6 +39,7 @@ export function ProposalL2Execution({
   const { isConnected, chain } = useAccount();
   const { open } = useWeb3Modal();
   const { switchChain } = useSwitchChain();
+  const { setAllowedSecondaryChainIds } = useWalletChainPolicy();
 
   const l1BlockNumber = executionBlockNumber ? BigInt(executionBlockNumber) : undefined;
   const l1TxHash = executorTxHash as Hex | undefined;
@@ -68,9 +72,22 @@ export function ProposalL2Execution({
   const detectedFromTx = !!message;
 
   const hasL2Leg = detectedFromActions || detectedFromTx;
+  // Allow Taiko L2 only while still determining L2 leg status or when a confirmed L2 leg exists.
+  // Without this guard, executed proposals with no L2 leg keep the secondary chain allowed indefinitely.
+  const shouldAllowTaikoL2 = executed && shouldCheckL2 && !isL2Confirmed && (!isSynced || isExtracting || hasL2Leg);
+
+  useEffect(() => {
+    setAllowedSecondaryChainIds(shouldAllowTaikoL2 ? [TAIKO_L2_CHAIN_ID] : []);
+
+    return () => {
+      setAllowedSecondaryChainIds([]);
+    };
+  }, [setAllowedSecondaryChainIds, shouldAllowTaikoL2]);
 
   // Don't render if no L2 leg detected (and not still checking)
-  if (!hasL2Leg && !isExtracting) return null;
+  if (!shouldRenderL2ExecutionCard({ hasL2Leg, isExtracting, shouldCheckExecutedProposal: shouldCheckL2 })) {
+    return null;
+  }
 
   // Pre-execution: show informational message
   if (!executed) {

packages/ui/src/context/WalletChainPolicy.tsx

@@ -0,0 +1,29 @@
+import React, { createContext, useContext, useMemo, useState } from "react";
+
+export interface WalletChainPolicyContextProps {
+  allowedSecondaryChainIds: number[];
+  setAllowedSecondaryChainIds: (chainIds: number[]) => void;
+}
+
+const WalletChainPolicyContext = createContext<WalletChainPolicyContextProps | undefined>(undefined);
+
+export const WalletChainPolicyProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [allowedSecondaryChainIds, setAllowedSecondaryChainIds] = useState<number[]>([]);
+
+  const value = useMemo(
+    () => ({ allowedSecondaryChainIds, setAllowedSecondaryChainIds }),
+    [allowedSecondaryChainIds]
+  );
+
+  return <WalletChainPolicyContext.Provider value={value}>{children}</WalletChainPolicyContext.Provider>;
+};
+
+export const useWalletChainPolicy = () => {
+  const context = useContext(WalletChainPolicyContext);
+
+  if (!context) {
+    throw new Error("useWalletChainPolicy must be used inside the WalletChainPolicyProvider");
+  }
+
+  return context;
+};

packages/ui/src/context/index.tsx

@@ -11,6 +11,7 @@ import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client
 import { UseDerivedWalletProvider } from "../hooks/useDerivedWallet";
 import { OdsModulesProvider } from "@aragon/ods";
 import { customModulesCopy, odsCoreProviderValues } from "@/components/ods-customizations";
+import { WalletChainPolicyProvider } from "./WalletChainPolicy";
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -53,7 +54,9 @@ export function RootContextProvider({ children }: { children: ReactNode }) {
       >
         <PersistQueryClientProvider client={queryClient} persistOptions={{ persister }}>
           <AlertProvider>
-            <UseDerivedWalletProvider>{children}</UseDerivedWalletProvider>
+            <WalletChainPolicyProvider>
+              <UseDerivedWalletProvider>{children}</UseDerivedWalletProvider>
+            </WalletChainPolicyProvider>
           </AlertProvider>
         </PersistQueryClientProvider>
       </OdsModulesProvider>

packages/ui/src/hooks/useL2LegExecution.ts

@@ -23,6 +23,7 @@ import {
   TAIKO_L2_CHAIN_ID,
 } from "@/constants";
 import { AlertContextProps, useAlerts } from "@/context/Alerts";
+import { getConfirmedL2MessageOutcome } from "@/utils/l2-execution";
 
 // Bridge message status: 0 = NEW, 1 = RETRIABLE, 2 = DONE, 3 = FAILED, 4 = PROVEN
 const MESSAGE_STATUS_DONE = 2;
@@ -104,7 +105,7 @@ export function useL2LegExecution(
         }
         setIsExtracting(false);
       })
-      .catch((err) => {
+      .catch(() => {
         if (cancelled) return;
         setExtractError("Failed to read L1 transaction");
         setIsExtracting(false);
@@ -246,19 +247,39 @@ export function useL2LegExecution(
       return;
     }
     if (isL2Confirmed) {
-      if (isMessageDone) {
+      const messageOutcome = getConfirmedL2MessageOutcome(messageStatusResult);
+
+      if (messageOutcome === "success") {
         addAlert("L2 leg executed successfully", {
           description: "The cross-chain proposal actions have been executed on L2",
           type: "success",
         });
-      } else {
-        addAlert("L2 transaction confirmed but message not yet processed", {
-          description: "The inner L2 execution may have failed. Check the transaction and retry if needed.",
+        return;
+      }
+
+      if (messageOutcome === "failed") {
+        addAlert("L2 transaction confirmed but message processing failed", {
+          description: "The bridge message failed on L2. Check the transaction and retry if needed.",
           type: "error",
         });
+        return;
       }
+
+      addAlert("L2 transaction confirmed; waiting for message processing", {
+        description: "The transaction was confirmed on Taiko L2 and the bridge message is still being finalized.",
+        type: "info",
+      });
     }
-  }, [writeStatus, writeError, l2TxHash, isL2Confirming, isL2Confirmed, isMessageDone, addAlert, resetWrite]);
+  }, [
+    writeStatus,
+    writeError,
+    l2TxHash,
+    isL2Confirming,
+    isL2Confirmed,
+    messageStatusResult,
+    addAlert,
+    resetWrite,
+  ]);
 
   return {
     message,

packages/ui/src/tests/l2-execution.test.ts

@@ -0,0 +1,44 @@
+import { describe, expect, test } from "bun:test";
+import {
+  getConfirmedL2MessageOutcome,
+  shouldRenderL2ExecutionCard,
+} from "../utils/l2-execution";
+
+describe("shouldRenderL2ExecutionCard", () => {
+  test("keeps the card visible while an executed proposal with a tx hash is still being checked", () => {
+    expect(
+      shouldRenderL2ExecutionCard({
+        hasL2Leg: false,
+        isExtracting: false,
+        shouldCheckExecutedProposal: true,
+      })
+    ).toBe(true);
+  });
+
+  test("hides the card when there is no detected L2 leg and no active check", () => {
+    expect(
+      shouldRenderL2ExecutionCard({
+        hasL2Leg: false,
+        isExtracting: false,
+        shouldCheckExecutedProposal: false,
+      })
+    ).toBe(false);
+  });
+});
+
+describe("getConfirmedL2MessageOutcome", () => {
+  test("treats DONE as a success", () => {
+    expect(getConfirmedL2MessageOutcome(2)).toBe("success");
+  });
+
+  test("treats FAILED as a failure", () => {
+    expect(getConfirmedL2MessageOutcome(3)).toBe("failed");
+  });
+
+  test("treats all other statuses as pending bridge processing", () => {
+    expect(getConfirmedL2MessageOutcome(0)).toBe("pending");
+    expect(getConfirmedL2MessageOutcome(1)).toBe("pending");
+    expect(getConfirmedL2MessageOutcome(4)).toBe("pending");
+    expect(getConfirmedL2MessageOutcome(undefined)).toBe("pending");
+  });
+});

packages/ui/src/tests/wallet-chain-policy.test.ts

@@ -0,0 +1,16 @@
+import { describe, expect, test } from "bun:test";
+import { shouldForcePrimaryChainSwitch } from "../utils/wallet-chain-policy";
+
+describe("shouldForcePrimaryChainSwitch", () => {
+  test("force-switches when connected to Taiko but the current flow has not allowed it", () => {
+    expect(shouldForcePrimaryChainSwitch(167000, 1, [])).toBe(true);
+  });
+
+  test("does not force-switch when the current flow explicitly allows Taiko", () => {
+    expect(shouldForcePrimaryChainSwitch(167000, 1, [167000])).toBe(false);
+  });
+
+  test("does not force-switch when already on the primary chain", () => {
+    expect(shouldForcePrimaryChainSwitch(1, 1, [])).toBe(false);
+  });
+});

packages/ui/src/utils/l2-execution.ts

@@ -0,0 +1,18 @@
+export function shouldRenderL2ExecutionCard({
+  hasL2Leg,
+  isExtracting,
+  shouldCheckExecutedProposal,
+}: {
+  hasL2Leg: boolean;
+  isExtracting: boolean;
+  shouldCheckExecutedProposal: boolean;
+}) {
+  return hasL2Leg || isExtracting || shouldCheckExecutedProposal;
+}
+
+export function getConfirmedL2MessageOutcome(messageStatus?: number) {
+  if (messageStatus === 2) return "success";
+  if (messageStatus === 3) return "failed";
+
+  return "pending";
+}

packages/ui/src/utils/wallet-chain-policy.ts

@@ -0,0 +1,10 @@
+export function shouldForcePrimaryChainSwitch(
+  currentChainId: number | undefined,
+  primaryChainId: number,
+  allowedSecondaryChainIds: number[] = []
+) {
+  if (!currentChainId) return false;
+  if (currentChainId === primaryChainId) return false;
+
+  return !allowedSecondaryChainIds.includes(currentChainId);
+}