feat: CRUD admin for skills and teams

components/admin/management/tree-search-controls.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { Search } from "lucide-react";
+import { Input } from "@/components/ui/input";
+import { Button } from "@/components/ui/button";
+
+interface TreeSearchControlsProps {
+  searchTerm: string;
+  onSearchChange: (value: string) => void;
+  onExpandAll: () => void;
+  onCollapseAll: () => void;
+  placeholder?: string;
+}
+
+export function TreeSearchControls({
+  searchTerm,
+  onSearchChange,
+  onExpandAll,
+  onCollapseAll,
+  placeholder = "Rechercher...",
+}: TreeSearchControlsProps) {
+  return (
+    <div className="flex flex-col sm:flex-row gap-3">
+      <div className="relative flex-1">
+        <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-slate-400 w-4 h-4" />
+        <Input
+          placeholder={placeholder}
+          value={searchTerm}
+          onChange={(e) => onSearchChange(e.target.value)}
+          className="pl-10"
+        />
+      </div>
+      <div className="flex gap-2">
+        <Button
+          variant="outline"
+          size="sm"
+          onClick={onExpandAll}
+          className="text-slate-400 hover:text-white"
+        >
+          Tout ouvrir
+        </Button>
+        <Button
+          variant="outline"
+          size="sm"
+          onClick={onCollapseAll}
+          className="text-slate-400 hover:text-white"
+        >
+          Tout fermer
+        </Button>
+      </div>
+    </div>
+  );
+}