From 1e6ae11cc4849f34f45a88b2d42be19157a3f7d9 Mon Sep 17 00:00:00 2001 From: DammyAji Date: Mon, 31 Aug 2026 13:57:59 +0100 Subject: [PATCH 1/3] feat(marketplace): add dismissible connect wallet CTA banner for unauthenticated visitors MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Add a non-intrusive banner at the top of the marketplace section that encourages unauthenticated users to connect their Stellar wallet. The banner includes: - Banner text explaining the benefits of connecting - Connect Wallet button that opens the wallet connect modal - Dismiss (X) button that hides the banner for the session via sessionStorage - Automatic hiding when the user is already authenticated Closes #859 🤖 Generated with Codebuff Co-Authored-By: Codebuff --- .../common/ConnectWalletCtaBanner.tsx | 108 ++++++++++++++++++ src/pages/HomePage.tsx | 2 + 2 files changed, 110 insertions(+) create mode 100644 src/components/common/ConnectWalletCtaBanner.tsx diff --git a/src/components/common/ConnectWalletCtaBanner.tsx b/src/components/common/ConnectWalletCtaBanner.tsx new file mode 100644 index 00000000..39e6f85a --- /dev/null +++ b/src/components/common/ConnectWalletCtaBanner.tsx @@ -0,0 +1,108 @@ +import { useCallback, useEffect, useState } from 'react'; +import { X, Wallet } from 'lucide-react'; +import { useAccount, useConnect } from 'wagmi'; +import { cn } from '@/lib/utils'; + +const DISMISS_KEY = 'connect-wallet-banner-dismissed'; + +function wasDismissed(): boolean { + try { + return sessionStorage.getItem(DISMISS_KEY) === 'true'; + } catch { + return false; + } +} + +function markDismissed(): void { + try { + sessionStorage.setItem(DISMISS_KEY, 'true'); + } catch { + // sessionStorage unavailable – silently ignore + } +} + +interface ConnectWalletCtaBannerProps { + className?: string; +} + +const ConnectWalletCtaBanner: React.FC = ({ + className, +}) => { + const { isConnected } = useAccount(); + const { connect, connectors, isPending } = useConnect(); + const [dismissed, setDismissed] = useState(wasDismissed); + + const visible = !isConnected && !dismissed; + + useEffect(() => { + if (isConnected) { + setDismissed(false); + try { + sessionStorage.removeItem(DISMISS_KEY); + } catch { + // ignore + } + } + }, [isConnected]); + + const handleDismiss = useCallback(() => { + setDismissed(true); + markDismissed(); + }, []); + + const handleConnect = useCallback(() => { + const primaryConnector = connectors[0]; + if (primaryConnector) { + connect({ connector: primaryConnector }); + } + }, [connect, connectors]); + + if (!visible) { + return null; + } + + return ( +
+
+
+
+ +
+

+ Connect your Stellar wallet to buy creator keys and start + earning +

