Crowmate/Wyview
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: change the DA to something more readable

Browse Source
This commit is contained in:
Pierre Ryssen
2026-03-11 12:26:45 +01:00
parent cd15c81b53
commit 9642f2511a
22 changed files with 136 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
app/tiktok/page.tsx
View File

@@ -69,7 +69,7 @@ export default function TikTokPage() {
<Music2 size={18} className="text-pink-400" />
</div>
<div>
<div className="text-[9px] font-mono tracking-[0.3em] text-pink-400/50 uppercase mb-0.5">Plateforme</div>
<div className="text-[9px] font-mono tracking-[0.3em] text-pink-400/70 uppercase mb-0.5">Plateforme</div>
<h1 className="text-2xl font-black tracking-widest text-white uppercase">TikTok</h1>
</div>
</div>
@@ -99,8 +99,8 @@ export default function TikTokPage() {
{/* Chargement */}
{loading && (
<div className="flex items-center justify-center min-h-[200px] gap-3 text-[#3a5a3a] font-mono text-xs">
<Loader2 size={16} className="animate-spin text-pink-400/40" />
<div className="flex items-center justify-center min-h-[200px] gap-3 text-[#6a8a6a] font-mono text-xs">
<Loader2 size={16} className="animate-spin text-pink-400/60" />
Chargement...
</div>
)}
@@ -109,12 +109,12 @@ export default function TikTokPage() {
{!loading && stats && (
<>
{stats.displayName && (
<div className="flex items-center gap-3 mb-6 px-4 py-3 bg-pink-500/5 border border-pink-500/20 rounded-sm">
<div className="flex items-center gap-3 mb-6 px-4 py-3 bg-pink-500/8 border border-pink-500/25 rounded-sm">
{stats.avatarUrl && (
<img src={stats.avatarUrl} alt="avatar" className="w-8 h-8 rounded-full object-cover border border-pink-500/20" />
<img src={stats.avatarUrl} alt="avatar" className="w-8 h-8 rounded-full object-cover border border-pink-500/30" />
)}
<span className="text-pink-400 font-mono text-sm font-bold">{stats.displayName}</span>
<span className="text-[9px] font-mono tracking-widest text-pink-400/30 uppercase ml-auto">Connecté</span>
<span className="text-pink-300 font-mono text-sm font-bold">{stats.displayName}</span>
<span className="text-[9px] font-mono tracking-widest text-pink-400/50 uppercase ml-auto">Connecté</span>
</div>
)}
@@ -149,14 +149,14 @@ export default function TikTokPage() {
{/* Non connecté */}
{!loading && !stats && !error && (
<div className="bg-[#0d1210] border border-[#1a2a1a] rounded-sm p-12 flex flex-col items-center justify-center gap-5 min-h-[240px]">
<Music2 size={36} className="text-pink-400/15" />
<p className="text-[#3a5a3a] font-mono text-xs tracking-widest text-center uppercase">
<div className="bg-[#111a14] border border-[#1e2d1e] rounded-sm p-12 flex flex-col items-center justify-center gap-5 min-h-[240px]">
<Music2 size={36} className="text-pink-400/30" />
<p className="text-[#7a9a7a] font-mono text-xs tracking-widest text-center uppercase">
Connectez votre compte TikTok<br />pour afficher vos statistiques
</p>
<a
href="/api/tiktok/connect"
className="flex items-center gap-2 px-5 py-2.5 text-[10px] font-mono tracking-widest uppercase bg-pink-500/10 border border-pink-500/30 text-pink-400 hover:bg-pink-500/20 hover:border-pink-500/50 rounded-sm transition-colors"
className="flex items-center gap-2 px-5 py-2.5 text-[10px] font-mono tracking-widest uppercase bg-pink-500/10 border border-pink-500/40 text-pink-300 hover:bg-pink-500/20 hover:border-pink-500/60 rounded-sm transition-colors"
>
<Link2 size={13} />
Connecter TikTok
@@ -166,10 +166,10 @@ export default function TikTokPage() {
{/* Erreur API */}
{!loading && error && (
<div className="bg-[#0d1210] border border-red-500/20 rounded-sm p-8 flex flex-col items-center justify-center gap-3 min-h-[200px]">
<AlertTriangle size={28} className="text-red-400/40" />
<p className="text-red-400/60 font-mono text-xs tracking-widest text-center uppercase">{error}</p>
<button onClick={loadStats} className="text-[10px] font-mono tracking-widest text-[#3a5a3a] hover:text-pink-400 uppercase transition-colors">
<div className="bg-[#111a14] border border-red-500/25 rounded-sm p-8 flex flex-col items-center justify-center gap-3 min-h-[200px]">
<AlertTriangle size={28} className="text-red-400/60" />
<p className="text-red-400/80 font-mono text-xs tracking-widest text-center uppercase">{error}</p>
<button onClick={loadStats} className="text-[10px] font-mono tracking-widest text-[#6a8a6a] hover:text-pink-400 uppercase transition-colors">
Réessayer
</button>
</div>