From 910abd3339123be74754dca831db0b26806a2eb7 Mon Sep 17 00:00:00 2001
From: thiagoulloa <tafarelulloa@gmail.com>
Date: Fri, 1 Nov 2024 21:46:47 -0300
Subject: [PATCH] Update prefilledState data handling

---
 pages/index.tsx                       | 22 ++++++++++++---------
 src/components/Swap/SwapComponent.tsx | 28 ++++++++++++++++++++++-----
 2 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/pages/index.tsx b/pages/index.tsx
index afb19080..4e33e51e 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -21,21 +21,25 @@ export default function Home() {
   });
 
   useEffect(() => {
-    const newXlmToken =
-      xlmTokenList.find((tList) => tList.network === activeChain?.id)?.assets[0].contract ?? null;
-    setXlmToken(newXlmToken);
+    if (prefilledState.INPUT?.currencyId == null) {
+      const newXlmToken =
+        xlmTokenList.find((tList) => tList.network === activeChain?.id)?.assets[0].contract ?? null;
+      setXlmToken(newXlmToken);
 
-    const newPrefilledState = {
-      [Field.INPUT]: { currencyId: newXlmToken },
-      [Field.OUTPUT]: { currencyId: null },
-    };
-    setPrefilledState(newPrefilledState);
+      const newPrefilledState = {
+        [Field.INPUT]: { currencyId: newXlmToken },
+        [Field.OUTPUT]: { currencyId: null },
+      };
+      setPrefilledState(newPrefilledState);
+    }
   }, [activeChain, xlmToken]);
 
   return (
     <>
       <SEO title="Soroswap" data-testid="SEO" />
-      {xlmToken && <SwapComponent prefilledState={prefilledState} />}
+      {xlmToken && (
+        <SwapComponent prefilledState={prefilledState} setPrefilledState={setPrefilledState} />
+      )}
     </>
   );
 }
diff --git a/src/components/Swap/SwapComponent.tsx b/src/components/Swap/SwapComponent.tsx
index 135b0a88..14be04d9 100644
--- a/src/components/Swap/SwapComponent.tsx
+++ b/src/components/Swap/SwapComponent.tsx
@@ -108,15 +108,17 @@ const INITIAL_SWAP_STATE = {
 
 export function SwapComponent({
   prefilledState = {},
+  setPrefilledState,
   disableTokenInputs = false,
   handleDoSwap,
 }: {
   prefilledState?: Partial<SwapState>;
+  setPrefilledState?: (value: Partial<SwapState>) => void;
   disableTokenInputs?: boolean;
   handleDoSwap?: (setSwapState: (value: SetStateAction<SwapStateProps>) => void) => void;
 }) {
   const sorobanContext = useSorobanReact();
-  const { refetch } = useGetMyBalances()
+  const { refetch } = useGetMyBalances();
   const { SnackbarContext } = useContext(AppContext);
   const [showPriceImpactModal, setShowPriceImpactModal] = useState<boolean>(false);
   const [txError, setTxError] = useState<boolean>(false);
@@ -153,7 +155,10 @@ export function SwapComponent({
   } = useDerivedSwapInfo(state);
 
   useEffect(() => {
-    if (typeof currencyBalances[Field.OUTPUT] != 'string' && currencyBalances[Field.OUTPUT].balance === undefined) {
+    if (
+      typeof currencyBalances[Field.OUTPUT] != 'string' &&
+      currencyBalances[Field.OUTPUT].balance === undefined
+    ) {
       setNeedTrustline(true);
     } else {
       setNeedTrustline(false);
@@ -202,6 +207,12 @@ export function SwapComponent({
   const handleInputSelect = useCallback(
     (inputCurrency: TokenType) => {
       onCurrencySelection(Field.INPUT, inputCurrency);
+      setPrefilledState
+        ? setPrefilledState({
+            [Field.INPUT]: { currencyId: inputCurrency.contract },
+            [Field.OUTPUT]: { currencyId: prefilledState.OUTPUT?.currencyId },
+          })
+        : null;
     },
     [onCurrencySelection],
   );
@@ -209,6 +220,12 @@ export function SwapComponent({
   const handleOutputSelect = useCallback(
     (outputCurrency: TokenType) => {
       onCurrencySelection(Field.OUTPUT, outputCurrency);
+      setPrefilledState
+        ? setPrefilledState({
+            [Field.INPUT]: { currencyId: prefilledState.OUTPUT?.currencyId },
+            [Field.OUTPUT]: { currencyId: outputCurrency.contract },
+          })
+        : null;
     },
     [onCurrencySelection],
   );
@@ -309,9 +326,10 @@ export function SwapComponent({
           ...currentState,
           showConfirm: false,
         }));
-      }).finally(() => {
-        refetch()
-        nativeBalance.mutate()
+      })
+      .finally(() => {
+        refetch();
+        nativeBalance.mutate();
       });
   };