From 18f32a14bf7ff71cb0689a5db03210548ac3bf7a Mon Sep 17 00:00:00 2001
From: "shakespeare.diy" <assistant@shakespeare.diy>
Date: Fri, 24 Jul 2026 17:32:40 +0700
Subject: [PATCH] Gate built-in Cashu mint wallet to native-only (browser CORS
 reality)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Browsers block most Cashu mints (no CORS headers), so minting/melting fails unreliably in-browser — and the failed fetches spam the console. Rather than ship a broken browser feature:

- CashuWalletCard: in a browser, render a clear "built-in ecash runs in the app" notice pointing users to zaps (NWC/WebLN/Lightning address) which work fine in-browser; full mint wallet renders only on native (Capacitor)
- useCashu: skip coco/IndexedDB/mint init entirely in the browser (isNativePlatform guard) — stops the recurring "Failed to fetch mint" console errors at the source
- Zaps/tips (the app's real money flow) are unaffected — they never touch a Cashu mint

Native builds get the full wallet with minibits working directly (no CORS jail), per the earlier platform-aware work.

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
---
 src/components/wallet/CashuWalletCard.tsx | 59 +++++++++++++++++++++++
 src/hooks/wallet/useCashu.ts              |  7 ++-
 2 files changed, 65 insertions(+), 1 deletion(-)

diff --git a/src/components/wallet/CashuWalletCard.tsx b/src/components/wallet/CashuWalletCard.tsx
index b97cb84..01869c6 100644
--- a/src/components/wallet/CashuWalletCard.tsx
+++ b/src/components/wallet/CashuWalletCard.tsx
@@ -39,8 +39,67 @@ import {
 import { useToast } from '@/hooks/useToast';
 import { QRScannerModal } from '@/components/wallet/QRScannerModal';
 import { MintPrivacyManager } from '@/components/wallet/MintPrivacyManager';
+import { isNativePlatform } from '@/lib/platform';
+import { Smartphone } from 'lucide-react';
 
+/**
+ * The built-in Cashu (ecash) mint wallet only works where there's no browser
+ * CORS jail — i.e. in the native app. In a plain web browser most mints block
+ * requests (no Access-Control-Allow-Origin), so minting/melting fails. Rather
+ * than ship a browser feature that unreliably errors, we gate the full wallet
+ * to native and, in the browser, explain how to transact (zaps via a connected
+ * Lightning wallet, or use the native app).
+ *
+ * Zaps/tips — the app's actual money flow — keep working in the browser via
+ * NWC / WebLN / Lightning address, none of which touch a Cashu mint.
+ */
 export function CashuWalletCard() {
+  if (!isNativePlatform()) {
+    return <CashuWalletBrowserNotice />;
+  }
+  return <CashuWalletCardNative />;
+}
+
+function CashuWalletBrowserNotice() {
+  return (
+    <Card className="border-orange-500/30 bg-gradient-to-br from-orange-500/5 to-yellow-500/5">
+      <CardHeader className="p-4">
+        <CardTitle className="text-base font-bold flex items-center gap-2">
+          <Wallet className="h-5 w-5 text-orange-500" />
+          Built-in Ecash Wallet
+        </CardTitle>
+        <CardDescription className="text-xs">
+          The built-in Cashu wallet runs in the SkateSpots app
+        </CardDescription>
+      </CardHeader>
+      <CardContent className="space-y-4 p-4 pt-0">
+        <div className="flex items-start gap-3 rounded-xl bg-orange-500/10 border border-orange-500/20 p-3">
+          <Smartphone className="h-5 w-5 text-orange-400 flex-shrink-0 mt-0.5" />
+          <div className="space-y-1">
+            <p className="text-sm font-semibold">Open SkateSpots in the app to use ecash</p>
+            <p className="text-xs text-muted-foreground leading-relaxed">
+              Web browsers block most Cashu mints for security reasons, so the built-in ecash
+              wallet is available in the native app. Everything else — sending and receiving
+              <strong className="text-foreground"> zaps</strong> — works right here in your browser.
+            </p>
+          </div>
+        </div>
+
+        <div className="rounded-xl border bg-muted/40 p-3 space-y-2">
+          <p className="text-sm font-semibold flex items-center gap-2">
+            <Zap className="h-4 w-4 text-amber-500" /> Zap &amp; tip in the browser
+          </p>
+          <p className="text-xs text-muted-foreground leading-relaxed">
+            Connect a Lightning wallet below (Nostr Wallet Connect or a browser extension like
+            Alby) to zap spots, events, coaches, and crews. No Cashu mint required.
+          </p>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}
+
+function CashuWalletCardNative() {
   const {
     coco,
     repositories,
diff --git a/src/hooks/wallet/useCashu.ts b/src/hooks/wallet/useCashu.ts
index ea4fb1f..408f45a 100644
--- a/src/hooks/wallet/useCashu.ts
+++ b/src/hooks/wallet/useCashu.ts
@@ -97,7 +97,12 @@ export function useCashu(): UseCashuReturn {
   // Initialize the coco manager
   const initializeCocoManager = useCallback(async () => {
     if (isInitialized || isLoading) return;
-    
+
+    // The Cashu mint wallet is native-only: browsers block most mints via CORS,
+    // so there's no point spinning up coco / IndexedDB / mint probing (and the
+    // failed mint fetches spam the console). Skip init entirely in the browser.
+    if (!isNativePlatform()) return;
+
     setIsLoading(true);
     setError(null);