Ник (Claude)
a3c1fa0c65
/register: полноценная страница регистрации с валидацией email, пароль (6+ символов), подтверждение, имя (optional) После регистрации → /onboarding (создать первый канал) 50 кредитов при регистрации /landing: публичный лендинг для незалогиненных Hero, Features (6), How it works (3 шага), Pricing (4 тарифа), CTA, Footer page.js: незалогиненный → redirect /landing (не /login) Header: Settings2 в импорт, PublicHeader экспорт для лендинга
84 lines
3.5 KiB
JavaScript
84 lines
3.5 KiB
JavaScript
'use client';
|
|
import Link from 'next/link';
|
|
import { useRouter } from 'next/navigation';
|
|
import { useEffect, useState } from 'react';
|
|
import { Sparkles, LogOut, CalendarDays, Coins, FileText, Settings2 } from 'lucide-react';
|
|
import ThemeToggle from './ThemeToggle';
|
|
|
|
export default function Header({ user }) {
|
|
const router = useRouter();
|
|
const [credits, setCredits] = useState(null);
|
|
|
|
useEffect(() => {
|
|
if (!user) return;
|
|
const refresh = () => fetch('/api/billing/balance').then(r => r.json())
|
|
.then(d => setCredits(d.isUnlimited ? '∞' : d.credits)).catch(() => {});
|
|
refresh();
|
|
window.addEventListener('credits-updated', refresh);
|
|
return () => window.removeEventListener('credits-updated', refresh);
|
|
}, [user?.id]);
|
|
|
|
async function logout() {
|
|
await fetch('/api/auth/logout', { method: 'POST' });
|
|
router.push('/login');
|
|
}
|
|
return (
|
|
<header className="border-b border-border bg-bg/80 backdrop-blur sticky top-0 z-10">
|
|
<div className="max-w-6xl mx-auto px-4 py-3 flex items-center justify-between">
|
|
<Link href="/" className="flex items-center gap-2 hover:opacity-80">
|
|
<Sparkles className="w-5 h-5 text-accent" />
|
|
<span className="font-bold">ZeroPost</span>
|
|
</Link>
|
|
<nav className="hidden sm:flex items-center gap-1">
|
|
<Link href="/calendar" className="btn-ghost px-3 py-1.5 text-sm flex items-center gap-1.5">
|
|
<CalendarDays className="w-4 h-4" />
|
|
<span>Календарь</span>
|
|
</Link>
|
|
<Link href="/drafts" className="btn-ghost px-3 py-1.5 text-sm flex items-center gap-1.5">
|
|
<FileText className="w-4 h-4" />
|
|
<span>Черновики</span>
|
|
</Link>
|
|
{user?.isAdmin && (
|
|
<Link href="/system" className="btn-ghost px-3 py-1.5 text-sm flex items-center gap-1.5">
|
|
<Settings2 className="w-4 h-4" />
|
|
<span>Админ</span>
|
|
</Link>
|
|
)}
|
|
</nav>
|
|
<div className="flex items-center gap-2">
|
|
{/* Баланс кредитов */}
|
|
{credits !== null && (
|
|
<Link href="/billing" className="flex items-center gap-1.5 px-2.5 py-1 rounded-lg bg-accent/10 hover:bg-accent/20 transition-colors text-sm font-medium text-accent">
|
|
<Coins className="w-3.5 h-3.5" />
|
|
<span>{credits} кр</span>
|
|
</Link>
|
|
)}
|
|
<span className="text-sm text-gray-500 hidden sm:inline mr-2">{user?.email}</span>
|
|
<ThemeToggle />
|
|
<button onClick={logout} className="btn-ghost p-2" title="Выйти">
|
|
<LogOut className="w-4 h-4" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|
|
|
|
// Публичный хедер для лендинга — отдельный экспорт
|
|
export function PublicHeader() {
|
|
return (
|
|
<header className="border-b border-border bg-surface sticky top-0 z-50">
|
|
<div className="max-w-6xl mx-auto px-4 sm:px-6 h-14 flex items-center justify-between">
|
|
<Link href="/landing" className="flex items-center gap-2 font-bold">
|
|
<Sparkles className="w-5 h-5 text-accent" />
|
|
<span>ZeroPost</span>
|
|
</Link>
|
|
<div className="flex items-center gap-2">
|
|
<Link href="/login" className="btn-ghost text-sm px-3 py-1.5">Войти</Link>
|
|
<Link href="/register" className="btn-primary text-sm px-3 py-1.5">Начать бесплатно</Link>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|