+
{title || "Historique des commits"}
+
+
+ {Array.from({ length: 7 }).map((_, i) => (
+
+ {dayLabels[i]}
+
+ ))}
+
+
+ {Array.from({ length: weeks }).map((_, weekIndex) => (
+
+ {Array.from({ length: 7 }).map((_, dayIndex) => {
+ const cellIndex = weekIndex * 7 + dayIndex;
+ const cell = calendarDays[cellIndex];
+
+ if (!cell) return
;
+
+ return (
+
c.date === cell.date.toISOString().split("T")[0])?.count || 0 : 0} commits`}
+ />
+ );
+ })}
+
+ ))}
+
+
+
+
+
Moins
+
+
+
+
+
+
Plus
+
+
+ );
+}
diff --git a/src/components/dashboard/contributor-chart.tsx b/src/components/dashboard/contributor-chart.tsx
new file mode 100644
index 0000000..b66ae84
--- /dev/null
+++ b/src/components/dashboard/contributor-chart.tsx
@@ -0,0 +1,80 @@
+interface Contributor {
+ name: string;
+ email: string;
+ commits: number;
+ linesAdded: number;
+ linesDeleted: number;
+}
+
+interface ContributorChartProps {
+ contributors: Contributor[];
+ title?: string;
+ className?: string;
+}
+
+export function ContributorChart({ contributors, title, className }: ContributorChartProps) {
+ const maxValue = Math.max(...contributors.map((c) => c.commits), 1);
+ const barColors = [
+ '#0ea5e9',
+ '#f97316',
+ '#8b5cf6',
+ '#10b981',
+ '#6366f1',
+ '#ec4899',
+ '#14b8a6',
+ '#f59e0b',
+ '#64748b',
+ ];
+
+ const sorted = [...contributors].sort((a, b) => b.commits - a.commits).slice(0, 10);
+
+ return (
+
+
{title || "Top Contributeurs"}
+ {sorted.map((contributor, index) => {
+ const percentage = (contributor.commits / maxValue) * 100;
+ const color = barColors[index % barColors.length];
+
+ return (
+
+
+
+
+ {contributor.commits} commits
+
+
+
+
+ );
+ })}
+ {sorted.length === 0 && (
+
+ Aucune donnée de contributeur
+
+ )}
+
+ );
+}
+
+// Add TypeScript types for props
+export interface ContributorData {
+ name: string;
+ email: string;
+ commits: number;
+ linesAdded: number;
+ linesDeleted: number;
+}
diff --git a/src/components/dashboard/git-commit-stats.tsx b/src/components/dashboard/git-commit-stats.tsx
new file mode 100644
index 0000000..b71fe12
--- /dev/null
+++ b/src/components/dashboard/git-commit-stats.tsx
@@ -0,0 +1,41 @@
+interface CommitsByDateProps {
+ commits: Array<{ date: string; count: number }>;
+ className?: string;
+ }
+
+ export function CommitsByDateChart({ commits, className }: CommitsByDateProps) {
+ const sortedCommits = [...commits].sort(
+ (a, b) => new Date(a.date).getTime() - new Date(b.date).getTime()
+ );
+
+ const maxValue = Math.max(...sortedCommits.map(c => c.count), 1);
+
+ return (
+
+
Commits par date
+
+ {sortedCommits.map((commit, idx) => {
+ const height = (commit.count / maxValue) * 100;
+ const date = new Date(commit.date);
+ const label = date.toLocaleDateString("fr-FR", { day: "2-digit", month: "short" });
+ return (
+
+
+ {commit.count > 0 ? commit.count : ''}
+
+
0 ? '24px' : '0'
+ }}
+ title={`${label}: ${commit.count} commits`}
+ />
+ {label}
+
+ );
+ })}
+
+
+ );
+ }
diff --git a/src/components/dashboard/git-diff.tsx b/src/components/dashboard/git-diff.tsx
new file mode 100644
index 0000000..9320fb1
--- /dev/null
+++ b/src/components/dashboard/git-diff.tsx
@@ -0,0 +1,271 @@
+type CommitsByDate = { date: string; count: number };
+type CommitsByDayOfWeek = { day: number; count: number };
+type CommitsByMonth = { month: number; count: number };
+type CommitsByHourOfDay = { hour: number; count: number };
+type FilesByType = { type: string; count: number };
+
+function formatDateFr(dateStr: string): string {
+ const d = new Date(dateStr);
+ return d.toLocaleDateString("fr-FR", { day: "numeric", month: "short" });
+}
+
+function formatHourFr(hour: number): string {
+ return `${hour.toString().padStart(2, "0")}h00`;
+}
+
+ interface CommitsByDateProps {
+ commits: CommitsByDate[];
+ className?: string;
+ }
+
+ export function CommitsByDateChart({ commits, className }: CommitsByDateProps) {
+ const sortedCommits = [...commits].sort(
+ (a, b) =>
+ new Date(a.date).getTime() - new Date(b.date).getTime()
+ );
+
+ const maxValue = Math.max(...sortedCommits.map(c => c.count), 1);
+ const labels = sortedCommits.map((c) => formatDateFr(c.date));
+
+ return { commits };
+ }
+
+ interface CommitsByDayOfWeekProps {
+ commits: CommitsByDayOfWeek[];
+ className?: string;
+ }
+
+ export function CommitsByDayOfWeekChart({ commits, className }: CommitsByDayOfWeekProps) {
+ const maxValue = Math.max(...commits.map(p => p.count), 1);
+ const days = [
+ 'Dimanche',
+ 'Lundi',
+ 'Mardi',
+ 'Mercredi',
+ 'Jeudi',
+ 'Vendredi',
+ 'Samedi'
+ ];
+
+ const data = days.map((day, idx) => {
+ const found = commits.find(p => p.day === idx);
+ return {
+ day: day,
+ count: found ? found.count : 0,
+ percentage: found ? Math.round((found.count / maxValue) * 100) : 0
+ };
+ }).sort((a, b) => b.count - a.count);
+
+ return (
+
+
Jours de la semaine
+
+ {data.map((item, idx) => (
+
+
+
{item.day.substring(0, 3)}
+
+
{item.count}
+
+ ))}
+
+
+ );
+ }
+
+ function getDayColor(idx: number) {
+ const colors = ['#8b5cf6', '#3b82f6', '#06b6d4', '#10b981', '#f59e0b', '#f97316', '#ef4444'];
+ return colors[idx];
+ }
+
+ interface CommitsByMonthProps {
+ commits: CommitsByMonth[];
+ className?: string;
+ }
+
+ export function CommitsByMonthChart({ commits, className }: CommitsByMonthProps) {
+ const months = [
+ 'Jan', 'Fev', 'Mar', 'Avr', 'Mai', 'Juin',
+ 'Juil', 'Aou', 'Sep', 'Oct', 'Nov', 'Dec'
+ ];
+
+ const data = months.map((month, idx) => {
+ const found = commits.find(p => p.month === idx);
+ return {
+ month,
+ count: found ? found.count : 0
+ };
+ });
+
+ return (
+
+
Mois de l'année
+
+ {data.map((item, idx) => {
+ const maxValue = Math.max(...data.map(d => d.count), 1);
+ const height = (item.count / maxValue) * 100;
+ return (
+
+
+ {item.count > 0 ? item.count : ''}
+
+
0 ? '24px' : '0' }}
+ />
+ {item.month}
+
+ );
+ })}
+
+
+ );
+ }
+
+ interface CommitsByHourOfDayProps {
+ commits: CommitsByHourOfDay[];
+ className?: string;
+ }
+
+ export function CommitsByHourOfDayChart({ commits, className }: CommitsByHourOfDayProps) {
+ const maxValue = Math.max(...commits.map(p => p.count), 1);
+ const hours = Array.from({ length: 24 }, (_, i) => {
+ const found = commits.find(p => p.hour === i);
+ return {
+ hour: i,
+ label: formatHourFr(i),
+ count: found ? found.count : 0,
+ percentage: found ? (found.count / maxValue) * 100 : 0
+ };
+ });
+
+ return (
+
+
Heures de la journée
+
+ {hours.map((item) => (
+
+
0 ? Math.max(item.percentage * 0.8, 5) : 0}%` }}
+ />
+
+ ))}
+
+
+ 00h00
+ 12h00
+ 23h59
+
+
+ );
+ }
+
+ interface FilesByTypeProps {
+ files: FilesByType[];
+ className?: string;
+ }
+
+ export function FilesByTypeChart({ files, className }: FilesByTypeProps) {
+ const colors = {
+ src: '#3b82f6',
+ css: '#8b5cf6',
+ html: '#f59e0b',
+ json: '#64748b',
+ md: '#10b981',
+ ts: '#06b6d4',
+ test: '#ec4899',
+ config: '#92400e',
+ git: '#6b7280',
+ asset: '#f97316',
+ other: '#a3a3a3',
+ };
+
+ const sorted = [...files].sort((a, b) => b.count - a.count);
+ const maxCount = sorted[0]?.count || 1;
+
+ return (
+
+
Types de fichiers modifiés
+
+ {sorted.map((file, idx) => {
+ const percentage = (file.count / maxCount) * 100;
+ const ext = file.type.toLowerCase();
+ const color = colors[ext as keyof typeof colors] || '#a3a3a3';
+
+ return (
+
+
+
.{ext}
+
+
{file.count}
+
+ );
+ })}
+
+
+ );
+ }
+
+ interface ActiveDaysProps {
+ activeDays: number;
+ totalDays: number;
+ className?: string;
+ }
+
+ export function ActiveDaysChart({ activeDays, totalDays, className }: ActiveDaysProps) {
+ const percentage = totalDays > 0 ? Math.round((activeDays / totalDays) * 100) : 0;
+ const color =
+ percentage > 60 ? 'text-green-500' :
+ percentage > 30 ? 'text-yellow-500' :
+ 'text-red-500';
+
+ return (
+
+
Jours actifs
+
+
+
{activeDays}
+
jours actifs
+
+
+
+ {percentage}% des {totalDays} jours
+
+
+
60 ? 'bg-green-500' :
+ percentage > 30 ? 'bg-yellow-500' :
+ 'bg-red-500'
+ }`}
+ style={{ width: `${percentage}%` }}
+ />
+
+
+ taux d'activité
+
+
+
+
+ );
+ }
diff --git a/src/components/dashboard/index.ts b/src/components/dashboard/index.ts
new file mode 100644
index 0000000..7583e93
--- /dev/null
+++ b/src/components/dashboard/index.ts
@@ -0,0 +1,7 @@
+export { RepoManager, StatsOverview, CommitHistory } from "./repo-manager";
+export { ActiveDaysChart } from "./active-days-chart";
+export { CommitTimeline } from "./commit-timeline";
+export { ContributorChart } from "./contributor-chart";
+export { CommitsByDateChart } from "./git-commit-stats";
+export { CommitsByDayOfWeekChart, CommitsByMonthChart, CommitsByHourOfDayChart, FilesByTypeChart } from "./git-diff";
+export { ContributionHeatmap } from "./commit-history";
diff --git a/src/components/dashboard/repo-manager.tsx b/src/components/dashboard/repo-manager.tsx
new file mode 100644
index 0000000..95f4f39
--- /dev/null
+++ b/src/components/dashboard/repo-manager.tsx
@@ -0,0 +1,164 @@
+import { Button } from "@/components/ui/button";
+import { Card } from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Select } from "@/components/ui/select";
+import { Plus, X, Folder, FolderOpen, Search, Trash2, Clock, GitGraph, GitBranch, FileText } from "lucide-react";
+import Image from "next/image";
+
+export function RepoManager({
+ repos,
+ onAdd,
+ onRemove,
+}: {
+ repos: { path: string; name: string }[];
+ onAdd: (repo: { path: string; name: string }) => void;
+ onRemove: (path: string) => void;
+}) {
+ return (
+
+
+
+ Dépôts Git
+
+
+ {repos.map((repo) => (
+
+
+
+
+
{repo.name}
+
{repo.path}
+
+
+
+
+ ))}
+
+
+ );
+}
+
+export function StatsOverview({ stats }: { stats: any }) {
+ return (
+
+ }
+ color="blue"
+ />
+ }
+ color="green"
+ />
+ }
+ color="red"
+ />
+ }
+ color="yellow"
+ />
+
+ );
+}
+
+function StatCard({
+ title,
+ value,
+ icon,
+ color,
+ format,
+}: {
+ title: string;
+ value: number | string;
+ icon: React.ReactNode;
+ color: string;
+ format: "number" | "percent";
+}) {
+ const colorMap: Record
= {
+ blue: "bg-blue-50 text-blue-600 border-blue-200",
+ green: "bg-green-50 text-green-600 border-green-200",
+ red: "bg-red-50 text-red-600 border-red-200",
+ yellow: "bg-yellow-50 text-yellow-600 border-yellow-200",
+ };
+
+ const displayed = format === "number"
+ ? Number(value).toLocaleString("fr-FR")
+ : `${value}%`;
+
+ return (
+
+
+
+
{title}
+
{displayed}
+
+
+ {icon}
+
+
+
+
+ Historique des commits (derniers 10)
+
+
+ {commits.slice(0, 10).map((commit, idx) => (
+
+
+
+
{commit.msg}
+
+ {commit.author}
+ •
+ {commit.date}
+ •
+ +{commit.add} -{commit.del}
+
+
+
+ {commit.hash.substring(0, 7)}
+
+
+ ))}
+
+
{children}
;
+};
+
+const AccordionItem = ({
+ children,
+ className,
+}: React.ComponentProps<"div">) => {
+ return {children}
;
+};
+
+const AccordionTrigger = ({
+ children,
+ className,
+ onClick,
+}: React.ComponentProps<"button">) => {
+ return (
+
+ );
+};
+
+const AccordionContent = ({
+ children,
+ className,
+}: React.ComponentProps<"div">) => {
+ return (
+ {children}
+ );
+};
+
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx
new file mode 100644
index 0000000..67997dd
--- /dev/null
+++ b/src/components/ui/alert.tsx
@@ -0,0 +1,34 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const Alert = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes & { variant?: "default" | "destructive" }
+>(({ className, variant = "default", ...props }, ref) => (
+ svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",
+ variant === "destructive" &&
+ "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
+ className
+ )}
+ {...props}
+ />
+));
+Alert.displayName = "Alert";
+
+const AlertDescription = React.forwardRef<
+ HTMLParagraphElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+AlertDescription.displayName = "AlertDescription";
+
+export { Alert, AlertDescription };
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
new file mode 100644
index 0000000..9d1ba87
--- /dev/null
+++ b/src/components/ui/button.tsx
@@ -0,0 +1,57 @@
+"use client";
+
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "@/lib/utils";
+
+const buttonVariants = cva(
+ "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+ {
+ variants: {
+ variant: {
+ default: "bg-primary text-primary-foreground hover:bg-primary/90",
+ destructive:
+ "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+ outline:
+ "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+ secondary:
+ "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+ ghost: "hover:bg-accent hover:text-accent-foreground",
+ link: "text-primary underline-offset-4 hover:underline",
+ },
+ size: {
+ default: "h-10 px-4 py-2",
+ sm: "h-9 rounded-md px-3",
+ lg: "h-11 rounded-md px-8",
+ icon: "h-10 w-10",
+ },
+ },
+ defaultVariants: {
+ variant: "default",
+ size: "default",
+ },
+ }
+);
+
+export interface ButtonProps
+ extends React.ButtonHTMLAttributes,
+ VariantProps {
+ asChild?: boolean;
+}
+
+const Button = React.forwardRef(
+ ({ className, variant, size, asChild = false, ...props }, ref) => {
+ const Comp = asChild ? Slot : "button";
+ return (
+
+ );
+ }
+);
+Button.displayName = "Button";
+
+export { Button, buttonVariants };
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
new file mode 100644
index 0000000..e62dbcf
--- /dev/null
+++ b/src/components/ui/card.tsx
@@ -0,0 +1,78 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const Card = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+Card.displayName = "Card";
+
+const CardHeader = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+CardHeader.displayName = "CardHeader";
+
+const CardTitle = React.forwardRef<
+ HTMLParagraphElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+CardTitle.displayName = "CardTitle";
+
+const CardDescription = React.forwardRef<
+ HTMLParagraphElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+CardDescription.displayName = "CardDescription";
+
+const CardContent = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+CardContent.displayName = "CardContent";
+
+const CardFooter = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+CardFooter.displayName = "CardFooter";
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
new file mode 100644
index 0000000..b8a3911
--- /dev/null
+++ b/src/components/ui/input.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+export interface InputProps
+ extends React.InputHTMLAttributes {}
+
+const Input = React.forwardRef(
+ ({ className, type, ...props }, ref) => {
+ return (
+
+ );
+ }
+);
+Input.displayName = "Input";
+
+export { Input };
diff --git a/src/components/ui/progress.tsx b/src/components/ui/progress.tsx
new file mode 100644
index 0000000..299e418
--- /dev/null
+++ b/src/components/ui/progress.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const Progress = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes & { value: number }
+>(({ className, value = 0, ...props }, ref) => (
+
+));
+Progress.displayName = "Progress";
+
+export { Progress };
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
new file mode 100644
index 0000000..ecd6424
--- /dev/null
+++ b/src/components/ui/select.tsx
@@ -0,0 +1,25 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+export interface SelectProps
+ extends React.SelectHTMLAttributes {}
+
+const Select = React.forwardRef(
+ ({ className, children, ...props }, ref) => {
+ return (
+
+ );
+ }
+);
+Select.displayName = "Select";
+
+export { Select };
diff --git a/src/components/ui/skeleton.tsx b/src/components/ui/skeleton.tsx
new file mode 100644
index 0000000..da702d8
--- /dev/null
+++ b/src/components/ui/skeleton.tsx
@@ -0,0 +1,16 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+function Skeleton({
+ className,
+ ...props
+}: React.HTMLAttributes) {
+ return (
+
+ );
+}
+
+export { Skeleton };
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
new file mode 100644
index 0000000..24e5839
--- /dev/null
+++ b/src/components/ui/table.tsx
@@ -0,0 +1,80 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const Table = React.forwardRef<
+ HTMLTableElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+Table.displayName = "Table";
+
+const TableHeader = React.forwardRef<
+ HTMLTableSectionElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+TableHeader.displayName = "TableHeader";
+
+const TableBody = React.forwardRef<
+ HTMLTableSectionElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+));
+TableBody.displayName = "TableBody";
+
+const TableRow = React.forwardRef<
+ HTMLTableRowElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+ |
+));
+TableRow.displayName = "TableRow";
+
+const TableHead = React.forwardRef<
+ HTMLTableCellElement,
+ React.ThHTMLAttributes
+>(({ className, ...props }, ref) => (
+ |
+));
+TableHead.displayName = "TableHead";
+
+const TableCell = React.forwardRef<
+ HTMLTableCellElement,
+ React.TdHTMLAttributes
+>(({ className, ...props }, ref) => (
+ |
+));
+TableCell.displayName = "TableCell";
+
+export { Table, TableHeader, TableRow, TableHead, TableBody, TableCell };
diff --git a/src/components/ui/tabs.tsx b/src/components/ui/tabs.tsx
new file mode 100644
index 0000000..006e2da
--- /dev/null
+++ b/src/components/ui/tabs.tsx
@@ -0,0 +1,95 @@
+"use client";
+
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+interface TabsContextType {
+ value: string;
+ onValueChange: (value: string) => void;
+}
+
+const TabsContext = React.createContext(null);
+
+function useTabs() {
+ const ctx = React.useContext(TabsContext);
+ if (!ctx) throw new Error("Tabs components must be used within ");
+ return ctx;
+}
+
+function Tabs({
+ defaultValue,
+ className,
+ children,
+}: {
+ defaultValue: string;
+ className?: string;
+ children: React.ReactNode;
+}) {
+ const [value, setValue] = React.useState(defaultValue);
+ return (
+
+ {children}
+
+ );
+}
+
+function TabsList({
+ className,
+ children,
+}: {
+ className?: string;
+ children: React.ReactNode;
+}) {
+ return (
+
+ {children}
+
+ );
+}
+
+function TabsTrigger({
+ value,
+ className,
+ children,
+}: {
+ value: string;
+ className?: string;
+ children: React.ReactNode;
+}) {
+ const { value: activeValue, onValueChange } = useTabs();
+ const isActive = value === activeValue;
+ return (
+
+ );
+}
+
+function TabsContent({
+ value,
+ className,
+ children,
+}: {
+ value: string;
+ className?: string;
+ children: React.ReactNode;
+}) {
+ const { value: activeValue } = useTabs();
+ if (value !== activeValue) return null;
+ return {children}
;
+}
+
+export { Tabs, TabsList, TabsTrigger, TabsContent };
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
new file mode 100644
index 0000000..3b7f073
--- /dev/null
+++ b/src/components/ui/tooltip.tsx
@@ -0,0 +1,30 @@
+"use client";
+
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+interface TooltipProps {
+ content: string;
+ children: React.ReactNode;
+ className?: string;
+}
+
+export function Tooltip({ content, children, className }: TooltipProps) {
+ const [show, setShow] = React.useState(false);
+
+ return (
+ setShow(true)}
+ onMouseLeave={() => setShow(false)}
+ >
+ {children}
+ {show && (
+
+ )}
+