fix: withdraw uni hook edit

apps/withdraw-uni-v2/src/app/page.tsx

@@ -12,10 +12,11 @@ import {
   decodeExitPoolHookCalldata,
 } from "@bleu/utils";
 import { SupportedChainId } from "@cowprotocol/cow-sdk";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { useFormContext, useWatch } from "react-hook-form";
 import { PoolForm } from "#/components/PoolForm";
 import { useFetchNewPoolCallback } from "#/hooks/useFetchNewPoolCallback";
+import { useSelectedPool } from "#/hooks/useSelectedPool";
 import { useUserPools } from "#/hooks/useUserPools";
 
 const ALL_SUPPORTED_CHAIN_IDS = [
@@ -45,11 +46,8 @@ export default function Page() {
     }
   }, [context?.account, context?.hookToEdit, setValue]);
 
-  const selectedPool = useMemo(() => {
-    return pools?.find(
-      (pool) => pool.id.toLowerCase() === poolId?.toLowerCase(),
-    );
-  }, [pools, poolId]);
+  const { data: selectedPool, isLoading: isLoadingSelectedPool } =
+    useSelectedPool(poolId);
 
   useEffect(() => {
     if (poolId) {
@@ -71,7 +69,11 @@ export default function Page() {
     return <span className="mt-10 text-center">Unsupported chain</span>;
   }
 
-  if (isLoadingPools || (isEditHookLoading && context.hookToEdit)) {
+  if (
+    isLoadingPools ||
+    (isEditHookLoading && context.hookToEdit) ||
+    isLoadingSelectedPool
+  ) {
     return (
       <div className="text-center mt-10 p-2">
         <Spinner size="xl" />

apps/withdraw-uni-v2/src/context/withdrawHookForm.tsx

@@ -5,10 +5,10 @@ import { Form } from "@bleu/ui";
 import { type WithdrawSchemaType, withdrawSchema } from "@bleu/utils";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useRouter } from "next/navigation";
-import { useCallback, useEffect, useMemo } from "react";
+import { useCallback, useEffect } from "react";
 import { useForm, useWatch } from "react-hook-form";
 import { useGetHookInfo } from "#/hooks/useGetHookInfo";
-import { useUserPools } from "#/hooks/useUserPools";
+import { useSelectedPool } from "#/hooks/useSelectedPool";
 
 export function WithdrawFormContextProvider({
   children,
@@ -28,15 +28,9 @@ export function WithdrawFormContextProvider({
 
   const { control, handleSubmit, setValue } = form;
 
-  const { data: pools } = useUserPools();
-
   const poolId = useWatch({ control, name: "poolId" });
 
-  const selectedPool = useMemo(() => {
-    return pools?.find(
-      (pool) => pool.id.toLowerCase() === poolId?.toLowerCase(),
-    );
-  }, [pools, poolId]);
+  const { data: selectedPool } = useSelectedPool(poolId);
 
   const router = useRouter();
 
@@ -54,7 +48,7 @@ export function WithdrawFormContextProvider({
   // biome-ignore lint:
   useEffect(() => {
     setValue("poolId", "");
-  }, [context?.account]);
+  }, [context?.account, setValue]);
 
   return (
     <Form

apps/withdraw-uni-v2/src/hooks/useSelectedPool.ts

@@ -0,0 +1,28 @@
+import { useCallback } from "react";
+import useSWR from "swr";
+import { isAddress } from "viem";
+import { useFetchNewPoolCallback } from "./useFetchNewPoolCallback";
+import { useUserPools } from "./useUserPools";
+
+export function useSelectedPool(poolId: string) {
+  const { data: pools } = useUserPools();
+  const fetchNewPoolCallback = useFetchNewPoolCallback();
+
+  const getSelectedPoolCallback = useCallback(
+    async (_poolId: string) => {
+      const poolsSearch = pools?.find(
+        (pool) => pool.id.toLowerCase() === _poolId.toLowerCase(),
+      );
+      if (poolsSearch) return poolsSearch;
+
+      if (!fetchNewPoolCallback) return;
+      if (!isAddress(_poolId)) return;
+
+      const fetchedNewPool = await fetchNewPoolCallback(_poolId);
+      return fetchedNewPool;
+    },
+    [pools, fetchNewPoolCallback],
+  );
+
+  return useSWR(poolId, getSelectedPoolCallback);
+}

apps/withdraw-uni-v2/src/hooks/useUserPools.ts

@@ -3,16 +3,12 @@ import { usePools } from "./usePools";
 
 export function useUserPools() {
   const { context, publicClient } = useIFrameContext();
-  const useSwrData = usePools(
+  return usePools(
     context?.account,
     context?.chainId,
     context?.orderParams?.sellTokenAddress,
     publicClient,
     //@ts-ignore
     context?.balancesDiff as Record<string, Record<string, string>>,
   );
-
-  const data = useSwrData.data;
-
-  return { ...useSwrData, data };
 }

packages/cow-hooks-ui/src/PoolsDropdownMenu.tsx

@@ -32,7 +32,6 @@ export function PoolsDropdownMenu({
   isCheckDetailsCentered = true,
   tooltipText,
   fetchNewPoolCallback,
-  // fetchNewPoolCallback = (_address: string) => undefined;
 }: {
   onSelect: (pool: IPool) => void;
   pools: IPool[];