All checks were successful
Deploy / deploy (push) Successful in 6m23s
- TemaSaglayici (next-themes) + alt bilgide TemaSecici - globals.css: .dark bloğunda palet token'ları çevrilir; bileşenlere dark: sınıfı yazılmaz - yüzeyler bg-white → bg-card, koyu haplar text-slate-50, SVG'lerde sabit renk yerine değişken - DESIGN.md §2.3 + tasarim-denetim kuralları (yuzey-beyaz, koyu-hap-beyaz-yazi, dark-sinif), AGENTS.md karanlık mod bölümü - docs: koyu tema denetimi raporu Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
82 lines
3.7 KiB
TypeScript
82 lines
3.7 KiB
TypeScript
import Link from "next/link";
|
||
import { ClipboardList, Coins } from "lucide-react";
|
||
import { getCurrentUser } from "@/lib/session";
|
||
import { ListemButonu } from "@/features/liste/components/listem-butonu";
|
||
import { ListeSenkron } from "@/features/liste/components/liste-senkron";
|
||
import { RybbitIdentify } from "@/components/rybbit-identify";
|
||
import { GirisLinki } from "./giris-linki";
|
||
import { SignOutButton } from "./sign-out-button";
|
||
|
||
/**
|
||
* Suspense fallback'i: girişsiz görünümle aynı yükseklik/genişlikte sessiz
|
||
* bir pill — session sorgusu akarken header zıplamasın (CLS yok).
|
||
*/
|
||
export function UserNavFallback() {
|
||
return (
|
||
<div
|
||
className="order-2 flex shrink-0 items-center gap-1.5 sm:gap-2"
|
||
aria-hidden
|
||
>
|
||
<div className="h-9 w-16 rounded-full bg-slate-900/10 sm:h-12 sm:w-28" />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export async function UserNav() {
|
||
const u = await getCurrentUser();
|
||
|
||
// Manuel liste localStorage'ta yaşadığı için Listem girişsiz de çalışır
|
||
if (!u) {
|
||
return (
|
||
<div className="order-2 flex shrink-0 items-center gap-1.5 sm:gap-2">
|
||
<RybbitIdentify kullaniciId={null} />
|
||
<ListeSenkron userId={null} />
|
||
<ListemButonu />
|
||
<GirisLinki />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<div className="order-2 flex shrink-0 items-center gap-1.5 sm:gap-2">
|
||
<RybbitIdentify kullaniciId={u.id} />
|
||
<ListeSenkron userId={u.id} />
|
||
<ListemButonu />
|
||
{/* Yapay Zeka raporunun kalıcı kapısı: girişli kullanıcı /listem'i
|
||
navbar'dan bulamıyordu (çekmece butonu manuel liste boşken hiç
|
||
görünmüyor). Rapor var mı diye DB'ye sorulmuyor — navbar'ın TTFB'si
|
||
bozulmasın; liste boşsa sayfadaki ListemBosCta karşılıyor.
|
||
Sınıf seti kredi pill'iyle birebir aynı (tek kaynak). */}
|
||
<Link
|
||
href="/listem"
|
||
aria-label="Yapay Zeka Listem"
|
||
title="Yapay Zeka'nın kurduğu 24 tercihlik listen"
|
||
className="inline-flex h-9 items-center gap-1.5 whitespace-nowrap rounded-full border border-slate-200 bg-card px-3 text-xs font-semibold text-slate-700 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50 sm:h-12 sm:gap-2 sm:px-5 sm:text-sm"
|
||
>
|
||
<ClipboardList className="size-3.5 text-primary sm:size-4" aria-hidden />
|
||
{/* Etiket her genişlikte gizli; anlamı yukarıdaki aria-label + title
|
||
taşıyor. Konteyner `max-w-6xl` = 1152 px'te kilitli olduğu için
|
||
`xl` (1280 px) yeni yer AÇMIYOR, ama eski görünürlük deseni tam
|
||
orada iki etiketi birden geri getiriyordu (+229 px) ve ortadaki
|
||
`absolute` nav ile çakışma üretiyordu. Sağ kümenin bütçesi ~304 px
|
||
= dört ikon-pill; bir etiket bile fazla. ListemButonu:38 ile aynı
|
||
desen (tek kaynak). */}
|
||
<span className="hidden">Yapay Zeka Listem</span>
|
||
</Link>
|
||
<Link
|
||
href="/paket?kaynak=nav"
|
||
className="inline-flex h-9 items-center gap-1.5 whitespace-nowrap rounded-full border border-slate-200 bg-card px-3 text-xs font-semibold text-slate-700 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50 sm:h-12 sm:gap-2 sm:px-5 sm:text-sm"
|
||
title="Kredilerin — yüklemek için tıkla"
|
||
>
|
||
<Coins className="size-3.5 text-amber-500 sm:size-4" aria-hidden />
|
||
<span className="tabular-nums">{u.creditBalance}</span>
|
||
{/* Etiket yalnızca md–lg arası: daha darda logo kesiliyor, lg üstünde
|
||
ortadaki nav ile yer dar (konteyner 1152'de sabit). İkon+sayı ve
|
||
title her genişlikte anlamı taşıyor. */}
|
||
<span className="hidden md:inline lg:hidden">kredi</span>
|
||
</Link>
|
||
<SignOutButton />
|
||
</div>
|
||
);
|
||
}
|