chore init

2026-09-16 21:34:09 +02:00
1 parent 1b7406b1d3
commit a0d312a884
@@ -0,0 +1,119 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { useRef, type ChangeEvent } from "react";
+import { Download, FileText, Printer, RotateCcw, Upload } from "lucide-react";
+import { Button } from "@/components/ui/Button";
+import { normalizeCVCareerData } from "@/lib/storage";
+import type { CVCareerData } from "@/lib/types/cv";
+
+interface CvToolbarProps {
+  onReset: () => void;
+  data: CVCareerData;
+  onImport: (value: CVCareerData) => void;
+}
+
+export function CvToolbar({ onReset, data, onImport }: CvToolbarProps) {
+  const pathname = usePathname();
+  const fileInputRef = useRef<HTMLInputElement>(null);
+
+  function handleExport() {
+    const blob = new Blob([JSON.stringify(data, null, 2)], { type: "application/json" });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = "cv-maker.json";
+    link.click();
+    URL.revokeObjectURL(url);
+  }
+
+  function handleImportFile(event: ChangeEvent<HTMLInputElement>) {
+    const file = event.target.files?.[0];
+    event.target.value = "";
+    if (!file) return;
+    const reader = new FileReader();
+    reader.onload = () => {
+      try {
+        const parsed: unknown = JSON.parse(String(reader.result));
+        const value = normalizeCVCareerData(parsed);
+        if (value === null) {
+          window.alert("Fichier invalide : ce n'est pas un CV au format attendu.");
+          return;
+        }
+        if (window.confirm("Importer ce CV ? Le contenu actuel sera remplacé.")) {
+          onImport(value);
+        }
+      } catch {
+        window.alert("Fichier illisible : le JSON est invalide.");
+      }
+    };
+    reader.readAsText(file);
+  }
+
+  return (
+    <header className="print-hidden sticky top-0 z-10 flex flex-wrap items-center justify-between gap-3 border-b border-border bg-white px-6 py-3">
+      <div className="flex items-center gap-2">
+        <span className="flex h-8 w-8 items-center justify-center rounded-md bg-accent text-white">
+          <FileText size={18} aria-hidden />
+        </span>
+        <span className="text-base font-bold text-ink">CV-Maker</span>
+      </div>
+
+      <nav className="flex flex-wrap items-center gap-2">
+        <Button variant="ghost" size="sm" onClick={() => window.print()} title="Imprimer ou exporter en PDF">
+          <Printer size={14} aria-hidden />
+          Imprimer / PDF
+        </Button>
+        <input
+          ref={fileInputRef}
+          type="file"
+          accept="application/json,.json"
+          className="hidden"
+          onChange={handleImportFile}
+        />
+        <Button
+          variant="ghost"
+          size="sm"
+          onClick={() => fileInputRef.current?.click()}
+          title="Importer un CV depuis un fichier JSON"
+        >
+          <Upload size={14} aria-hidden />
+          Importer JSON
+        </Button>
+        <Button variant="ghost" size="sm" onClick={handleExport} title="Télécharger le CV au format JSON">
+          <Download size={14} aria-hidden />
+          Exporter JSON
+        </Button>
+        <Button
+          variant="ghost"
+          size="sm"
+          title="Réinitialiser le CV"
+          onClick={() => {
+            if (window.confirm("Réinitialiser tout le contenu du CV ?")) onReset();
+          }}
+        >
+          <RotateCcw size={14} aria-hidden />
+          Réinitialiser
+        </Button>
+        {[
+          { href: "/documentation", label: "Documentation" },
+        ].map(({ href, label: linkLabel }) => {
+          const active = pathname === href;
+          return (
+            <Link
+              key={href}
+              href={href}
+              aria-current={active ? "page" : undefined}
+              className={`rounded-md px-3 py-1.5 text-sm font-medium transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent ${
+                active ? "bg-accent text-white" : "text-muted hover:text-ink"
+              }`}
+            >
+              {linkLabel}
+            </Link>
+          );
+        })}
+      </nav>
+    </header>
+  );
+}