132 lines
4.8 KiB
TypeScript
132 lines
4.8 KiB
TypeScript
import { createClient } from '@/lib/supabase/server';
|
|
import { redirect } from 'next/navigation';
|
|
import Link from 'next/link';
|
|
import { ArrowLeft, User as UserIcon, Building2, ShieldAlert } from 'lucide-react';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
|
|
import { AccountSettingsForm } from './AccountSettingsForm';
|
|
|
|
export default async function AccountKundenPage() {
|
|
const supabase = await createClient();
|
|
const { data: { user } } = await supabase.auth.getUser();
|
|
|
|
if (!user) {
|
|
redirect('/auth/login?next=/account-kunden');
|
|
}
|
|
|
|
// 1. Hole User aus custom users Tabelle
|
|
const { data: dbUser } = await supabase
|
|
.from('users')
|
|
.select('role, company_id')
|
|
.eq('id', user.id)
|
|
.single();
|
|
|
|
// 2. Hole Profil-Daten
|
|
const { data: profile } = await supabase
|
|
.from('profiles')
|
|
.select('*')
|
|
.eq('id', user.id)
|
|
.single();
|
|
|
|
// 3. Hole Company-Daten falls vorhanden
|
|
let company = null;
|
|
if (dbUser?.company_id) {
|
|
const { data: companyData } = await supabase
|
|
.from('companies')
|
|
.select('*')
|
|
.eq('id', dbUser.company_id)
|
|
.single();
|
|
company = companyData;
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-screen bg-[#020617] text-white px-4 py-12">
|
|
<div className="max-w-4xl mx-auto space-y-8">
|
|
|
|
{/* Header */}
|
|
<div className="flex items-center gap-4">
|
|
<Link href="/">
|
|
<Button variant="ghost" size="sm" className="text-slate-400 hover:text-white">
|
|
<ArrowLeft className="w-4 h-4 mr-2" /> Startseite
|
|
</Button>
|
|
</Link>
|
|
<div>
|
|
<h1 className="text-3xl font-extrabold tracking-tight flex items-center gap-3">
|
|
<UserIcon className="w-8 h-8 text-primary" />
|
|
Account Einstellungen
|
|
</h1>
|
|
<p className="text-slate-400 text-sm mt-1">
|
|
Verwalten Sie Ihre persönlichen Profildaten, Unternehmensdaten und Sicherheitseinstellungen.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Dashboard Grid */}
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
|
|
{/* Linke Infospalte */}
|
|
<div className="space-y-6">
|
|
<Card className="glass-dark border-white/10">
|
|
<CardHeader>
|
|
<CardTitle className="text-lg flex items-center gap-2">
|
|
<UserIcon className="w-5 h-5 text-primary" />
|
|
Benutzer-Info
|
|
</CardTitle>
|
|
<CardDescription className="text-slate-400 text-xs">
|
|
Ihr aktueller Systemstatus
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4 text-sm">
|
|
<div>
|
|
<span className="text-slate-500 block text-xs uppercase tracking-wider">E-Mail-Adresse</span>
|
|
<span className="text-white font-medium">{user.email}</span>
|
|
</div>
|
|
<div>
|
|
<span className="text-slate-500 block text-xs uppercase tracking-wider">Rolle</span>
|
|
<span className="text-amber-400 font-bold uppercase text-xs tracking-wider bg-amber-500/10 px-2 py-0.5 rounded border border-amber-500/20">
|
|
{dbUser?.role || 'partner'}
|
|
</span>
|
|
</div>
|
|
{company && (
|
|
<div>
|
|
<span className="text-slate-500 block text-xs uppercase tracking-wider">Unternehmen</span>
|
|
<span className="text-white font-medium flex items-center gap-1.5 mt-1">
|
|
<Building2 className="w-4 h-4 text-slate-400" />
|
|
{company.name}
|
|
</span>
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{!dbUser?.company_id && (
|
|
<Card className="border-red-500/20 bg-red-500/5">
|
|
<CardContent className="p-4 flex gap-3 text-red-400 text-sm">
|
|
<ShieldAlert className="w-5 h-5 shrink-0 mt-0.5" />
|
|
<div>
|
|
<p className="font-bold">Kein Unternehmen zugewiesen</p>
|
|
<p className="text-xs text-red-400/80 mt-1">
|
|
Wenden Sie sich an einen Administrator, um Ihrem Account ein Partner-Unternehmen zuzuweisen.
|
|
</p>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
)}
|
|
</div>
|
|
|
|
{/* Rechte Formularspalte */}
|
|
<div className="md:col-span-2">
|
|
<AccountSettingsForm
|
|
userId={user.id}
|
|
profile={profile}
|
|
company={company}
|
|
/>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|