Inbox: Unread badges, Seller Inbox, Polling updates

backend/app/api/listings.py

@@ -1474,3 +1474,168 @@ async def check_dns_verification(
             "message": "DNS check failed. Please try again in a few minutes.",
         }
 
+
+# ============== Inbox API (Unified Buyer + Seller) ==============
+
+@router.get("/inbox/counts")
+async def get_inbox_counts(
+    current_user: User = Depends(get_current_user),
+    db: AsyncSession = Depends(get_db),
+):
+    """
+    Get unread message/inquiry counts for both Buyer and Seller roles.
+    Used for badge display in navigation.
+    """
+    # BUYER: Count inquiries where there are unread seller messages
+    # A message is "unread" for buyer if sender_user_id != buyer_user_id and no newer message from buyer
+    buyer_inquiries = await db.execute(
+        select(ListingInquiry).where(ListingInquiry.buyer_user_id == current_user.id)
+    )
+    buyer_inqs = list(buyer_inquiries.scalars().all())
+    
+    buyer_unread = 0
+    for inq in buyer_inqs:
+        # Get the latest message
+        latest_msg = await db.execute(
+            select(ListingInquiryMessage)
+            .where(ListingInquiryMessage.inquiry_id == inq.id)
+            .order_by(ListingInquiryMessage.created_at.desc())
+            .limit(1)
+        )
+        msg = latest_msg.scalar_one_or_none()
+        # If latest message is from seller (not buyer), it's unread
+        if msg and msg.sender_user_id != current_user.id:
+            buyer_unread += 1
+    
+    # SELLER: Count new/unread inquiries across all listings
+    seller_listings = await db.execute(
+        select(DomainListing.id).where(DomainListing.user_id == current_user.id)
+    )
+    listing_ids = [lid for (lid,) in seller_listings.fetchall()]
+    
+    seller_unread = 0
+    if listing_ids:
+        # Count inquiries that are 'new' (never read)
+        new_count = await db.execute(
+            select(func.count(ListingInquiry.id)).where(
+                and_(
+                    ListingInquiry.listing_id.in_(listing_ids),
+                    ListingInquiry.status == "new",
+                )
+            )
+        )
+        seller_unread = new_count.scalar() or 0
+        
+        # Also count inquiries where latest message is from buyer (unread reply)
+        for lid in listing_ids:
+            inqs_result = await db.execute(
+                select(ListingInquiry).where(
+                    and_(
+                        ListingInquiry.listing_id == lid,
+                        ListingInquiry.status.notin_(["closed", "spam"]),
+                    )
+                )
+            )
+            for inq in inqs_result.scalars().all():
+                if inq.status == "new":
+                    continue  # Already counted
+                latest_msg = await db.execute(
+                    select(ListingInquiryMessage)
+                    .where(ListingInquiryMessage.inquiry_id == inq.id)
+                    .order_by(ListingInquiryMessage.created_at.desc())
+                    .limit(1)
+                )
+                msg = latest_msg.scalar_one_or_none()
+                # If latest message is from buyer (not seller), it's unread for seller
+                if msg and msg.sender_user_id != current_user.id:
+                    seller_unread += 1
+    
+    return {
+        "buyer_unread": buyer_unread,
+        "seller_unread": seller_unread,
+        "total_unread": buyer_unread + seller_unread,
+    }
+
+
+@router.get("/inbox/seller")
+async def get_seller_inbox(
+    current_user: User = Depends(get_current_user),
+    db: AsyncSession = Depends(get_db),
+    status_filter: Optional[str] = Query(None, enum=["all", "new", "read", "replied", "closed", "spam"]),
+):
+    """
+    Seller Inbox: Get all inquiries across all listings owned by the current user.
+    This provides a unified inbox view for sellers.
+    """
+    # Get all listings owned by user
+    listings_result = await db.execute(
+        select(DomainListing).where(DomainListing.user_id == current_user.id)
+    )
+    listings = {l.id: l for l in listings_result.scalars().all()}
+    
+    if not listings:
+        return {"inquiries": [], "total": 0, "unread": 0}
+    
+    # Build query for inquiries
+    query = (
+        select(ListingInquiry)
+        .where(ListingInquiry.listing_id.in_(listings.keys()))
+        .order_by(ListingInquiry.created_at.desc())
+    )
+    
+    if status_filter and status_filter != "all":
+        query = query.where(ListingInquiry.status == status_filter)
+    
+    result = await db.execute(query)
+    inquiries = list(result.scalars().all())
+    
+    # Count unread
+    unread_count = sum(1 for inq in inquiries if inq.status == "new" or not inq.read_at)
+    
+    # Build response with listing info
+    response_items = []
+    for inq in inquiries:
+        listing = listings.get(inq.listing_id)
+        if not listing:
+            continue
+        
+        # Get latest message for preview
+        latest_msg_result = await db.execute(
+            select(ListingInquiryMessage)
+            .where(ListingInquiryMessage.inquiry_id == inq.id)
+            .order_by(ListingInquiryMessage.created_at.desc())
+            .limit(1)
+        )
+        latest_msg = latest_msg_result.scalar_one_or_none()
+        
+        # Check if has unread reply from buyer
+        has_unread_reply = False
+        if latest_msg and latest_msg.sender_user_id != current_user.id and inq.status not in ["closed", "spam"]:
+            has_unread_reply = True
+        
+        response_items.append({
+            "id": inq.id,
+            "listing_id": listing.id,
+            "domain": listing.domain,
+            "slug": listing.slug,
+            "buyer_name": inq.name,
+            "buyer_email": inq.email,
+            "offer_amount": inq.offer_amount,
+            "status": inq.status,
+            "created_at": inq.created_at.isoformat(),
+            "read_at": inq.read_at.isoformat() if inq.read_at else None,
+            "replied_at": getattr(inq, "replied_at", None),
+            "closed_at": inq.closed_at.isoformat() if getattr(inq, "closed_at", None) else None,
+            "closed_reason": getattr(inq, "closed_reason", None),
+            "has_unread_reply": has_unread_reply,
+            "last_message_preview": (latest_msg.body[:100] + "..." if len(latest_msg.body) > 100 else latest_msg.body) if latest_msg else inq.message[:100],
+            "last_message_at": latest_msg.created_at.isoformat() if latest_msg else inq.created_at.isoformat(),
+            "last_message_is_buyer": latest_msg.sender_user_id != current_user.id if latest_msg else True,
+        })
+    
+    return {
+        "inquiries": response_items,
+        "total": len(response_items),
+        "unread": unread_count,
+    }
+

