fix: display wallet not exist view (#115)

liftedinit · Dec 4, 2024 · ce4786e · ce4786e
1 parent 935c277
commit ce4786e
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/components/react/modal.tsx b/components/react/modal.tsx
@@ -39,6 +39,7 @@ export const TailwindModal: React.FC<
 
   const [currentView, setCurrentView] = useState<ModalView>(ModalView.WalletList);
   const [qrWallet, setQRWallet] = useState<ChainWalletBase | undefined>();
+  const [selectedWallet, setSelectedWallet] = useState<ChainWalletBase | undefined>();
 
   const current = walletRepo?.current;
   const currentWalletData = current?.walletInfo;
@@ -82,6 +83,11 @@ export const TailwindModal: React.FC<
       // 1ms timeout prevents _render from determining the view to show first
       setTimeout(() => {
         const wallet = walletRepo?.getWallet(name);
+
+        if (wallet?.isWalletNotExist) {
+          setCurrentView(ModalView.NotExist);
+          setSelectedWallet(wallet);
+        }
         if (wallet?.walletInfo.mode === 'wallet-connect') {
           setCurrentView(ModalView.QRCode);
           setQRWallet(wallet);
@@ -162,11 +168,11 @@ export const TailwindModal: React.FC<
             onClose={onCloseModal}
             onReturn={() => setCurrentView(ModalView.WalletList)}
             onInstall={() => {
-              const link = current?.downloadInfo?.link;
-              if (link) router.push(current?.downloadInfo?.link);
+              const link = selectedWallet?.downloadInfo?.link;
+              if (link) window.open(link, '_blank', 'noopener,noreferrer');
             }}
-            logo={currentWalletData?.logo!.toString() ?? ''}
-            name={currentWalletData?.prettyName!}
+            logo={selectedWallet?.walletInfo.logo?.toString() ?? ''}
+            name={selectedWallet?.walletInfo.prettyName ?? ''}
           />
         );
       case ModalView.Contacts:
@@ -197,6 +203,7 @@ export const TailwindModal: React.FC<
     currentAddress,
     showMemberManagementModal,
     showMessageEditModal,
+    selectedWallet,
   ]);
 
   return (

diff --git a/components/react/views/NotExist.tsx b/components/react/views/NotExist.tsx
@@ -49,7 +49,7 @@ export const NotExist = ({
           To connect your {name} wallet, install the browser extension.
         </p>
         <button
-          className="rounded-lg bg-purple-damp hover:bg-purple-damp/75 inline-flex justify-center items-center py-2.5 font-medium mt-4 text-white"
+          className={`rounded-lg btn-primary btn btn-md ${name.length >= 12 ? 'w-1/2' : 'w-1/3'} mx-auto inline-flex justify-center items-center py-2.5 font-medium mt-4 text-white`}
           onClick={onInstall}
         >
           <ArrowDownTrayIcon className="flex-shrink-0 w-5 h-5 mr-2 text-white" />