Add next-intl to internationalize our project
This commit is contained in:
245
app/[locale]/(backend)/page.tsx
Normal file
245
app/[locale]/(backend)/page.tsx
Normal file
@@ -0,0 +1,245 @@
|
||||
"use client";
|
||||
|
||||
import ModuleCard from "@/components/ModuleCard";
|
||||
import StatCard from "@/components/StatCard";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { ModuleCategory } from "@/lib/types/dashboard";
|
||||
import {
|
||||
BookOpen,
|
||||
Building2,
|
||||
Calendar,
|
||||
FileText,
|
||||
History,
|
||||
Languages,
|
||||
Layout,
|
||||
List,
|
||||
MapPin,
|
||||
Mic2,
|
||||
Music,
|
||||
Sparkles,
|
||||
Tag,
|
||||
UserCircle,
|
||||
Users,
|
||||
} from "lucide-react";
|
||||
import { useTranslations } from "next-intl";
|
||||
import Link from "next/link";
|
||||
import React from "react";
|
||||
|
||||
const Dashboard: React.FC = () => {
|
||||
const t = useTranslations("dashboard");
|
||||
const categories: ModuleCategory[] = [
|
||||
{
|
||||
title: "People & Community",
|
||||
items: [
|
||||
{
|
||||
id: "users",
|
||||
title: "Users",
|
||||
description: "Manage registered users, permissions, and roles.",
|
||||
icon: Users,
|
||||
path: "/users",
|
||||
},
|
||||
{
|
||||
id: "profiles",
|
||||
title: "Profiles",
|
||||
description: "Create, edit, or remove detailed user profiles.",
|
||||
icon: UserCircle,
|
||||
path: "/profiles",
|
||||
},
|
||||
{
|
||||
id: "communities",
|
||||
title: "Communities",
|
||||
description: "Manage different community groups and branches.",
|
||||
icon: Building2,
|
||||
path: "/communities",
|
||||
},
|
||||
{
|
||||
id: "addresses",
|
||||
title: "Addresses",
|
||||
description:
|
||||
"Database of addresses for registered users and locations.",
|
||||
icon: MapPin,
|
||||
path: "/addresses",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Worship & Events",
|
||||
items: [
|
||||
{
|
||||
id: "services",
|
||||
title: "Services & Lectures",
|
||||
description:
|
||||
"Schedule and manage church services and lecture events.",
|
||||
icon: Calendar,
|
||||
path: "/services",
|
||||
},
|
||||
{
|
||||
id: "lectures_list",
|
||||
title: "Lectures List",
|
||||
description:
|
||||
"Browse the complete archive of lectures from all communities.",
|
||||
icon: Mic2,
|
||||
path: "/lectures",
|
||||
},
|
||||
{
|
||||
id: "holidays",
|
||||
title: "Feast Days",
|
||||
description: "Configure upcoming holidays and special feast days.",
|
||||
icon: Sparkles,
|
||||
path: "/holidays",
|
||||
},
|
||||
{
|
||||
id: "services_list",
|
||||
title: "Services List",
|
||||
description: "View only the scheduled services overview.",
|
||||
icon: List,
|
||||
path: "/services-list",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Music & Content",
|
||||
items: [
|
||||
{
|
||||
id: "songbooks",
|
||||
title: "Songbooks",
|
||||
description: "Manage digital songbook collections and versions.",
|
||||
icon: BookOpen,
|
||||
path: "/songbooks",
|
||||
},
|
||||
{
|
||||
id: "songs",
|
||||
title: "Songs & Poems",
|
||||
description: "Create and edit lyrics, poems, and musical content.",
|
||||
icon: Music,
|
||||
path: "/songs",
|
||||
},
|
||||
{
|
||||
id: "themes",
|
||||
title: "Themes",
|
||||
description: "Organize songs and poems into thematic categories.",
|
||||
icon: Tag,
|
||||
path: "/themes",
|
||||
},
|
||||
{
|
||||
id: "titles",
|
||||
title: "Titles",
|
||||
description: "Index of all titles for lectures, songs, and poems.",
|
||||
icon: Layout,
|
||||
path: "/titles",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "System & Config",
|
||||
items: [
|
||||
{
|
||||
id: "changes",
|
||||
title: "Change Log",
|
||||
description: "Track database modifications and user activities.",
|
||||
icon: History,
|
||||
path: "/changes",
|
||||
},
|
||||
{
|
||||
id: "types",
|
||||
title: "Lecture Types",
|
||||
description:
|
||||
"Define and categorize different types of presentations.",
|
||||
icon: Tag,
|
||||
path: "/types",
|
||||
},
|
||||
{
|
||||
id: "contributions",
|
||||
title: "Contributions",
|
||||
description: "Manage community posts and member contributions.",
|
||||
icon: FileText,
|
||||
path: "/contributions",
|
||||
},
|
||||
{
|
||||
id: "languages",
|
||||
title: "Languages",
|
||||
description: "Configure supported languages and translations.",
|
||||
icon: Languages,
|
||||
path: "/languages",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="mx-auto max-w-7xl space-y-8">
|
||||
{/* Welcome Section */}
|
||||
<div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
|
||||
<div>
|
||||
<h1 className="text-foreground text-3xl font-bold tracking-tight">
|
||||
{t("title")}
|
||||
</h1>
|
||||
<p className="text-muted-foreground mt-1">{t("welcome")}</p>
|
||||
</div>
|
||||
<div className="flex space-x-3">
|
||||
<Badge variant="secondary" className="px-2.5 py-0.5 text-sm">
|
||||
v2.4.0 Live
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Quick Stats */}
|
||||
<div className="grid grid-cols-1 gap-6 md:grid-cols-3">
|
||||
<StatCard
|
||||
label="Total Members"
|
||||
value="2,845"
|
||||
icon={Users}
|
||||
trend="up"
|
||||
change="12% this month"
|
||||
/>
|
||||
<StatCard
|
||||
label="Upcoming Services"
|
||||
value="24"
|
||||
icon={Calendar}
|
||||
trend="neutral"
|
||||
change="Next 7 days"
|
||||
/>
|
||||
<StatCard
|
||||
label="Songs Database"
|
||||
value="1,430"
|
||||
icon={Music}
|
||||
trend="up"
|
||||
change="5 new added"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Categories */}
|
||||
<div className="space-y-10">
|
||||
{categories.map((category) => (
|
||||
<div
|
||||
key={category.title}
|
||||
className="animate-in fade-in slide-in-from-bottom-4 duration-700"
|
||||
>
|
||||
<div className="mb-6 flex items-center space-x-2">
|
||||
<h2 className="text-foreground border-primary border-l-4 pl-3 text-xl font-semibold">
|
||||
{category.title}
|
||||
</h2>
|
||||
<div className="bg-border ml-4 h-px flex-1 opacity-50"></div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-4">
|
||||
{category.items.map((item) => (
|
||||
<Link key={item.id} href={item.path} className="block">
|
||||
<ModuleCard
|
||||
key={item.id}
|
||||
title={item.title}
|
||||
description={item.description}
|
||||
icon={item.icon}
|
||||
//onClick={() => console.log(`Navigating to ${item.path}`)}
|
||||
/>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Dashboard;
|
||||
Reference in New Issue
Block a user