Refactor admin area and remove legacy root paths

2026-03-13 16:14:04 +01:00
parent e32ac4cacb
commit db897e22bf
65 changed files with 216 additions and 140 deletions
@@ -0,0 +1,129 @@
+import { ExternalLink, Plus, Tags } from "lucide-react";
+import Link from "next/link";
+
+import { StatsCard } from "@/components/dashboard/stats-card";
+import { MotionFade } from "@/components/motion-fade";
+import { PortfolioProjectActions } from "@/components/admin/portfolio-project-actions";
+import { AppCard } from "@/components/ui/app-card";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { CardContent } from "@/components/ui/card";
+import { getLocalizedPath } from "@/lib/locale";
+import { getLocalizedValue, type PortfolioCategoryView, type PortfolioProjectView } from "@/lib/portfolio";
+
+type PortfolioProjectsOverviewProps = {
+  categories: PortfolioCategoryView[];
+  projects: PortfolioProjectView[];
+  selectedCategory: string;
+  selectedStatus: "all" | "draft" | "published";
+};
+
+const copy = {
+  all: "Alle",
+  newProject: "Neues Projekt",
+  newCategory: "Neues Kategorie",
+  openProject: "Ansehen",
+  untitled: "Unbenanntes Projekt",
+  empty: "Noch keine Projekte vorhanden.",
+};
+
+export function PortfolioProjectsOverview({
+  categories,
+  projects,
+  selectedCategory,
+}: PortfolioProjectsOverviewProps) {
+  return (
+    <div className="space-y-6">
+      <div className="flex flex-col gap-4 xl:flex-row xl:items-end xl:justify-between">
+        <div className="grid gap-4 md:grid-cols-3 xl:min-w-[520px]">
+          <StatsCard title="Projects" value={String(projects.length)} />
+          <StatsCard title="Categories" value={String(categories.length)} />
+          <StatsCard
+            title="Published"
+            value={String(projects.filter((project) => project.isPublished).length)}
+          />
+        </div>
+
+        <div className="flex flex-wrap gap-2">
+          <Button asChild>
+            <Link href="/portfolio/projects/new">
+              <Plus className="h-4 w-4" />
+              {copy.newProject}
+            </Link>
+          </Button>
+          <Button asChild variant="outline">
+            <Link href="/portfolio/categories">
+              <Tags className="h-4 w-4" />
+              {copy.newCategory}
+            </Link>
+          </Button>
+        </div>
+      </div>
+
+      <div className="flex flex-wrap gap-2">
+        <Button asChild variant={selectedCategory === "" ? "default" : "outline"}>
+          <Link href="/portfolio">{copy.all}</Link>
+        </Button>
+        {categories.map((category) => (
+          <Button
+            key={category.id}
+            asChild
+            variant={selectedCategory === category.id ? "default" : "outline"}
+          >
+            <Link href={`/portfolio?category=${category.id}`}>
+              {category.name.de || category.name.en || category.name.ar}
+            </Link>
+          </Button>
+        ))}
+      </div>
+
+      <div className="grid gap-4">
+        {projects.map((project, index) => (
+          <MotionFade key={project.id} delay={0.06 + index * 0.03}>
+            <AppCard interactive>
+              <CardContent className="flex flex-col gap-4 p-5 lg:flex-row lg:items-center lg:justify-between">
+                <div className="space-y-2">
+                  <div className="flex flex-wrap items-center gap-2">
+                    <p className="text-xl font-semibold text-foreground">
+                      {getLocalizedValue(project.title, "de") || copy.untitled}
+                    </p>
+                    <Badge variant={project.isPublished ? "success" : "warning"}>
+                      {project.isPublished ? "Published" : "Draft"}
+                    </Badge>
+                    <Badge variant="outline">{project.viewMode}</Badge>
+                  </div>
+                  <div className="flex flex-wrap gap-2 text-sm text-muted-foreground">
+                    <span>{project.category.name.de || project.category.name.en || project.category.name.ar}</span>
+                    <span>{project.projectYear}</span>
+                  </div>
+                </div>
+
+                <div className="flex flex-wrap gap-3">
+                  <Button asChild variant="outline">
+                    <Link
+                      href={getLocalizedPath("de", `/portfolio/${project.slug}`)}
+                      target="_blank"
+                      rel="noreferrer"
+                    >
+                      <ExternalLink className="h-4 w-4" />
+                      {copy.openProject}
+                    </Link>
+                  </Button>
+                  <PortfolioProjectActions projectId={project.id} />
+                </div>
+              </CardContent>
+            </AppCard>
+          </MotionFade>
+        ))}
+
+        {projects.length === 0 ? (
+          <AppCard>
+            <CardContent className="p-6 text-sm text-muted-foreground">
+              {copy.empty}
+            </CardContent>
+          </AppCard>
+        ) : null}
+      </div>
+    </div>
+  );
+}