feat: ship creator journey v2 and profile updates

This commit is contained in:
2026-04-12 21:42:07 +02:00
parent a2457f4e49
commit d5cff21ea2
335 changed files with 20147 additions and 1545 deletions

View File

@@ -19,6 +19,7 @@ function KpiCard({ icon, label, value, color = 'text-sky-400' }) {
* KPI overview cards. Charts can be added here once chart infrastructure exists.
*/
export default function TabStats({ stats, followerCount, followAnalytics }) {
const medalTotals = stats?.medal_totals ?? null
const kpis = [
{ icon: 'fa-eye', label: 'Profile Views', value: stats?.profile_views_count, color: 'text-sky-400' },
{ icon: 'fa-images', label: 'Uploads', value: stats?.uploads_count, color: 'text-violet-400' },
@@ -62,6 +63,31 @@ export default function TabStats({ stats, followerCount, followAnalytics }) {
<KpiCard key={kpi.label} {...kpi} />
))}
</div>
<div className="mt-8 rounded-2xl border border-white/10 bg-white/4 p-5 shadow-xl shadow-black/20">
<div className="flex items-center justify-between gap-4">
<div>
<h3 className="text-xs font-semibold uppercase tracking-widest text-slate-500">Medal Breakdown</h3>
<p className="mt-2 text-sm text-slate-400">Real medal totals collected across all public artworks.</p>
</div>
<div className="text-right">
<div className="text-xs uppercase tracking-widest text-slate-500">Weighted Score</div>
<div className="mt-1 text-2xl font-bold text-white tabular-nums">{Number(medalTotals?.score_total ?? 0).toLocaleString()}</div>
</div>
</div>
<div className="mt-4 grid grid-cols-2 gap-3 md:grid-cols-4">
{[
{ label: 'Gold', value: medalTotals?.gold ?? 0, color: 'text-amber-300' },
{ label: 'Silver', value: medalTotals?.silver ?? 0, color: 'text-slate-300' },
{ label: 'Bronze', value: medalTotals?.bronze ?? 0, color: 'text-orange-300' },
{ label: 'Total Medals', value: medalTotals?.count ?? 0, color: 'text-cyan-300' },
].map((item) => (
<div key={item.label} className="rounded-2xl border border-white/10 bg-black/15 px-4 py-4">
<div className="text-[11px] uppercase tracking-widest text-slate-500">{item.label}</div>
<div className={`mt-2 text-2xl font-semibold tabular-nums ${item.color}`}>{Number(item.value).toLocaleString()}</div>
</div>
))}
</div>
</div>
<h3 className="mt-8 mb-4 text-xs font-semibold uppercase tracking-widest text-slate-500 flex items-center gap-2">
<i className="fa-solid fa-user-group text-emerald-400 fa-fw" />
Follow Growth