From 0400c91b9154371c07dffabe37a6d79bdd30b966 Mon Sep 17 00:00:00 2001 From: JaeBrian Date: Thu, 18 Sep 2025 20:35:33 -0700 Subject: [PATCH 1/5] fix tooltip opacity and add skip steps Signed-off-by: JaeBrian --- src/components/ToolTipGuide.css | 3 ++ src/components/TooltipGuide.tsx | 61 +++++++++++++++++++++------------ 2 files changed, 42 insertions(+), 22 deletions(-) create mode 100644 src/components/ToolTipGuide.css diff --git a/src/components/ToolTipGuide.css b/src/components/ToolTipGuide.css new file mode 100644 index 0000000..721c13b --- /dev/null +++ b/src/components/ToolTipGuide.css @@ -0,0 +1,3 @@ +.force-opacity-1 { + opacity: 1 !important; +} \ No newline at end of file diff --git a/src/components/TooltipGuide.tsx b/src/components/TooltipGuide.tsx index f43ce34..a0bf88b 100644 --- a/src/components/TooltipGuide.tsx +++ b/src/components/TooltipGuide.tsx @@ -1,5 +1,6 @@ import { useState, useEffect, type ReactNode } from 'react' import { Tooltip } from 'react-tooltip' +import './ToolTipGuide.css' export interface TooltipStep { id: string @@ -43,13 +44,24 @@ const TooltipGuide = ({ } } + const handleSkip = () => { + setShowTooltips(false) + onComplete?.() + } + const renderTooltipContent = (content: string) => { return (
{content}
-
+
+ +
+ + + {showWalletList && ( +
+ {connectionError && ( +
+ {connectionError} +
+ )} + span { + padding: 10px 24px; + color: #ffffff; + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 6px; + margin-bottom: 12px; + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + background: transparent; + backdrop-filter: blur(10px); + transition: all 0.2s ease; + cursor: pointer; + } + & > span:hover { + background: rgba(255, 255, 255, 0.1); + border-color: rgba(255, 255, 255, 0.3); + } + `} + /> +
+ )} +
) } return ( - +
+ + + {showWalletList && ( +
+ span { + padding: 10px 12px; + color: #ffffff; + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 6px; + margin-bottom: 10px; + display: flex; + align-items: center; + justify-content: start; + gap: 8px; + background: transparent; + backdrop-filter: blur(10px); + transition: all 0.2s ease; + cursor: pointer; + opacity: 0; + transform: translateY(-10px); + animation: cascadeIn 0.4s ease-out forwards; + } + & > span:nth-child(1) { animation-delay: 0.02s; } + & > span:nth-child(2) { animation-delay: 0.08s; } + & > span:nth-child(3) { animation-delay: 0.12s; } + & > span:nth-child(4) { animation-delay: 0.17s; } + & > span:nth-child(5) { animation-delay: 0.22s; } + & > span:hover { + background: rgba(255, 255, 255, 0.1); + border-color: rgba(255, 255, 255, 0.3); + transform: translateY(-2px); + } + @keyframes cascadeIn { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } + } + `} + /> +
+ )} +
) } diff --git a/src/stores/walletStore.ts b/src/stores/walletStore.ts index 8c37735..68ddaed 100644 --- a/src/stores/walletStore.ts +++ b/src/stores/walletStore.ts @@ -111,8 +111,12 @@ export const useWalletStore = create()( walletApi, }) - const { getBalance, getWalletAddress } = get() - await Promise.all([getBalance(), getWalletAddress()]) + try { + const { getBalance, getWalletAddress } = get() + await Promise.all([getBalance(), getWalletAddress()]) + } catch (error) { + console.warn('Failed to get balance or address, but wallet is connected:', error) + } return true } catch (error) { From 8dc6a4e0ea8b58423a47665fcaeb338d6bd187f0 Mon Sep 17 00:00:00 2001 From: JaeBrian Date: Thu, 18 Sep 2025 21:16:39 -0700 Subject: [PATCH 4/5] remove comments Signed-off-by: JaeBrian --- src/components/WalletConnection.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/WalletConnection.tsx b/src/components/WalletConnection.tsx index e330ca2..40cce1b 100644 --- a/src/components/WalletConnection.tsx +++ b/src/components/WalletConnection.tsx @@ -50,12 +50,11 @@ const WalletConnection = ({ setConnectionError(`Error with ${walletName}: ${error.message}`) } - // Close dropdown when clicking outside useEffect(() => { const handleClickOutside = (event: MouseEvent) => { if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) { setShowWalletList(false) - setConnectionError(null) // Clear error when closing dropdown + setConnectionError(null); } } From 190957c701368d7cf74ad09e46268164bd08d5eb Mon Sep 17 00:00:00 2001 From: JaeBrian Date: Thu, 25 Sep 2025 21:37:29 -0700 Subject: [PATCH 5/5] update wallet selections to not be outdated Signed-off-by: JaeBrian --- src/components/WalletConnection.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/WalletConnection.tsx b/src/components/WalletConnection.tsx index 40cce1b..54fcbbe 100644 --- a/src/components/WalletConnection.tsx +++ b/src/components/WalletConnection.tsx @@ -131,7 +131,7 @@ const WalletConnection = ({ primaryColor="#000000" onConnect={onConnectWallet} onConnectError={onConnectError} - supportedWallets={['nami', 'eternl', 'flint', 'yoroi', 'gerowallet']} + supportedWallets={['eternl', 'yoroi', 'gerowallet', 'begin', 'nufi', 'lace', 'vespr']} showUnavailableWallets={0} peerConnectEnabled={false} limitNetwork={NetworkType.TESTNET} @@ -187,7 +187,7 @@ const WalletConnection = ({ primaryColor="#000000" onConnect={onConnectWallet} onConnectError={onConnectError} - supportedWallets={['nami', 'eternl', 'flint', 'yoroi']} + supportedWallets={['eternl', 'yoroi', 'begin', 'nufi', 'lace', 'vespr']} showUnavailableWallets={0} peerConnectEnabled={false} limitNetwork={NetworkType.TESTNET} // MUST BE CHANGED TO MAINNET to work on mainnet @@ -219,6 +219,7 @@ const WalletConnection = ({ & > span:nth-child(3) { animation-delay: 0.12s; } & > span:nth-child(4) { animation-delay: 0.17s; } & > span:nth-child(5) { animation-delay: 0.22s; } + & > span:nth-child(6) { animation-delay: 0.27s; } & > span:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.3);