From 78f643d7a9a7871d9771bc9072b16e0888b4241e Mon Sep 17 00:00:00 2001
From: SkateSpots <skatespots>
Date: Sat, 26 Sep 2026 22:39:58 +0700
Subject: [PATCH] feat(mints,escrow): MintRadar polish + escrow status in
 shared actions

- Mints page: 'Online only' toggle + result count ('N of M mints')
- Wallet page: 'Browse Cashu mints' link to /mints
- ListingTradeActions now renders the EscrowPanel for a viewer's active escrow,
  so escrow status shows on both the grid card and the detail page
- AGENTS.md project map: marketplace detail page + shared actions

Gate: 101 tests, 0 errors/warnings, boot smoke green.
---
 AGENTS.md                              |  9 ++++--
 src/components/ListingTradeActions.tsx |  4 +++
 src/pages/MintsPage.tsx                | 38 ++++++++++++++++++++------
 src/pages/WalletPage.tsx               | 12 ++++++++
 4 files changed, 51 insertions(+), 12 deletions(-)

diff --git a/AGENTS.md b/AGENTS.md
index 926f919..422b287 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -43,9 +43,12 @@ session with **no other memory of this project**. So:
     → `src/hooks/useTradeAttestations.ts`; reputation UI in `TradeReputationCard`
   - `35000–35012` role profiles (skater/filmer/coach/…) · `35006` crews · `30003` spot collections
   - `24899` spot chat · `2259` spot status · `32671` Sasquatch Pro · `7103` event updates
-- **Marketplace**: `GearSwapPage` + `MarketplaceItemCard`. Buyer/seller trade
-  attestations build mutual, WoT-weighted reputation. **No payments are
-  implemented** — "Buy" is intentionally absent; only Contact/Offer/Trade.
+- **Marketplace**: `GearSwapPage` (grid) + `MarketplaceItemCard` and a listing
+  detail page at **`/listing/:pubkey/:identifier`**. Trade/escrow actions live in
+  the shared **`ListingTradeActions`** (used by BOTH the card and the detail page
+  — one implementation). Buyer/seller attestations build mutual, WoT-weighted
+  reputation. **No payments are implemented** — "Buy" is intentionally absent;
+  buyers contact the seller and settle off-app.
 - **Cashu escrow** (marketplace): time-locked **P2PK** (lock to seller + buyer
   refund key + locktime) — see **`ESCROW.md`** and `src/lib/cashuEscrow.ts`
   (unit-tested). Protocol: `cashu_token` on the `31872`; each user advertises a
diff --git a/src/components/ListingTradeActions.tsx b/src/components/ListingTradeActions.tsx
index a68f480..ed38732 100644
--- a/src/components/ListingTradeActions.tsx
+++ b/src/components/ListingTradeActions.tsx
@@ -13,6 +13,7 @@ import {
 } from '@/hooks/useTradeAttestations';
 import { useCashuEscrow } from '@/hooks/wallet/useCashuEscrow';
 import { EscrowRequestDialog } from '@/components/EscrowRequestDialog';
+import { EscrowPanel } from '@/components/EscrowPanel';
 import { parseEscrowToken } from '@/lib/cashuEscrow';
 import { MessageCircle, Loader2, CheckCircle, Lock, Send, RotateCcw } from 'lucide-react';
 import type { MarketplaceItem } from '@/lib/types';
