julienfroidefond/peakskills
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

reafctor: pages for management and split components

Browse Source
This commit is contained in:
Julien Froidefond
2025-08-23 08:16:09 +02:00
parent 97d274190d
commit 2e195ca5cf
29 changed files with 1968 additions and 1607 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/admin/layout/index.ts
View File

@@ -1,3 +1,2 @@
// Composants de layout et navigation
export { ManageAdminClientWrapper } from "./manage-admin-client-wrapper";
export { ManageContentTabs } from "./manage-content-tabs";
export { ManageNavigation } from "./manage-navigation";

43
components/admin/layout/manage-admin-client-wrapper.tsx
View File

@@ -1,43 +0,0 @@
"use client";
import { useState } from "react";
import { Team, SkillCategory } from "@/lib/types";
import { TeamStats, DirectionStats } from "@/services/admin-service";
import { AdminHeader } from "../utils/admin-header";
import { ManageContentTabs } from "./manage-content-tabs";
interface ManageAdminClientWrapperProps {
teams: Team[];
skillCategories: SkillCategory[];
teamStats: TeamStats[];
directionStats: DirectionStats[];
}
export function ManageAdminClientWrapper({
teams,
skillCategories,
teamStats,
directionStats,
}: ManageAdminClientWrapperProps) {
return (
<div className="min-h-screen bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950 relative overflow-hidden">
{/* Background Effects */}
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_top,_var(--tw-gradient-stops))] from-blue-900/20 via-slate-900 to-slate-950" />
<div className="absolute inset-0 bg-grid-white/5 bg-[size:50px_50px]" />
<div className="absolute inset-0 bg-gradient-to-t from-slate-950 via-transparent to-transparent" />
<div className="relative z-10 container mx-auto px-6 py-6 max-w-7xl space-y-6">
{/* Header */}
<AdminHeader />
{/* Main Content Tabs */}
<ManageContentTabs
teams={teams}
skillCategories={skillCategories}
teamStats={teamStats}
directionStats={directionStats}
/>
</div>
</div>
);
}

69
components/admin/layout/manage-content-tabs.tsx
View File

@@ -1,69 +0,0 @@
"use client";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Code2, Users, User } from "lucide-react";
import { Team, SkillCategory } from "@/lib/types";
import { TeamStats, DirectionStats } from "@/services/admin-service";
import { SkillsManagement } from "../management/pages/skills-management";
import { TeamsManagement } from "../management/pages/teams-management";
import { UsersManagement } from "../management/pages/users-management";
interface ManageContentTabsProps {
teams: Team[];
skillCategories: SkillCategory[];
teamStats: TeamStats[];
directionStats: DirectionStats[];
}
export function ManageContentTabs({
teams,
skillCategories,
teamStats,
directionStats,
}: ManageContentTabsProps) {
return (
<Tabs defaultValue="skills" className="w-full">
<div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-1 mb-6 w-fit mx-auto">
<TabsList className="grid w-full grid-cols-3 bg-transparent border-0">
<TabsTrigger
value="skills"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
>
<Code2 className="w-4 h-4 mr-2" />
Gestion des Skills
</TabsTrigger>
<TabsTrigger
value="teams"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
>
<Users className="w-4 h-4 mr-2" />
Gestion des Teams
</TabsTrigger>
<TabsTrigger
value="users"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
>
<User className="w-4 h-4 mr-2" />
Gestion des Utilisateurs
</TabsTrigger>
</TabsList>
</div>
<TabsContent value="skills" className="space-y-4">
<SkillsManagement skillCategories={skillCategories} teams={teams} />
</TabsContent>
<TabsContent value="teams" className="space-y-4">
<TeamsManagement
teams={teams}
teamStats={teamStats}
skillCategories={skillCategories}
/>
</TabsContent>
<TabsContent value="users" className="space-y-4">
<UsersManagement />
</TabsContent>
</Tabs>
);
}

58
components/admin/layout/manage-navigation.tsx Normal file
View File

@@ -0,0 +1,58 @@
"use client";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { Code2, Users, User } from "lucide-react";
import { cn } from "@/lib/utils";
export function ManageNavigation() {
const pathname = usePathname();
const navItems = [
{
href: "/admin/manage/skills",
label: "Gestion des Skills",
icon: Code2,
value: "skills",
},
{
href: "/admin/manage/teams",
label: "Gestion des Teams",
icon: Users,
value: "teams",
},
{
href: "/admin/manage/users",
label: "Gestion des Utilisateurs",
icon: User,
value: "users",
},
];
return (
<div className="bg-white/5 backdrop-blur-sm border border-white/10 rounded-2xl p-1 mb-6 w-fit mx-auto">
<div className="grid grid-cols-3 bg-transparent border-0 gap-1">
{navItems.map((item) => {
const Icon = item.icon;
const isActive = pathname === item.href;
return (
<Link
key={item.value}
href={item.href}
className={cn(
"inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-2 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
isActive
? "bg-white/20 text-white"
: "text-slate-400 hover:text-white hover:bg-white/10"
)}
>
<Icon className="w-4 h-4 mr-2" />
{item.label}
</Link>
);
})}
</div>
</div>
);
}