106 lines
3.1 KiB
TypeScript
106 lines
3.1 KiB
TypeScript
"use client";
|
|
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
|
import { TeamOverviewTab } from "./team-overview-tab";
|
|
import { TeamSkillsTab } from "./team-skills-tab";
|
|
import { TeamMembersTab } from "./team-members-tab";
|
|
import { TeamInsightsTab } from "./team-insights-tab";
|
|
import { TeamStats, TeamMember } from "@/lib/admin-types";
|
|
|
|
interface SkillAnalysis {
|
|
skillName: string;
|
|
category: string;
|
|
experts: Array<{
|
|
name: string;
|
|
level: number;
|
|
canMentor: boolean;
|
|
}>;
|
|
learners: Array<{
|
|
name: string;
|
|
currentLevel: number;
|
|
}>;
|
|
averageLevel: number;
|
|
totalEvaluations: number;
|
|
expertCount: number;
|
|
learnerCount: number;
|
|
proficiencyRate: number;
|
|
}
|
|
|
|
interface TeamInsights {
|
|
averageTeamLevel: number;
|
|
totalExperts: number;
|
|
totalLearners: number;
|
|
skillGaps: number;
|
|
strongSkills: number;
|
|
}
|
|
|
|
interface TeamDetailTabsProps {
|
|
team: TeamStats;
|
|
skillAnalysis: SkillAnalysis[];
|
|
teamInsights: TeamInsights;
|
|
onMemberClick: (member: TeamMember) => void;
|
|
}
|
|
|
|
export function TeamDetailTabs({
|
|
team,
|
|
skillAnalysis,
|
|
teamInsights,
|
|
onMemberClick,
|
|
}: TeamDetailTabsProps) {
|
|
return (
|
|
<Tabs defaultValue="overview" 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-4 bg-transparent border-0">
|
|
<TabsTrigger
|
|
value="overview"
|
|
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
|
|
>
|
|
Vue d'ensemble
|
|
</TabsTrigger>
|
|
<TabsTrigger
|
|
value="skills"
|
|
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
|
|
>
|
|
Compétences
|
|
</TabsTrigger>
|
|
<TabsTrigger
|
|
value="members"
|
|
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
|
|
>
|
|
Membres
|
|
</TabsTrigger>
|
|
<TabsTrigger
|
|
value="insights"
|
|
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-slate-400 hover:text-white transition-colors"
|
|
>
|
|
Insights
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
</div>
|
|
|
|
<TabsContent value="overview" className="space-y-6">
|
|
<TeamOverviewTab
|
|
team={team}
|
|
teamInsights={teamInsights}
|
|
skillAnalysis={skillAnalysis}
|
|
/>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="skills" className="space-y-6">
|
|
<TeamSkillsTab skillAnalysis={skillAnalysis} />
|
|
</TabsContent>
|
|
|
|
<TabsContent value="members" className="space-y-6">
|
|
<TeamMembersTab members={team.members} onMemberClick={onMemberClick} />
|
|
</TabsContent>
|
|
|
|
<TabsContent value="insights" className="space-y-6">
|
|
<TeamInsightsTab
|
|
skillAnalysis={skillAnalysis}
|
|
teamInsights={teamInsights}
|
|
/>
|
|
</TabsContent>
|
|
</Tabs>
|
|
);
|
|
}
|