yvg/pounce
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Inbox: Hunt-style tabs + Yield: Coming soon banner
Some checks failed
CI / Frontend Lint & Type Check (push) Has been cancelled
Details
CI / Frontend Build (push) Has been cancelled
Details
CI / Backend Lint (push) Has been cancelled
Details
CI / Backend Tests (push) Has been cancelled
Details
CI / Docker Build (push) Has been cancelled
Details
CI / Security Scan (push) Has been cancelled
Details
Deploy / Build & Push Images (push) Has been cancelled
Details
Deploy / Deploy to Server (push) Has been cancelled
Details
Deploy / Notify (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Yves Gugger
2025-12-17 08:59:08 +01:00
parent ab27cb1295
commit ac9ad41d86
2 changed files with 98 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
frontend/src/app/terminal/inbox/page.tsx
View File

@ -75,6 +75,12 @@ type Message = {
type InboxTab = 'buying' | 'selling'
// Tab config like Hunt page
const TABS: Array<{ key: InboxTab; label: string; shortLabel: string; icon: any; color: string }> = [
{ key: 'buying', label: 'Buying', shortLabel: 'Buying', icon: ShoppingCart, color: 'accent' },
{ key: 'selling', label: 'Selling', shortLabel: 'Selling', icon: Tag, color: 'blue' },
]
export default function InboxPage() {
const { user, subscription, logout, checkAuth } = useStore()
const searchParams = useSearchParams()
@ -294,43 +300,78 @@ export default function InboxPage() {
</div>
</section>
{/* TABS */}
{/* TABS - Hunt page style */}
<section className="px-4 lg:px-10 pb-4">
<div className="flex border border-white/[0.08] bg-white/[0.02]">
{/* Desktop Tabs */}
<div className="hidden lg:flex gap-2">
{TABS.filter(t => t.key === 'buying' || isSeller).map((t) => {
const isActive = activeTab === t.key
const count = t.key === 'buying' ? buyerThreads.length : sellerUnread
return (
<button
type="button"
onClick={() => setActiveTab('buying')}
key={t.key}
onClick={() => setActiveTab(t.key)}
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'
'flex items-center gap-2 px-4 py-2.5 border transition-all',
isActive
? t.color === 'accent'
? 'border-accent/40 bg-accent/10 text-accent'
: 'border-blue-500/40 bg-blue-500/10 text-blue-400'
: 'border-white/[0.08] bg-white/[0.02] text-white/50 hover:text-white hover:border-white/20'
)}
>
<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>
<t.icon className="w-4 h-4" />
<span className="text-xs font-mono uppercase tracking-wider">{t.label}</span>
{count > 0 && (
<span className={clsx(
'min-w-[18px] h-[18px] flex items-center justify-center text-[10px] font-bold rounded-full',
isActive
? t.color === 'accent' ? 'bg-accent text-black' : 'bg-blue-500 text-white'
: 'bg-white/10 text-white/60'
)}>
{count > 99 ? '99+' : count}
</span>
)}
</button>
{isSeller && (
)
})}
</div>
{/* Mobile Tabs - Scrollable */}
<div className="lg:hidden -mx-4 px-4 overflow-x-auto">
<div className="flex gap-1 min-w-max pb-1">
{TABS.filter(t => t.key === 'buying' || isSeller).map((t) => {
const isActive = activeTab === t.key
const count = t.key === 'buying' ? buyerThreads.length : sellerUnread
return (
<button
type="button"
onClick={() => setActiveTab('selling')}
key={t.key}
onClick={() => setActiveTab(t.key)}
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'
'flex items-center gap-1.5 px-3 py-2 border transition-all shrink-0',
isActive
? t.color === 'accent'
? 'border-accent/40 bg-accent/10 text-accent'
: 'border-blue-500/40 bg-blue-500/10 text-blue-400'
: 'border-white/[0.08] bg-white/[0.02] text-white/40'
)}
>
<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>
<t.icon className="w-4 h-4" />
<span className="text-[11px] font-mono uppercase tracking-wide">{t.shortLabel}</span>
{count > 0 && (
<span className={clsx(
'min-w-[16px] h-[16px] flex items-center justify-center text-[9px] font-bold rounded-full',
isActive
? t.color === 'accent' ? 'bg-accent text-black' : 'bg-blue-500 text-white'
: 'bg-white/10 text-white/50'
)}>
{count > 9 ? '9+' : count}
</span>
)}
</button>
)}
)
})}
</div>
</div>
</section>

22
frontend/src/app/terminal/yield/page.tsx
View File

@ -418,8 +418,28 @@ export default function YieldPage() {
</div>
</header>
{/* COMING SOON BANNER */}
<section className="px-4 lg:px-10 pt-4 lg:pt-10">
<div className="bg-amber-400/5 border border-amber-400/20 p-4 flex items-start gap-4">
<div className="w-10 h-10 bg-amber-400/10 border border-amber-400/20 flex items-center justify-center shrink-0">
<Sparkles className="w-5 h-5 text-amber-400" />
</div>
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 mb-1">
<h3 className="text-sm font-bold text-amber-400">Feature in Development</h3>
<span className="px-2 py-0.5 bg-amber-400/20 text-amber-400 text-[9px] font-mono uppercase tracking-wider">Coming Soon</span>
</div>
<p className="text-xs text-white/50 font-mono leading-relaxed">
We're building an automated yield system for your parked domains.
Soon you'll be able to monetize idle domains with intelligent traffic routing.
Stay tuned for updates!
</p>
</div>
</div>
</section>
{/* DESKTOP HEADER */}
<section className="hidden lg:block px-10 pt-10 pb-6">
<section className="hidden lg:block px-10 pt-6 pb-6">
<div className="flex items-end justify-between gap-6">
<div className="space-y-3">
<div className="flex items-center gap-2">