+
+ +
+ + + +
+
+
+ ); +}; + +export default ConnectWalletCtaBanner; diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx index 93da8775..d7a1e994 100644 --- a/src/pages/HomePage.tsx +++ b/src/pages/HomePage.tsx @@ -1,3 +1,4 @@ +import ConnectWalletCtaBanner from '../components/common/ConnectWalletCtaBanner'; import FAQ from '../components/home/FAQ'; import Footer from '../components/home/Footer'; import Header from '../components/home/Header'; @@ -10,6 +11,7 @@ export default function HomePage() {
+
From 011ba987df8285a404ccf2431fe43e5ed9e181b8 Mon Sep 17 00:00:00 2001 From: Damilola Maria Ajibade Date: Fri, 4 Sep 2026 23:37:42 +0000 Subject: [PATCH 2/3] fix(marketplace): restore creator sections lost in dev merge MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The merge of dev into the CTA banner branch dropped the CreatorSpotlight and TrendingLeaderboard renders from HomePage but kept their imports, failing build (TS6133) and lint (no-unused-vars). Restore both sections so the marketplace keeps the upstream dev layout alongside the new banner, and mock the banner in DocumentTitle tests which otherwise crash on wagmi hooks without a provider. 🤖 Generated with Codebuff Co-Authored-By: Codebuff --- src/components/common/ConnectWalletCtaBanner.tsx | 2 +- src/pages/HomePage.tsx | 2 ++ src/pages/__tests__/DocumentTitle.test.tsx | 3 +++ 3 files changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/common/ConnectWalletCtaBanner.tsx b/src/components/common/ConnectWalletCtaBanner.tsx index 39e6f85a..7045bccc 100644 --- a/src/components/common/ConnectWalletCtaBanner.tsx +++ b/src/components/common/ConnectWalletCtaBanner.tsx @@ -67,7 +67,7 @@ const ConnectWalletCtaBanner: React.FC = ({ aria-label="Connect your wallet" className={cn( 'w-full border-b border-blue-500/20 bg-gradient-to-r from-blue-600/10 via-blue-500/5 to-emerald-500/10', - className, + className )} >
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx index ea9d6fa1..ba9b4da3 100644 --- a/src/pages/HomePage.tsx +++ b/src/pages/HomePage.tsx @@ -25,6 +25,8 @@ export default function HomePage() {
+ +
diff --git a/src/pages/__tests__/DocumentTitle.test.tsx b/src/pages/__tests__/DocumentTitle.test.tsx index 47a26ec7..d0b8083a 100644 --- a/src/pages/__tests__/DocumentTitle.test.tsx +++ b/src/pages/__tests__/DocumentTitle.test.tsx @@ -25,6 +25,9 @@ vi.mock('@/components/home/FAQ', () => ({ vi.mock('@/components/home/Footer', () => ({ default: () =>
Footer
, })); +vi.mock('@/components/common/ConnectWalletCtaBanner', () => ({ + default: () => null, +})); vi.mock('@/components/common/ReferralLinkPanel', () => ({ default: () =>
Referral Link Panel
, })); From ed2f12468f4ad9974bbda302cececc042c4617ce Mon Sep 17 00:00:00 2001 From: Damilola Maria Ajibade Date: Sat, 5 Sep 2026 07:31:47 +0000 Subject: [PATCH 3/3] fix(ci): repair bad dev merge resolution that broke lint MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The dev merge (2d0ae93) kept HomePage's MarketOverview import while dropping its render, and spliced dev-only imports into the slippage tolerance tests without using them, failing lint and tsc. Restore the MarketOverview section (mocking it in DocumentTitle tests) and remove the unused imports so Client CI passes again. 🤖 Generated with Codebuff Co-Authored-By: Codebuff --- src/pages/HomePage.tsx | 1 + src/pages/__tests__/DocumentTitle.test.tsx | 3 +++ src/utils/__tests__/slippageTolerance.utils.test.ts | 3 --- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx index aa5a5685..75b9e54b 100644 --- a/src/pages/HomePage.tsx +++ b/src/pages/HomePage.tsx @@ -26,6 +26,7 @@ export default function HomePage() {
+ diff --git a/src/pages/__tests__/DocumentTitle.test.tsx b/src/pages/__tests__/DocumentTitle.test.tsx index d0b8083a..08d1edf1 100644 --- a/src/pages/__tests__/DocumentTitle.test.tsx +++ b/src/pages/__tests__/DocumentTitle.test.tsx @@ -13,6 +13,9 @@ vi.mock('@/components/home/Hero', () => ({ vi.mock('@/components/home/CreatorSpotlight', () => ({ default: () =>
Creator Spotlight
, })); +vi.mock('@/components/home/MarketOverview', () => ({ + default: () =>
Market Overview
, +})); vi.mock('@/components/home/TrendingLeaderboard', () => ({ default: () =>
Trending Leaderboard
, })); diff --git a/src/utils/__tests__/slippageTolerance.utils.test.ts b/src/utils/__tests__/slippageTolerance.utils.test.ts index 603d3f4a..9c094a14 100644 --- a/src/utils/__tests__/slippageTolerance.utils.test.ts +++ b/src/utils/__tests__/slippageTolerance.utils.test.ts @@ -11,9 +11,6 @@ import { computeMaxPriceStroops, computeMinPriceStroops, computeSlippageBounds, - computeSlippagePriceBounds, - validateSlippageTolerance, - MAX_SLIPPAGE_TOLERANCE_PERCENT, } from '../slippageTolerance.utils'; describe('slippageTolerance.utils', () => {