frontend/src/app/terminal/inbox/page.tsx

@@ -20,12 +20,20 @@ import {
   LogOut,
   Crown,
   Zap,
+  Tag,
+  ShoppingCart,
+  DollarSign,
+  CheckCircle,
+  AlertCircle,
+  Mail,
+  ExternalLink,
 } from 'lucide-react'
 import Link from 'next/link'
 import Image from 'next/image'
 import clsx from 'clsx'
 
-type Thread = {
+// Types
+type BuyerThread = {
   id: number
   listing_id: number
   domain: string
@@ -36,6 +44,26 @@ type Thread = {
   closed_reason: string | null
 }
 
+type SellerInquiry = {
+  id: number
+  listing_id: number
+  domain: string
+  slug: string
+  buyer_name: string
+  buyer_email: string
+  offer_amount: number | null
+  status: string
+  created_at: string
+  read_at: string | null
+  replied_at: string | null
+  closed_at: string | null
+  closed_reason: string | null
+  has_unread_reply: boolean
+  last_message_preview: string
+  last_message_at: string
+  last_message_is_buyer: boolean
+}
+
 type Message = {
   id: number
   inquiry_id: number
@@ -45,16 +73,28 @@ type Message = {
   created_at: string
 }
 
+type InboxTab = 'buying' | 'selling'
+
 export default function InboxPage() {
   const { user, subscription, logout, checkAuth } = useStore()
   const searchParams = useSearchParams()
   const openInquiryId = searchParams.get('inquiry')
+  const initialTab = searchParams.get('tab') as InboxTab | null
 
-  const [threads, setThreads] = useState<Thread[]>([])
+  const [activeTab, setActiveTab] = useState<InboxTab>(initialTab || 'buying')
-  const [loading, setLoading] = useState(true)
+  
+  // Buyer state
+  const [buyerThreads, setBuyerThreads] = useState<BuyerThread[]>([])
+  const [loadingBuyer, setLoadingBuyer] = useState(true)
+  
+  // Seller state
+  const [sellerInquiries, setSellerInquiries] = useState<SellerInquiry[]>([])
+  const [loadingSeller, setLoadingSeller] = useState(true)
+  const [sellerUnread, setSellerUnread] = useState(0)
+  
+  // Shared state
   const [menuOpen, setMenuOpen] = useState(false)
-
+  const [activeThread, setActiveThread] = useState<BuyerThread | SellerInquiry | null>(null)
-  const [activeThread, setActiveThread] = useState<Thread | null>(null)
   const [messages, setMessages] = useState<Message[]>([])
   const [loadingMessages, setLoadingMessages] = useState(false)
   const [sending, setSending] = useState(false)
@@ -65,54 +105,91 @@ export default function InboxPage() {
 
   const tierName = subscription?.tier_name || subscription?.tier || 'Scout'
   const TierIcon = tierName === 'Tycoon' ? Crown : tierName === 'Trader' ? TrendingUp : Zap
+  const isSeller = tierName !== 'Scout' // Scout can't list domains
 
-  const drawerNavSections = [
+  // Load buyer threads
-    { title: 'Discover', items: [
+  const loadBuyerThreads = useCallback(async () => {
-      { href: '/terminal/hunt', label: 'Radar', icon: Target },
+    setLoadingBuyer(true)
-      { href: '/terminal/market', label: 'Market', icon: Gavel },
-      { href: '/terminal/intel', label: 'Intel', icon: TrendingUp },
-    ]},
-    { title: 'Manage', items: [
-      { href: '/terminal/watchlist', label: 'Watchlist', icon: Eye },
-      { href: '/terminal/inbox', label: 'Inbox', icon: MessageSquare, active: true },
-    ]},
-  ]
-
-  const loadThreads = useCallback(async () => {
-    setLoading(true)
     setError(null)
     try {
       const data = await api.getMyInquiryThreads()
-      setThreads(data)
+      setBuyerThreads(data)
     } catch (err: any) {
-      setError(err?.message || 'Failed to load inbox')
+      // Silently fail - might not have any threads
     } finally {
-      setLoading(false)
+      setLoadingBuyer(false)
     }
   }, [])
 
-  useEffect(() => { loadThreads() }, [loadThreads])
+  // Load seller inquiries
+  const loadSellerInquiries = useCallback(async () => {
+    if (!isSeller) {
+      setLoadingSeller(false)
+      return
+    }
+    setLoadingSeller(true)
+    try {
+      const data = await api.getSellerInbox()
+      setSellerInquiries(data.inquiries)
+      setSellerUnread(data.unread)
+    } catch (err: any) {
+      // Silently fail
+    } finally {
+      setLoadingSeller(false)
+    }
+  }, [isSeller])
 
+  useEffect(() => {
+    loadBuyerThreads()
+    loadSellerInquiries()
+    
+    // Poll inbox counts every 30 seconds for badge updates
+    const pollInterval = setInterval(() => {
+      loadBuyerThreads()
+      loadSellerInquiries()
+    }, 30000)
+    
+    return () => clearInterval(pollInterval)
+  }, [loadBuyerThreads, loadSellerInquiries])
+
+  // Handle URL parameter for opening specific inquiry
   const threadsById = useMemo(() => {
-    const map = new Map<number, Thread>()
+    const map = new Map<number, BuyerThread | SellerInquiry>()
-    threads.forEach(t => map.set(t.id, t))
+    buyerThreads.forEach(t => map.set(t.id, t))
+    sellerInquiries.forEach(t => map.set(t.id, t))
     return map
-  }, [threads])
+  }, [buyerThreads, sellerInquiries])
 
   useEffect(() => {
     if (!openInquiryId) return
     const id = Number(openInquiryId)
     if (!Number.isFinite(id)) return
     const t = threadsById.get(id)
-    if (t) setActiveThread(t)
+    if (t) {
+      setActiveThread(t)
+      // Determine which tab
+      if ('buyer_name' in t) {
+        setActiveTab('selling')
+      } else {
+        setActiveTab('buying')
+      }
+    }
   }, [openInquiryId, threadsById])
 
-  const loadMessages = useCallback(async (thread: Thread) => {
+  // Load messages for thread
+  const loadMessages = useCallback(async (thread: BuyerThread | SellerInquiry) => {
     setLoadingMessages(true)
     setError(null)
     try {
-      const data = await api.getInquiryMessagesAsBuyer(thread.id)
+      if ('buyer_name' in thread) {
-      setMessages(data)
+        // Seller loading buyer's messages
+        const data = await api.getInquiryMessagesAsSeller(thread.listing_id, thread.id)
+        setMessages(data)
+      } else {
+        // Buyer loading their own messages
+        const data = await api.getInquiryMessagesAsBuyer(thread.id)
+        setMessages(data)
+      }
     } catch (err: any) {
       setError(err?.message || 'Failed to load messages')
     } finally {
@@ -123,8 +200,16 @@ export default function InboxPage() {
   useEffect(() => {
     if (!activeThread) return
     loadMessages(activeThread)
+    
+    // Poll for new messages every 15 seconds when thread is open
+    const pollInterval = setInterval(() => {
+      loadMessages(activeThread)
+    }, 15000)
+    
+    return () => clearInterval(pollInterval)
   }, [activeThread, loadMessages])
 
+  // Send message
   const sendMessage = useCallback(async () => {
     if (!activeThread) return
     const body = draft.trim()
@@ -133,7 +218,14 @@ export default function InboxPage() {
     setSending(true)
     setError(null)
     try {
-      const created = await api.sendInquiryMessageAsBuyer(activeThread.id, body)
+      let created: Message
+      if ('buyer_name' in activeThread) {
+        // Seller replying
+        created = await api.sendInquiryMessageAsSeller(activeThread.listing_id, activeThread.id, body)
+      } else {
+        // Buyer replying
+        created = await api.sendInquiryMessageAsBuyer(activeThread.id, body)
+      }
       setDraft('')
       setMessages(prev => [...prev, created])
     } catch (err: any) {
@@ -143,6 +235,27 @@ export default function InboxPage() {
     }
   }, [activeThread, draft])
 
+  // Refresh on tab change
+  useEffect(() => {
+    setActiveThread(null)
+    setMessages([])
+    setDraft('')
+    if (activeTab === 'buying') {
+      loadBuyerThreads()
+    } else {
+      loadSellerInquiries()
+    }
+  }, [activeTab, loadBuyerThreads, loadSellerInquiries])
+
+  const isLoading = activeTab === 'buying' ? loadingBuyer : loadingSeller
+  const currentItems = activeTab === 'buying' ? buyerThreads : sellerInquiries
+  const emptyMessage = activeTab === 'buying' 
+    ? 'No inquiries yet. Browse Pounce Direct deals and send an inquiry.'
+    : 'No buyer inquiries yet. List a domain for sale to receive offers.'
+  const emptyAction = activeTab === 'buying' 
+    ? { href: '/acquire', label: 'Browse Deals' }
+    : { href: '/terminal/listing', label: 'List Domain' }
+
   return (
     <div className="min-h-screen bg-[#020202]">
       <div className="hidden lg:block"><Sidebar /></div>
@@ -175,141 +288,271 @@ export default function InboxPage() {
                 <span className="text-white">Inbox</span>
               </h1>
               <p className="text-sm text-white/40 font-mono max-w-lg">
-                Your inquiry threads with verified sellers.
+                Manage your domain inquiries and conversations.
               </p>
             </div>
           </div>
         </section>
 
+        {/* TABS */}
+        <section className="px-4 lg:px-10 pb-4">
+          <div className="flex border border-white/[0.08] bg-white/[0.02]">
+            <button
+              type="button"
+              onClick={() => setActiveTab('buying')}
+              className={clsx(
+                'flex-1 py-3 flex items-center justify-center gap-2 text-xs font-mono uppercase tracking-wider transition-all border-b-2',
+                activeTab === 'buying'
+                  ? 'bg-accent/10 text-accent border-accent'
+                  : 'text-white/40 hover:text-white border-transparent'
+              )}
+            >
+              <ShoppingCart className="w-4 h-4" />
+              Buying
+              {buyerThreads.length > 0 && (
+                <span className="ml-1 px-1.5 py-0.5 bg-white/10 text-[10px]">{buyerThreads.length}</span>
+              )}
+            </button>
+            {isSeller && (
+              <button
+                type="button"
+                onClick={() => setActiveTab('selling')}
+                className={clsx(
+                  'flex-1 py-3 flex items-center justify-center gap-2 text-xs font-mono uppercase tracking-wider transition-all border-b-2',
+                  activeTab === 'selling'
+                    ? 'bg-accent/10 text-accent border-accent'
+                    : 'text-white/40 hover:text-white border-transparent'
+                )}
+              >
+                <Tag className="w-4 h-4" />
+                Selling
+                {sellerUnread > 0 && (
+                  <span className="ml-1 px-1.5 py-0.5 bg-accent text-black text-[10px] font-bold">{sellerUnread}</span>
+                )}
+              </button>
+            )}
+          </div>
+        </section>
+
+        {/* CONTENT */}
         <section className="px-4 lg:px-10 pb-28 lg:pb-10">
-          {loading ? (
+          {isLoading ? (
             <div className="flex items-center justify-center py-20">
               <Loader2 className="w-6 h-6 text-accent animate-spin" />
             </div>
-          ) : error ? (
+          ) : error && !activeThread ? (
             <div className="p-4 border border-rose-400/20 bg-rose-400/5 text-rose-300 text-sm font-mono">{error}</div>
-          ) : threads.length === 0 ? (
+          ) : currentItems.length === 0 ? (
             <div className="text-center py-16 border border-dashed border-white/[0.08]">
               <MessageSquare className="w-8 h-8 text-white/10 mx-auto mb-3" />
-              <p className="text-white/40 text-sm font-mono">No threads yet</p>
+              <p className="text-white/40 text-sm font-mono">{emptyMessage}</p>
-              <p className="text-white/25 text-xs font-mono mt-1">Browse Pounce Direct deals and send an inquiry.</p>
+              <Link href={emptyAction.href} className="mt-4 inline-flex items-center gap-2 px-4 py-2 bg-accent text-black text-xs font-bold uppercase">
-              <Link href="/acquire" className="mt-4 inline-flex items-center gap-2 px-4 py-2 bg-accent text-black text-xs font-bold uppercase">
+                {emptyAction.label}
-                View Deals
               </Link>
             </div>
           ) : (
-            <div className="grid lg:grid-cols-[360px_1fr] gap-4">
+            <div className="grid lg:grid-cols-[400px_1fr] gap-4">
-              {/* Thread list */}
+              {/* Thread/Inquiry list */}
-              <div className="border border-white/[0.08] bg-white/[0.02]">
+              <div className="border border-white/[0.08] bg-white/[0.02] max-h-[600px] overflow-auto">
-                <div className="px-3 py-2 border-b border-white/[0.08] text-[10px] font-mono text-white/40 uppercase tracking-wider">
+                <div className="px-3 py-2 border-b border-white/[0.08] text-[10px] font-mono text-white/40 uppercase tracking-wider sticky top-0 bg-[#0A0A0A]">
-                  Threads
+                  {activeTab === 'buying' ? 'Your Inquiries' : 'Buyer Inquiries'}
                 </div>
                 <div className="divide-y divide-white/[0.06]">
-                  {threads.map(t => (
+                  {activeTab === 'buying' ? (
-                    <button
+                    // Buyer view
-                      key={t.id}
+                    buyerThreads.map(t => (
-                      type="button"
+                      <button
-                      onClick={() => setActiveThread(t)}
+                        key={t.id}
-                      className={clsx(
+                        type="button"
-                        'w-full text-left px-3 py-3 hover:bg-white/[0.03] transition-colors',
+                        onClick={() => setActiveThread(t)}
-                        activeThread?.id === t.id && 'bg-white/[0.03]'
+                        className={clsx(
-                      )}
+                          'w-full text-left px-3 py-3 hover:bg-white/[0.03] transition-colors',
-                    >
+                          activeThread?.id === t.id && 'bg-white/[0.03]'
-                      <div className="flex items-center justify-between gap-3">
+                        )}
-                        <div className="min-w-0">
+                      >
-                          <div className="text-sm font-bold text-white font-mono truncate">{t.domain}</div>
+                        <div className="flex items-center justify-between gap-3">
-                          <div className="text-[10px] font-mono text-white/30 mt-0.5">
+                          <div className="min-w-0">
-                            {new Date(t.created_at).toLocaleDateString('en-US')}
+                            <div className="text-sm font-bold text-white font-mono truncate">{t.domain}</div>
-                            {t.status === 'closed' && t.closed_reason ? ` • closed: ${t.closed_reason}` : ''}
+                            <div className="text-[10px] font-mono text-white/30 mt-0.5">
+                              {new Date(t.created_at).toLocaleDateString('en-US')}
+                            </div>
+                          </div>
+                          <span className={clsx(
+                            'px-2 py-1 text-[9px] font-mono uppercase border shrink-0',
+                            t.status === 'closed' ? 'bg-white/[0.03] text-white/40 border-white/[0.10]' :
+                            t.status === 'spam' ? 'bg-rose-500/10 text-rose-300 border-rose-500/20' :
+                            'bg-accent/10 text-accent border-accent/20'
+                          )}>
+                            {t.status}
+                          </span>
+                        </div>
+                      </button>
+                    ))
+                  ) : (
+                    // Seller view
+                    sellerInquiries.map(inq => (
+                      <button
+                        key={inq.id}
+                        type="button"
+                        onClick={() => setActiveThread(inq)}
+                        className={clsx(
+                          'w-full text-left px-3 py-3 hover:bg-white/[0.03] transition-colors',
+                          activeThread?.id === inq.id && 'bg-white/[0.03]',
+                          inq.has_unread_reply && 'border-l-2 border-accent'
+                        )}
+                      >
+                        <div className="flex items-start justify-between gap-3">
+                          <div className="min-w-0 flex-1">
+                            <div className="flex items-center gap-2">
+                              <span className="text-sm font-bold text-white font-mono truncate">{inq.domain}</span>
+                              {inq.has_unread_reply && (
+                                <span className="w-2 h-2 bg-accent rounded-full animate-pulse shrink-0" />
+                              )}
+                            </div>
+                            <div className="text-[10px] font-mono text-white/50 mt-0.5 truncate">
+                              {inq.buyer_name} • {inq.buyer_email}
+                            </div>
+                            {inq.offer_amount && (
+                              <div className="text-[10px] font-mono text-accent mt-0.5">
+                                ${inq.offer_amount.toLocaleString()} offer
+                              </div>
+                            )}
+                            <div className="text-[10px] font-mono text-white/30 mt-1 truncate">
+                              {inq.last_message_preview}
+                            </div>
+                          </div>
+                          <div className="text-right shrink-0">
+                            <span className={clsx(
+                              'px-2 py-1 text-[9px] font-mono uppercase border',
+                              inq.status === 'new' ? 'bg-amber-400/10 text-amber-400 border-amber-400/20' :
+                              inq.status === 'closed' ? 'bg-white/[0.03] text-white/40 border-white/[0.10]' :
+                              inq.status === 'spam' ? 'bg-rose-500/10 text-rose-300 border-rose-500/20' :
+                              'bg-accent/10 text-accent border-accent/20'
+                            )}>
+                              {inq.status}
+                            </span>
+                            <div className="text-[9px] font-mono text-white/20 mt-1">
+                              {new Date(inq.last_message_at).toLocaleDateString('en-US')}
+                            </div>
                           </div>
                         </div>
-                        <span className={clsx(
+                      </button>
-                          'px-2 py-1 text-[9px] font-mono uppercase border',
+                    ))
-                          t.status === 'closed' ? 'bg-white/[0.03] text-white/40 border-white/[0.10]' :
+                  )}
-                          t.status === 'spam' ? 'bg-rose-500/10 text-rose-300 border-rose-500/20' :
-                          'bg-accent/10 text-accent border-accent/20'
-                        )}>
-                          {t.status}
-                        </span>
-                      </div>
-                    </button>
-                  ))}
                 </div>
               </div>
 
               {/* Thread detail */}
               <div className="border border-white/[0.08] bg-[#020202]">
                 {!activeThread ? (
-                  <div className="p-10 text-center text-white/40 font-mono">Select a thread</div>
+                  <div className="p-10 text-center text-white/40 font-mono">
+                    <MessageSquare className="w-8 h-8 mx-auto mb-3 text-white/10" />
+                    Select a conversation
+                  </div>
                 ) : (
                   <>
+                    {/* Thread header */}
                     <div className="px-4 py-3 border-b border-white/[0.08] flex items-center justify-between">
                       <div>
-                        <div className="text-[10px] font-mono tracking-[0.2em] text-accent uppercase">Thread</div>
+                        <div className="text-[10px] font-mono tracking-[0.2em] text-accent uppercase">
-                        <div className="text-sm font-bold text-white font-mono">{activeThread.domain}</div>
+                          {activeTab === 'buying' ? 'Thread' : 'Inquiry'}
+                        </div>
+                        <div className="text-sm font-bold text-white font-mono">
+                          {'buyer_name' in activeThread ? activeThread.domain : activeThread.domain}
+                        </div>
+                        {'buyer_name' in activeThread && (
+                          <div className="text-[10px] font-mono text-white/40 mt-0.5">
+                            From: {activeThread.buyer_name} ({activeThread.buyer_email})
+                          </div>
+                        )}
+                      </div>
+                      <div className="flex items-center gap-2">
+                        {'buyer_name' in activeThread && (
+                          <a
+                            href={`mailto:${activeThread.buyer_email}?subject=Re: ${activeThread.domain}`}
+                            className="p-2 border border-white/[0.10] bg-white/[0.03] text-white/50 hover:text-white"
+                            title="Reply via email"
+                          >
+                            <Mail className="w-4 h-4" />
+                          </a>
+                        )}
+                        <Link
+                          href={`/buy/${activeThread.slug}`}
+                          className="p-2 border border-white/[0.10] bg-white/[0.03] text-white/50 hover:text-white"
+                          title="View listing"
+                        >
+                          <ExternalLink className="w-4 h-4" />
+                        </Link>
                       </div>
-                      <Link
-                        href={`/buy/${activeThread.slug}`}
-                        className="px-3 py-2 border border-white/[0.10] bg-white/[0.03] text-white/70 hover:text-white text-[10px] font-mono uppercase"
-                        title="View listing"
-                      >
-                        View Deal
-                      </Link>
                     </div>
 
-                    <div className="p-4 space-y-3 min-h-[280px] max-h-[520px] overflow-auto">
+                    {/* Messages */}
+                    <div className="p-4 space-y-3 min-h-[280px] max-h-[450px] overflow-auto">
                       {loadingMessages ? (
                         <div className="flex items-center justify-center py-12">
                           <Loader2 className="w-6 h-6 text-accent animate-spin" />
                         </div>
                       ) : messages.length === 0 ? (
-                        <div className="text-sm font-mono text-white/40">No messages</div>
+                        <div className="text-sm font-mono text-white/40">No messages yet</div>
                       ) : (
-                        messages.map(m => (
+                        messages.map(m => {
-                          <div
+                          const isMe = m.sender_user_id === user?.id
-                            key={m.id}
+                          return (
-                            className={clsx(
+                            <div
-                              'p-3 border',
+                              key={m.id}
-                              m.sender_user_id === user?.id
+                              className={clsx(
-                                ? 'bg-accent/10 border-accent/20'
+                                'p-3 border max-w-[85%]',
-                                : 'bg-white/[0.02] border-white/[0.08]'
+                                isMe
-                            )}
+                                  ? 'bg-accent/10 border-accent/20 ml-auto'
-                          >
+                                  : 'bg-white/[0.02] border-white/[0.08]'
-                            <div className="flex items-center justify-between text-[10px] font-mono text-white/40 mb-1">
+                              )}
-                              <span>{m.sender_user_id === user?.id ? 'You' : 'Seller'}</span>
+                            >
-                              <span>{new Date(m.created_at).toLocaleString('en-US')}</span>
+                              <div className="flex items-center justify-between text-[10px] font-mono text-white/40 mb-1">
+                                <span>{isMe ? 'You' : (activeTab === 'buying' ? 'Seller' : 'Buyer')}</span>
+                                <span>{new Date(m.created_at).toLocaleString('en-US')}</span>
+                              </div>
+                              <div className="text-sm text-white/80 whitespace-pre-line">{m.body}</div>
                             </div>
-                            <div className="text-sm text-white/80 whitespace-pre-line">{m.body}</div>
+                          )
-                          </div>
+                        })
-                        ))
                       )}
                     </div>
 
+                    {/* Reply form */}
                     <div className="p-4 border-t border-white/[0.08]">
                       {activeThread.status === 'closed' || activeThread.status === 'spam' ? (
                         <div className="flex items-center gap-2 text-[11px] font-mono text-white/40">
-                          <Lock className="w-4 h-4" /> Thread is closed.
+                          <Lock className="w-4 h-4" /> This conversation is closed.
                         </div>
                       ) : (
                         <div className="flex gap-2">
                           <textarea
                             value={draft}
                             onChange={(e) => setDraft(e.target.value)}
-                            placeholder="Write a message..."
+                            onKeyDown={(e) => {
+                              if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
+                                e.preventDefault()
+                                sendMessage()
+                              }
+                            }}
+                            placeholder="Write a message... (Cmd+Enter to send)"
                             rows={2}
-                            className="flex-1 px-3 py-2 bg-[#0A0A0A] border border-white/10 text-white font-mono text-sm placeholder:text-white/20 focus:outline-none focus:border-accent"
+                            className="flex-1 px-3 py-2 bg-[#0A0A0A] border border-white/10 text-white font-mono text-sm placeholder:text-white/20 focus:outline-none focus:border-accent resize-none"
                           />
                           <button
                             type="button"
                             onClick={sendMessage}
                             disabled={sending || !draft.trim()}
-                            className="px-4 py-2 bg-accent text-black text-xs font-bold uppercase disabled:opacity-50 flex items-center gap-2"
+                            className="px-4 py-2 bg-accent text-black text-xs font-bold uppercase disabled:opacity-50 flex items-center gap-2 self-end"
                           >
                             {sending ? <Loader2 className="w-4 h-4 animate-spin" /> : <Send className="w-4 h-4" />}
                             Send
                           </button>
                         </div>
                       )}
+                      {error && (
+                        <div className="mt-2 text-[11px] font-mono text-rose-400">{error}</div>
+                      )}
                     </div>
                   </>
                 )}
@@ -326,7 +569,7 @@ export default function InboxPage() {
               <div className="p-4 border-b border-white/[0.08]">
                 <div className="flex items-center justify-between">
                   <div className="flex items-center gap-3">
-                    <Image src="/pounce-icon.png" alt="Pounce" width={24} height={24} />
+                    <Image src="/pounce-puma.png" alt="Pounce" width={24} height={24} />
                     <div>
                       <div className="text-sm font-bold text-white">Terminal</div>
                       <div className="text-[10px] font-mono text-white/40">{tierName}</div>
@@ -337,44 +580,19 @@ export default function InboxPage() {
                   </button>
                 </div>
               </div>
-              <div className="p-4 space-y-6">
+              <div className="p-4 space-y-4">
-                {drawerNavSections.map(section => (
+                <Link href="/terminal/hunt" className="flex items-center gap-3 px-3 py-2.5 border border-white/[0.08] text-white/70" onClick={() => setMenuOpen(false)}>
-                  <div key={section.title}>
+                  <Target className="w-4 h-4" /> Hunt
-                    <div className="text-[10px] font-mono text-white/30 uppercase tracking-wider mb-2">{section.title}</div>
+                </Link>
-                    <div className="space-y-1">
+                <Link href="/terminal/watchlist" className="flex items-center gap-3 px-3 py-2.5 border border-white/[0.08] text-white/70" onClick={() => setMenuOpen(false)}>
-                      {section.items.map(item => (
+                  <Eye className="w-4 h-4" /> Watchlist
-                        <Link
+                </Link>
-                          key={item.href}
+                <Link href="/terminal/listing" className="flex items-center gap-3 px-3 py-2.5 border border-white/[0.08] text-white/70" onClick={() => setMenuOpen(false)}>
-                          href={item.href}
+                  <Tag className="w-4 h-4" /> For Sale
-                          className={clsx(
+                </Link>
-                            'flex items-center gap-3 px-3 py-2.5 border border-white/[0.08] bg-white/[0.02] text-white/70 hover:text-white',
+                <div className="pt-4 border-t border-white/[0.08]">
-                            (item as any).active && 'border-accent/20 bg-accent/5 text-accent'
+                  <button onClick={() => { logout(); setMenuOpen(false) }} className="flex items-center gap-3 px-3 py-2.5 text-rose-400/60">
-                          )}
+                    <LogOut className="w-4 h-4" /> Logout
-                          onClick={() => setMenuOpen(false)}
-                        >
-                          <item.icon className="w-4 h-4" />
-                          <span className="text-sm font-medium">{item.label}</span>
-                        </Link>
-                      ))}
-                    </div>
-                  </div>
-                ))}
-
-                <div className="space-y-2 pt-4 border-t border-white/[0.08]">
-                  <Link
-                    href="/terminal/settings"
-                    className="w-full flex items-center gap-3 px-3 py-2.5 text-white/70 hover:text-white transition-colors"
-                    onClick={() => setMenuOpen(false)}
-                  >
-                    <Settings className="w-4 h-4" />
-                    <span className="text-sm font-medium">Settings</span>
-                  </Link>
-                  <button
-                    onClick={() => { logout(); setMenuOpen(false) }}
-                    className="w-full flex items-center gap-3 px-3 py-2.5 text-rose-400/60 hover:text-rose-400 transition-colors"
-                  >
-                    <LogOut className="w-4 h-4" />
-                    <span className="text-sm font-medium">Logout</span>
                   </button>
                 </div>
               </div>

frontend/src/components/Sidebar.tsx

@@ -4,6 +4,7 @@ import Link from 'next/link'
 import Image from 'next/image'
 import { usePathname } from 'next/navigation'
 import { useStore } from '@/lib/store'
+import { api } from '@/lib/api'
 import { 
   Eye, 
   TrendingUp, 
@@ -23,7 +24,7 @@ import {
   Briefcase,
   MessageSquare,
 } from 'lucide-react'
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useCallback } from 'react'
 import clsx from 'clsx'
 
 interface SidebarProps {
@@ -37,10 +38,28 @@ export function Sidebar({ collapsed: controlledCollapsed, onCollapsedChange }: S
   
   const [internalCollapsed, setInternalCollapsed] = useState(false)
   const [mobileOpen, setMobileOpen] = useState(false)
+  const [inboxCounts, setInboxCounts] = useState<{ buyer_unread: number; seller_unread: number; total_unread: number } | null>(null)
   
   const collapsed = controlledCollapsed ?? internalCollapsed
   const setCollapsed = onCollapsedChange ?? setInternalCollapsed
   
+  // Fetch inbox counts for badge
+  const fetchInboxCounts = useCallback(async () => {
+    try {
+      const counts = await api.getInboxCounts()
+      setInboxCounts(counts)
+    } catch {
+      // Silently fail - user might not be authenticated yet
+    }
+  }, [])
+
+  useEffect(() => {
+    fetchInboxCounts()
+    // Poll every 60 seconds for updates
+    const interval = setInterval(fetchInboxCounts, 60000)
+    return () => clearInterval(interval)
+  }, [fetchInboxCounts])
+  
   useEffect(() => {
     const saved = localStorage.getItem('sidebar-collapsed')
     if (saved) {
@@ -104,7 +123,7 @@ export function Sidebar({ collapsed: controlledCollapsed, onCollapsedChange }: S
       href: '/terminal/inbox',
       label: 'INBOX',
       icon: MessageSquare,
-      badge: null,
+      badge: inboxCounts?.total_unread || null,
     },
     { 
       href: '/terminal/sniper', 
@@ -263,8 +282,10 @@ export function Sidebar({ collapsed: controlledCollapsed, onCollapsedChange }: S
                       "w-4 h-4 transition-all duration-300",
                       isDisabled ? "text-white/20" : isActive(item.href) ? "text-accent" : "text-white/40 group-hover:text-white"
                     )} />
-                    {item.badge && typeof item.badge === 'number' && !isDisabled && (
+                    {item.badge && typeof item.badge === 'number' && !isDisabled && collapsed && (
-                      <span className="absolute -top-1 -right-1 w-1.5 h-1.5 bg-accent rounded-full animate-pulse" />
+                      <span className="absolute -top-1 -right-1 min-w-[14px] h-[14px] bg-accent rounded-full flex items-center justify-center text-[9px] font-bold text-black">
+                        {item.badge > 9 ? '9+' : item.badge}
+                      </span>
                     )}
                   </div>
                   {!collapsed && (
@@ -275,6 +296,11 @@ export function Sidebar({ collapsed: controlledCollapsed, onCollapsedChange }: S
                       {item.label}
                     </span>
                   )}
+                  {item.badge && typeof item.badge === 'number' && !isDisabled && !collapsed && (
+                    <span className="min-w-[18px] h-[18px] bg-accent rounded-full flex items-center justify-center text-[10px] font-bold text-black">
+                      {item.badge > 99 ? '99+' : item.badge}
+                    </span>
+                  )}
                   {isDisabled && !collapsed && <Crown className="w-3 h-3 text-amber-500/40" />}
                 </ItemWrapper>
               )

frontend/src/lib/api.ts

@@ -578,6 +578,43 @@ class ApiClient {
     })
   }
 
+  // Inbox Counts (for badge)
+  async getInboxCounts() {
+    return this.request<{
+      buyer_unread: number
+      seller_unread: number
+      total_unread: number
+    }>('/listings/inbox/counts')
+  }
+
+  // Seller Inbox (unified view of all inquiries)
+  async getSellerInbox(statusFilter?: 'all' | 'new' | 'read' | 'replied' | 'closed' | 'spam') {
+    const params = statusFilter && statusFilter !== 'all' ? `?status_filter=${statusFilter}` : ''
+    return this.request<{
+      inquiries: Array<{
+        id: number
+        listing_id: number
+        domain: string
+        slug: string
+        buyer_name: string
+        buyer_email: string
+        offer_amount: number | null
+        status: string
+        created_at: string
+        read_at: string | null
+        replied_at: string | null
+        closed_at: string | null
+        closed_reason: string | null
+        has_unread_reply: boolean
+        last_message_preview: string
+        last_message_at: string
+        last_message_is_buyer: boolean
+      }>
+      total: number
+      unread: number
+    }>(`/listings/inbox/seller${params}`)
+  }
+
   // Subscription
   async getSubscription() {
     return this.request<{