feat. refactor code (#453)

onbloc · Mar 20, 2024 · 8902c2b · 8902c2b
1 parent b98625f
commit 8902c2b
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 15 deletions.
diff --git a/...on/src/components/pages/web/wallet-creation-help-overlay/wallet-creation-help-overlay.tsx b/...on/src/components/pages/web/wallet-creation-help-overlay/wallet-creation-help-overlay.tsx
@@ -5,15 +5,13 @@ import WebHelpOverlay, {
 import { WalletCreationHelpOverlayItem } from './wallet-creation-help-overlay.styles';
 
 export interface WalletCreationHelpOverlayProps {
-  init: boolean;
   hardwareWalletButtonRef?: React.RefObject<HTMLButtonElement>;
   airgapAccountButtonRef?: React.RefObject<HTMLButtonElement>;
   advancedOptionButtonRef?: React.RefObject<HTMLButtonElement>;
   onFinish: () => void;
 }
 
 const WalletCreationHelpOverlay: React.FC<WalletCreationHelpOverlayProps> = ({
-  init,
   hardwareWalletButtonRef,
   airgapAccountButtonRef,
   advancedOptionButtonRef,
@@ -84,11 +82,11 @@ const WalletCreationHelpOverlay: React.FC<WalletCreationHelpOverlayProps> = ({
 
   const helpItems = useMemo(() => {
     const items = [hardwareWalletHelpItem, airgapAccountHelpItem, advancedOptionHelpItem];
-    if (!init || items.includes(null)) {
+    if (items.includes(null)) {
       return [];
     }
     return items as OverlayItem[];
-  }, [init, hardwareWalletHelpItem, airgapAccountHelpItem, advancedOptionHelpItem]);
+  }, [hardwareWalletHelpItem, airgapAccountHelpItem, advancedOptionHelpItem]);
 
   useEffect(() => {
     if (typeof window !== 'undefined') {
@@ -109,10 +107,6 @@ const WalletCreationHelpOverlay: React.FC<WalletCreationHelpOverlayProps> = ({
     }
   }, []);
 
-  if (!init) {
-    return <></>;
-  }
-
   return <WebHelpOverlay items={helpItems} onFinish={onFinish} />;
 };
 

diff --git a/packages/adena-extension/src/pages/web/landing-screen/index.tsx b/packages/adena-extension/src/pages/web/landing-screen/index.tsx
@@ -1,4 +1,4 @@
-import React, { ReactElement, useCallback, useMemo, useRef, useState } from 'react';
+import React, { ReactElement, useCallback, useMemo, useRef } from 'react';
 import styled, { useTheme } from 'styled-components';
 import { useQuery } from '@tanstack/react-query';
 
@@ -26,7 +26,6 @@ const StyledAnimationWrapper = styled.div`
 const LandingScreen = (): ReactElement => {
   const { navigate } = useAppNavigate();
   const { walletService } = useAdenaContext();
-  const [finishedGuide, setFinishedGuide] = useState(false);
   const theme = useTheme();
   const hardwareWalletButtonRef = useRef<HTMLButtonElement>(null);
   const airgapAccountButtonRef = useRef<HTMLButtonElement>(null);
@@ -38,10 +37,10 @@ const LandingScreen = (): ReactElement => {
     {},
   );
 
-  const { data: visibleGuide } = useQuery(
-    ['landingScreen/visibleGuide', existWallet, finishedGuide],
+  const { data: visibleGuide, refetch: refetchVisibleGuide } = useQuery(
+    ['landingScreen/visibleGuide', existWallet],
     async () => {
-      if (finishedGuide || existWallet === undefined) {
+      if (existWallet === undefined) {
         return false;
       }
       const isSkip = await walletService.isSkipWalletGuide(existWallet);
@@ -65,7 +64,7 @@ const LandingScreen = (): ReactElement => {
     if (existWallet === undefined) {
       return;
     }
-    walletService.updateWalletGuideConfirmDate(existWallet).finally(() => setFinishedGuide(true));
+    walletService.updateWalletGuideConfirmDate(existWallet).finally(refetchVisibleGuide);
   }, [walletService, existWallet]);
 
   if (isLoading) {
@@ -136,7 +135,6 @@ const LandingScreen = (): ReactElement => {
 
       {visibleGuide && (
         <WalletCreationHelpOverlay
-          init={visibleGuide}
           hardwareWalletButtonRef={hardwareWalletButtonRef}
           airgapAccountButtonRef={airgapAccountButtonRef}
           advancedOptionButtonRef={advancedOptionButtonRef}