Merge pull request #1298 from chainapsis/Thunnini/KEPLR-727

ibc transfer에서 기본 send로 변할때 recipient를 초기화하도록 수정

apps/extension/src/hooks/use-previous.ts

@@ -0,0 +1,33 @@
+import { useRef } from "react";
+
+export type Predicate<T> = (prev: T | undefined, next: T) => boolean;
+
+const strictEquals = <T>(prev: T | undefined, next: T) => prev === next;
+
+const useFirstMountState = (): boolean => {
+  const isFirst = useRef(true);
+
+  if (isFirst.current) {
+    isFirst.current = false;
+
+    return true;
+  }
+
+  return isFirst.current;
+};
+
+export const usePreviousDistinct = <T>(
+  value: T,
+  compare: Predicate<T> = strictEquals
+): T | undefined => {
+  const prevRef = useRef<T>();
+  const curRef = useRef<T>(value);
+  const isFirstMount = useFirstMountState();
+
+  if (!isFirstMount && !compare(curRef.current, value)) {
+    prevRef.current = curRef.current;
+    curRef.current = value;
+  }
+
+  return prevRef.current;
+};

apps/extension/src/pages/send/amount/index.tsx

@@ -55,6 +55,7 @@ import { GuideBox } from "../../../components/guide-box";
 import { ChainIdHelper } from "@keplr-wallet/cosmos";
 import { amountToAmbiguousAverage, isRunningInSidePanel } from "../../../utils";
 import { EthTxStatus } from "@keplr-wallet/types";
+import { usePreviousDistinct } from "../../../hooks/use-previous";
 
 const Styles = {
   Flex1: styled.div`
@@ -392,6 +393,14 @@ export const SendAmountPage: FunctionComponent = observer(() => {
     }
   });
 
+  const isIBCTransferPrevious = usePreviousDistinct(isIBCTransfer);
+  useEffect(() => {
+    if (isIBCTransferPrevious && !isIBCTransfer) {
+      // ibc transfer에서 기본 send로 변할때 recipient를 초기화한다.
+      sendConfigs.recipientConfig.setValue("");
+    }
+  }, [isIBCTransfer, isIBCTransferPrevious, sendConfigs.recipientConfig]);
+
   const txConfigsValidate = useTxConfigsValidate({
     ...sendConfigs,
     gasSimulator,