@@ -132,6 +133,9 @@ export function ListingTradeActions({ item }: { item: MarketplaceItem }) {
 
   return (
     <div className="space-y-2">
+      {/* Active escrow the viewer holds on this listing (refundable after locktime) */}
+      {myEscrowToken && <EscrowPanel token={myEscrowToken} className="mb-1" />}
+
       {/* Buyer: confirm the trade the seller recorded (builds both reps) */}
       {sellerNamedMe && !iConfirmedTrade && (
         <Button
diff --git a/src/pages/MintsPage.tsx b/src/pages/MintsPage.tsx
index ae97d38..19987e6 100644
--- a/src/pages/MintsPage.tsx
+++ b/src/pages/MintsPage.tsx
@@ -130,6 +130,7 @@ export default function MintsPage() {
   const { coco, mints, isInitialized, refreshMints } = useCashu();
   const { toast } = useToast();
   const [query, setQuery] = useState('');
+  const [onlineOnly, setOnlineOnly] = useState(false);
   const [addingUrl, setAddingUrl] = useState<string | null>(null);
 
   useSeoMeta({
@@ -148,6 +149,7 @@ export default function MintsPage() {
     const q = query.trim().toLowerCase();
     return list
       .filter((m) => {
+        if (onlineOnly && (m.archived || m.online === false)) return false;
         if (!q) return true;
         return (
           m.url.toLowerCase().includes(q) ||
@@ -161,7 +163,7 @@ export default function MintsPage() {
         if (r !== 0) return r;
         return (a.latencyMs ?? 9999) - (b.latencyMs ?? 9999);
       });
-  }, [data, query]);
+  }, [data, query, onlineOnly]);
 
   const handleAdd = async (url: string) => {
     if (!coco) return;
@@ -194,16 +196,34 @@ export default function MintsPage() {
           </p>
         </div>
 
-        <div className="relative mb-4">
-          <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-500" />
-          <Input
-            value={query}
-            onChange={(e) => setQuery(e.target.value)}
-            placeholder="Search mints by name or URL…"
-            className="h-11 border-gray-700 bg-gray-900 pl-10 text-white"
-          />
+        <div className="mb-4 flex items-center gap-2">
+          <div className="relative flex-1">
+            <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-500" />
+            <Input
+              value={query}
+              onChange={(e) => setQuery(e.target.value)}
+              placeholder="Search mints by name or URL…"
+              className="h-11 border-gray-700 bg-gray-900 pl-10 text-white"
+            />
+          </div>
+          <Button
+            variant={onlineOnly ? 'default' : 'outline'}
+            onClick={() => setOnlineOnly((v) => !v)}
+            className={cn(
+              'h-11 shrink-0 gap-1.5',
+              onlineOnly ? 'bg-[#ccff00] font-bold text-black hover:bg-[#ccff00]/90' : 'border-white/15',
+            )}
+          >
+            <Activity className="h-4 w-4" /> Online only
+          </Button>
         </div>
 
+        {!isLoading && !error && (
+          <p className="mb-3 text-xs text-gray-500">
+            {filtered.length} of {data?.length ?? 0} mints
+          </p>
+        )}
+
         {isLoading && (
           <div className="space-y-3" aria-busy="true">
             {Array.from({ length: 6 }).map((_, i) => (
diff --git a/src/pages/WalletPage.tsx b/src/pages/WalletPage.tsx
index 046f4db..9a20bff 100644
--- a/src/pages/WalletPage.tsx
+++ b/src/pages/WalletPage.tsx
@@ -1,5 +1,6 @@
 import { useState } from 'react';
 import { useSeoMeta } from '@unhead/react';
+import { Link } from 'react-router-dom';
 import { Layout } from '@/components/Layout';
 import { PageHeader } from '@/components/PageHeader';
 import { WalletModal } from '@/components/WalletModal';
@@ -26,6 +27,7 @@ import {
   ChevronDown,
   ChevronUp,
   Wallet,
+  Coins,
 } from 'lucide-react';
 
 // ─── Wallet status bar ────────────────────────────────────────────────────────
@@ -257,6 +259,16 @@ export default function WalletPage() {
             <CashuWalletCard />
             <EscrowKeyCard />
 
+            <Link
+              to="/mints"
+              className="flex items-center justify-between gap-3 rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3 transition-colors hover:bg-white/[0.06]"
+            >
+              <span className="flex items-center gap-2 text-sm font-medium text-white">
+                <Coins className="h-4 w-4 text-[#ccff00]" /> Browse Cashu mints
+              </span>
+              <ChevronRight className="h-4 w-4 text-gray-500" />
+            </Link>
+
             {/* Get a wallet — collapsed by default */}
             <GetAWallet />