TypeScript 61.9%
HTML 37.2%
SQL 0.7%
1import type { Metadata } from 'next';2import { requireUser } from '@/lib/auth/session';3import { PageHeader } from '@/components/account/page-header';4import { Card, CardHeader } from '@/components/ui/primitives';5import { ProfileForm, ChangeEmailForm } from './forms';6import { AvatarForm } from './avatar-form';78export const metadata: Metadata = { title: 'Profile settings', robots: { index: false } };910export default async function SettingsPage() {11 const u = await requireUser('/account/settings');12 return (13 <>14 <PageHeader title="Profile" description="Your name, public handle, bio and display currency." />15 <div className="grid gap-4 lg:grid-cols-[minmax(0,1fr)_280px]">16 <div className="space-y-4">17 <Card>18 <CardHeader title="Identity" subtitle="Shown on your public profile if you enable it." />19 <div className="p-4">20 <ProfileForm user={{ name: u.name, handle: u.handle, bio: u.bio, displayCurrency: u.displayCurrency }} />21 </div>22 </Card>23 <Card>24 <CardHeader title="E-mail address" subtitle={`Signed in as ${u.email}`} />25 <div className="p-4">26 <ChangeEmailForm pendingEmail={u.pendingEmail} />27 </div>28 </Card>29 </div>30 <div className="space-y-4">31 <Card>32 <CardHeader title="Avatar" />33 <div className="p-4">34 <AvatarForm avatarUrl={u.avatarUrl} initial={(u.name ?? u.email).slice(0, 1).toUpperCase()} />35 </div>36 </Card>37 <Card>38 <CardHeader title="Membership" />39 <dl className="grid grid-cols-2 gap-y-2 p-4 text-xs">40 <dt className="text-subtle">Plan</dt>41 <dd className="capitalize">{u.role === 'user' ? 'Free' : u.role}</dd>42 <dt className="text-subtle">Member since</dt>43 <dd>{u.createdAt.toISOString().slice(0, 10)}</dd>44 <dt className="text-subtle">E-mail verified</dt>45 <dd>{u.emailVerifiedAt ? 'Yes' : 'No'}</dd>46 <dt className="text-subtle">Authenticator</dt>47 <dd>{u.mfaEnabled ? 'Enabled' : 'Off'}</dd>48 </dl>49 </Card>50 </div>51 </div>52 </>53 );54}55