klevze/SkinbaseNova
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Make profile formatting hydration-safe

Browse Source
This commit is contained in:
test
2026-08-30 09:28:07 +02:00
parent 5db36cb29f
commit 71972afb87
9 changed files with 44 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/components/profile/tabs/TabStats.jsx
+4 -3
View File
@@ -1,4 +1,5 @@
import React from 'react'
import { formatProfileNumber } from '../../../lib/profileFormatters'
function KpiCard({ icon, label, value, color = 'text-sky-400' }) {
return (
@@ -7,7 +8,7 @@ function KpiCard({ icon, label, value, color = 'text-sky-400' }) {
<i className={`fa-solid ${icon} text-xl`} />
</div>
<div>
<p className="text-2xl font-bold text-white tabular-nums">{Number(value ?? 0).toLocaleString()}</p>
<p className="text-2xl font-bold text-white tabular-nums">{formatProfileNumber(value)}</p>
<p className="text-xs text-slate-500 mt-0.5 uppercase tracking-wider">{label}</p>
</div>
</div>
@@ -71,7 +72,7 @@ export default function TabStats({ stats, followerCount, followAnalytics }) {
</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 className="mt-1 text-2xl font-bold text-white tabular-nums">{formatProfileNumber(medalTotals?.score_total ?? 0)}</div>
</div>
</div>
<div className="mt-4 grid grid-cols-2 gap-3 md:grid-cols-4">
@@ -83,7 +84,7 @@ export default function TabStats({ stats, followerCount, followAnalytics }) {
].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 className={`mt-2 text-2xl font-semibold tabular-nums ${item.color}`}>{formatProfileNumber(item.value)}</div>
</div>
))}
</div>