merge cow amm state management updates

balancer · Nov 19, 2024 · 03db133 · 03db133
2 parents cae3e1e + ca83ddf
commit 03db133
Show file tree

Hide file tree

Showing 10 changed files with 196 additions and 180 deletions.
diff --git a/packages/nextjs/app/cow/_components/PoolConfiguration.tsx b/packages/nextjs/app/cow/_components/PoolConfiguration.tsx
@@ -10,7 +10,7 @@ import { TextField, TokenField } from "~~/components/common/";
 import { ButtonTabs } from "~~/components/common/ButtonTabs";
 import { useCheckIfPoolExists } from "~~/hooks/cow";
 import { getPoolUrl } from "~~/hooks/cow/getPoolUrl";
-import { usePoolCreationPersistedState } from "~~/hooks/cow/usePoolCreationState";
+import { usePoolCreationStore } from "~~/hooks/cow/usePoolCreationStore";
 import { useTargetNetwork } from "~~/hooks/scaffold-eth";
 import { type Token, useFetchTokenList, useReadToken } from "~~/hooks/token";
 import { COW_MIN_AMOUNT } from "~~/utils";
@@ -26,7 +26,7 @@ export const PoolConfiguration = () => {
   const [hasAgreedToWarning, setAgreedToWarning] = useState<boolean>(false);
   const [poolName, setPoolName] = useState<string>("");
   const [poolSymbol, setPoolSymbol] = useState<string>("");
-  const setPersistedState = usePoolCreationPersistedState(state => state.setPersistedState);
+  const { setPoolCreation } = usePoolCreationStore();
   const [tokenWeights, setTokenWeights] = useState<SupportedTokenWeight>("5050");
   const { token1Weight, token2Weight } = getPerTokenWeights(tokenWeights);
 
@@ -157,16 +157,17 @@ export const PoolConfiguration = () => {
             isPending={false}
             isDisabled={!canProceedToCreate}
             onClick={() => {
-              setPersistedState({
+              setPoolCreation({
                 chainId: chain?.id || 0,
                 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 token1: token1!,
                 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 token2: token2!,
                 token1Amount,
                 token2Amount,
-                poolName: poolName.trim(),
-                poolSymbol: poolSymbol.trim(),
+                name: poolName.trim(),
+                symbol: poolSymbol.trim(),
+                address: undefined,
                 step: 1,
                 tokenWeights,
               });

diff --git a/packages/nextjs/app/cow/_components/PoolCreated.tsx b/packages/nextjs/app/cow/_components/PoolCreated.tsx
@@ -1,4 +1,5 @@
 import { useState } from "react";
+import { usePathname, useRouter } from "next/navigation";
 import CopyToClipboard from "react-copy-to-clipboard";
 import { getAddress } from "viem";
 import { CheckCircleIcon, DocumentDuplicateIcon } from "@heroicons/react/24/outline";
@@ -15,6 +16,8 @@ interface PoolCreatedProps {
 
 export const PoolCreated = ({ etherscanURL, poolAddress, chainId, clearState }: PoolCreatedProps) => {
   const [addressCopied, setAddressCopied] = useState(false);
+  const router = useRouter();
+  const pathname = usePathname();
 
   if (!poolAddress) return null;
 
@@ -23,6 +26,11 @@ export const PoolCreated = ({ etherscanURL, poolAddress, chainId, clearState }:
   const domainName = extractDomain(etherscanURL || "");
   const blockExplorerName = domainName.split(".")[0];
 
+  const handleCreateAnother = () => {
+    clearState();
+    router.replace(pathname);
+  };
+
   return (
     <>
       <div className="bg-base-200 w-full p-6 rounded-xl flex flex-col gap-6 shadow-xl justify-center items-center">
@@ -67,7 +75,12 @@ export const PoolCreated = ({ etherscanURL, poolAddress, chainId, clearState }:
         <Alert type="warning">It may take a few minutes to appear in the Balancer app</Alert>
       </div>
       <div className="w-80">
-        <TransactionButton title="Create Another Pool" onClick={clearState} isPending={false} isDisabled={false} />
+        <TransactionButton
+          title="Create Another Pool"
+          onClick={handleCreateAnother}
+          isPending={false}
+          isDisabled={false}
+        />
       </div>
     </>
   );