refactor: revew all design of services, clients, deadcode, ...

components/create-skill-form.tsx

@@ -6,7 +6,7 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { Label } from "@/components/ui/label";
 import { Plus, X, Link as LinkIcon, Loader2 } from "lucide-react";
-import { apiClient } from "@/services/client";
+import { skillsClient } from "@/clients";
 
 interface CreateSkillFormProps {
   categoryName: string;
@@ -29,31 +29,31 @@ export function CreateSkillForm({
   const [error, setError] = useState("");
 
   const addLink = () => {
-    setFormData(prev => ({
+    setFormData((prev) => ({
       ...prev,
-      links: [...prev.links, ""]
+      links: [...prev.links, ""],
     }));
   };
 
   const removeLink = (index: number) => {
-    setFormData(prev => ({
+    setFormData((prev) => ({
       ...prev,
-      links: prev.links.filter((_, i) => i !== index)
+      links: prev.links.filter((_, i) => i !== index),
     }));
   };
 
   const updateLink = (index: number, value: string) => {
-    setFormData(prev => ({
+    setFormData((prev) => ({
       ...prev,
-      links: prev.links.map((link, i) => i === index ? value : link)
+      links: prev.links.map((link, i) => (i === index ? value : link)),
     }));
   };
 
   const generateSkillId = (name: string) => {
     return name
       .toLowerCase()
-      .replace(/[^a-z0-9\s]/g, '')
-      .replace(/\s+/g, '-')
+      .replace(/[^a-z0-9\s]/g, "")
+      .replace(/\s+/g, "-")
       .trim();
   };
 
@@ -80,7 +80,7 @@ export function CreateSkillForm({
       const categoryId = getCategoryId(categoryName);
 
       // Filtrer les liens vides
-      const validLinks = formData.links.filter(link => link.trim());
+      const validLinks = formData.links.filter((link) => link.trim());
 
       const skillData = {
         id: skillId,
@@ -90,7 +90,7 @@ export function CreateSkillForm({
         links: validLinks,
       };
 
-      const success = await apiClient.createSkill(categoryId, skillData);
+      const success = await skillsClient.createSkill(categoryId, skillData);
 
       if (success) {
         onSuccess(skillId);
@@ -118,7 +118,9 @@ export function CreateSkillForm({
           id="skill-name"
           placeholder="ex: Next.js, Docker, Figma..."
           value={formData.name}
-          onChange={(e) => setFormData(prev => ({ ...prev, name: e.target.value }))}
+          onChange={(e) =>
+            setFormData((prev) => ({ ...prev, name: e.target.value }))
+          }
           disabled={isLoading}
         />
       </div>
@@ -129,7 +131,9 @@ export function CreateSkillForm({
           id="skill-description"
           placeholder="Décrivez brièvement cette compétence..."
           value={formData.description}
-          onChange={(e) => setFormData(prev => ({ ...prev, description: e.target.value }))}
+          onChange={(e) =>
+            setFormData((prev) => ({ ...prev, description: e.target.value }))
+          }
           disabled={isLoading}
           rows={3}
         />
@@ -141,11 +145,14 @@ export function CreateSkillForm({
           id="skill-icon"
           placeholder="ex: fab-react, fas-database..."
           value={formData.icon}
-          onChange={(e) => setFormData(prev => ({ ...prev, icon: e.target.value }))}
+          onChange={(e) =>
+            setFormData((prev) => ({ ...prev, icon: e.target.value }))
+          }
           disabled={isLoading}
         />
         <p className="text-xs text-muted-foreground">
-          Utilisez les classes FontAwesome (fab-, fas-, far-) ou laissez vide pour l'icône par défaut
+          Utilisez les classes FontAwesome (fab-, fas-, far-) ou laissez vide
+          pour l'icône par défaut
         </p>
       </div>
 
@@ -205,7 +212,12 @@ export function CreateSkillForm({
             </>
           )}
         </Button>
-        <Button type="button" variant="outline" onClick={onCancel} disabled={isLoading}>
+        <Button
+          type="button"
+          variant="outline"
+          onClick={onCancel}
+          disabled={isLoading}
+        >
           Annuler
         </Button>
       </div>