Files
memohanzi/src/app/(app)/dashboard/page.tsx
Stefan Hardegger 33377009d0 intialization
2025-11-21 13:27:37 +01:00

177 lines
6.5 KiB
TypeScript

import { auth } from '@/lib/auth'
import { redirect } from 'next/navigation'
import { logout } from '@/actions/auth'
import Link from 'next/link'
async function logoutAction() {
'use server'
await logout()
redirect('/login')
}
export default async function DashboardPage() {
const session = await auth()
if (!session?.user) {
redirect('/login')
}
const user = session.user as any
return (
<div className="min-h-screen bg-gray-50 dark:bg-gray-900">
<nav className="bg-white dark:bg-gray-800 shadow">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between h-16 items-center">
<div className="flex items-center space-x-8">
<h1 className="text-xl font-bold text-gray-900 dark:text-white">
MemoHanzi <span className="text-sm font-normal text-gray-500"></span>
</h1>
<Link
href="/collections"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Collections
</Link>
<Link
href="/hanzi"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Search Hanzi
</Link>
<Link
href="/settings"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Settings
</Link>
{(user.role === 'ADMIN' || user.role === 'MODERATOR') && (
<>
<Link
href="/admin/import"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Import
</Link>
<Link
href="/admin/initialize"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Initialize
</Link>
</>
)}
</div>
<div className="flex items-center space-x-4">
<span className="text-sm text-gray-700 dark:text-gray-300">
{user.name || user.email}
</span>
<form action={logoutAction}>
<button
type="submit"
className="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-200"
>
Sign Out
</button>
</form>
</div>
</div>
</div>
</nav>
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div className="mb-8">
<h2 className="text-3xl font-bold text-gray-900 dark:text-white mb-2">
Welcome back{user.name ? `, ${user.name}` : ''}!
</h2>
<p className="text-gray-600 dark:text-gray-400">
Start learning Chinese characters with spaced repetition
</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<h3 className="text-lg font-semibold text-gray-900 dark:text-white mb-2">
Due Cards
</h3>
<p className="text-3xl font-bold text-blue-600 dark:text-blue-400 mb-2">
0
</p>
<p className="text-sm text-gray-600 dark:text-gray-400">
No cards due right now
</p>
</div>
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<h3 className="text-lg font-semibold text-gray-900 dark:text-white mb-2">
Total Learned
</h3>
<p className="text-3xl font-bold text-green-600 dark:text-green-400 mb-2">
0
</p>
<p className="text-sm text-gray-600 dark:text-gray-400">
Characters mastered
</p>
</div>
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
<h3 className="text-lg font-semibold text-gray-900 dark:text-white mb-2">
Daily Goal
</h3>
<p className="text-3xl font-bold text-purple-600 dark:text-purple-400 mb-2">
0/50
</p>
<p className="text-sm text-gray-600 dark:text-gray-400">
Cards reviewed today
</p>
</div>
</div>
<div className="mt-8 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-6">
<h3 className="text-lg font-semibold text-blue-900 dark:text-blue-300 mb-2">
Quick Actions
</h3>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<Link
href="/collections"
className="bg-white dark:bg-gray-800 p-4 rounded-lg hover:shadow-md transition-shadow"
>
<h4 className="font-semibold text-gray-900 dark:text-white mb-1">
Browse Collections
</h4>
<p className="text-sm text-gray-600 dark:text-gray-400">
View and manage your hanzi collections
</p>
</Link>
<Link
href="/collections/new"
className="bg-white dark:bg-gray-800 p-4 rounded-lg hover:shadow-md transition-shadow"
>
<h4 className="font-semibold text-gray-900 dark:text-white mb-1">
Create Collection
</h4>
<p className="text-sm text-gray-600 dark:text-gray-400">
Start a new hanzi collection
</p>
</Link>
<Link
href="/hanzi"
className="bg-white dark:bg-gray-800 p-4 rounded-lg hover:shadow-md transition-shadow"
>
<h4 className="font-semibold text-gray-900 dark:text-white mb-1">
Search Hanzi
</h4>
<p className="text-sm text-gray-600 dark:text-gray-400">
Find hanzi by character, pinyin, or meaning
</p>
</Link>
</div>
<p className="text-sm text-blue-800 dark:text-blue-400 mt-4">
More features coming soon: Learning sessions, progress tracking, and more!
</p>
</div>
</main>
</div>
)
}