feat: revamp dashboard, trades, and add landing/legal pages

- Major UI updates across dashboard, analytics, posts, trades, settings
- New landing page, robots/sitemap, contact/privacy/terms pages
- Updated globals.css with extensive styling and new landing.css
- Refactor signedRequest, realtime data hook, and dashboard store

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
k
2026-04-25 16:04:57 +08:00
parent 83e5892ddf
commit 040e1df685
28 changed files with 4133 additions and 690 deletions
+8 -69
View File
@@ -3,74 +3,12 @@
import { useState, useEffect } from 'react'
import type { TrumpPost } from '@/types'
import { getPosts } from '@/lib/api'
import PostRow, { SignalPill, SourceIcon, fmtPct, timeAgo } from '@/components/dashboard/PostCards'
function PostDetail({ post, onClose }: { post: TrumpPost; onClose: () => void }) {
return (
<div className="card" style={{ padding: 24, position: 'sticky', top: 84 }}>
<div className="row between" style={{ marginBottom: 16 }}>
<span className="tiny">Signal detail</span>
<button className="icon-btn" onClick={onClose} style={{ width: 28, height: 28 }}>
<svg width="12" height="12" viewBox="0 0 24 24"><path d="M18 6L6 18M6 6l12 12" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/></svg>
</button>
</div>
<div className="row gap-s" style={{ marginBottom: 14 }}>
<SourceIcon source={post.source} />
<div>
<div style={{ fontSize: 13, fontWeight: 500 }} className="mono">@realDonaldTrump</div>
<div style={{ fontSize: 12, color: 'var(--ink-3)' }}>{new Date(post.published_at).toLocaleString()}</div>
</div>
</div>
<p style={{ fontSize: 15, lineHeight: 1.55, margin: '0 0 20px' }}>{post.text}</p>
<div className="row gap-s" style={{ marginBottom: 20 }}>
<SignalPill signal={post.signal} />
<span className={`chip ${post.sentiment === 'bullish' ? 'up' : post.sentiment === 'bearish' ? 'down' : 'neutral'}`}>{post.sentiment}</span>
</div>
<div className="tiny" style={{ marginBottom: 8 }}>AI reasoning</div>
<div style={{ padding: 14, background: 'var(--bg-sunk)', borderRadius: 10, border: '1px solid var(--line)', fontSize: 13, lineHeight: 1.55, color: 'var(--ink-2)', marginBottom: 20 }}>
{post.ai_reasoning || 'No reasoning available.'}
</div>
<div className="row between" style={{ fontSize: 12, color: 'var(--ink-3)', marginBottom: 6 }}>
<span>AI confidence</span>
<span className="mono" style={{ color: 'var(--ink)', fontWeight: 500 }}>{post.ai_confidence}%</span>
</div>
<div className="confidence-bar"><div style={{ width: post.ai_confidence + '%' }} /></div>
{post.price_impact && (
<div style={{ marginTop: 24 }}>
<div className="tiny" style={{ marginBottom: 10 }}>Actual price impact · {post.price_impact.asset}</div>
<div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: 10 }}>
{(['m5', 'm15', 'm1h'] as const).map(k => {
const v = post.price_impact![k]
const correct = post.price_impact!['correct_' + k as 'correct_m5' | 'correct_m15' | 'correct_m1h']
const label = k === 'm5' ? '5m' : k === 'm15' ? '15m' : '1h'
return (
<div key={k} style={{ padding: 12, background: 'var(--bg-sunk)', borderRadius: 10, border: '1px solid var(--line)' }}>
<div style={{ fontSize: 11, color: 'var(--ink-3)', marginBottom: 4 }}>{label}</div>
<div className={`delta ${(v ?? 0) >= 0 ? 'up' : 'down'}`} style={{ fontSize: 15 }}>{fmtPct(v)}</div>
{correct != null && (
<div style={{ fontSize: 11, color: correct ? 'var(--up)' : 'var(--down)', marginTop: 4 }}>
{correct ? '✓ correct' : '✗ missed'}
</div>
)}
</div>
)
})}
</div>
</div>
)}
</div>
)
}
import PostRow from '@/components/dashboard/PostCards'
export default function PostsPage() {
const [posts, setPosts] = useState<TrumpPost[]>([])
const [loading, setLoading] = useState(true)
const [filter, setFilter] = useState('all')
const [selected, setSelected] = useState<number | null>(null)
useEffect(() => {
getPosts(200, 1).then(setPosts).catch(() => {}).finally(() => setLoading(false))
@@ -88,8 +26,6 @@ export default function PostsPage() {
neutral: posts.filter(p => p.sentiment === 'neutral').length,
}
const selectedPost = posts.find(p => p.id === selected)
return (
<div className="page">
<div className="page-head">
@@ -112,14 +48,17 @@ export default function PostsPage() {
{loading && <div style={{ textAlign: 'center', padding: 60, color: 'var(--ink-3)' }}>Loading</div>}
<div style={{ display: 'grid', gridTemplateColumns: selected ? '1fr 420px' : '1fr', gap: 24, alignItems: 'start' }}>
{!loading && filtered.length === 0 ? (
<div className="card" style={{ padding: 48, textAlign: 'center', color: 'var(--ink-3)' }}>
No posts match the current sentiment filter.
</div>
) : (
<div className="post-stream">
{filtered.map(p => (
<PostRow key={p.id} post={p} selected={selected === p.id} onClick={() => setSelected(selected === p.id ? null : p.id)} />
<PostRow key={p.id} post={p} />
))}
</div>
{selected && selectedPost && <PostDetail post={selectedPost} onClose={() => setSelected(null)} />}
</div>
)}
</div>
)
}