reafctor: pages for management and split components

components/admin/users/user-form-dialog.tsx

@@ -0,0 +1,108 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Team } from "@/services/admin-management-service";
+
+interface UserFormData {
+  firstName: string;
+  lastName: string;
+  teamId: string;
+}
+
+interface UserFormDialogProps {
+  isOpen: boolean;
+  onClose: () => void;
+  onSubmit: () => void;
+  title: string;
+  formData: UserFormData;
+  onFormDataChange: (data: UserFormData) => void;
+  teams: Team[];
+  isSubmitting?: boolean;
+}
+
+export function UserFormDialog({
+  isOpen,
+  onClose,
+  onSubmit,
+  title,
+  formData,
+  onFormDataChange,
+  teams,
+  isSubmitting = false,
+}: UserFormDialogProps) {
+  const handleInputChange = (field: keyof UserFormData, value: string) => {
+    onFormDataChange({ ...formData, [field]: value });
+  };
+
+  return (
+    <Dialog open={isOpen} onOpenChange={onClose}>
+      <DialogContent className="sm:max-w-[500px]">
+        <DialogHeader>
+          <DialogTitle>{title}</DialogTitle>
+        </DialogHeader>
+        <div className="space-y-4">
+          <div>
+            <Label htmlFor="user-first-name">Prénom *</Label>
+            <Input
+              id="user-first-name"
+              value={formData.firstName}
+              onChange={(e) => handleInputChange("firstName", e.target.value)}
+              placeholder="Prénom de l'utilisateur"
+            />
+          </div>
+          <div>
+            <Label htmlFor="user-last-name">Nom *</Label>
+            <Input
+              id="user-last-name"
+              value={formData.lastName}
+              onChange={(e) => handleInputChange("lastName", e.target.value)}
+              placeholder="Nom de l'utilisateur"
+            />
+          </div>
+          <div>
+            <Label htmlFor="user-team">Équipe</Label>
+            <Select
+              value={formData.teamId}
+              onValueChange={(value) => handleInputChange("teamId", value)}
+            >
+              <SelectTrigger>
+                <SelectValue placeholder="Sélectionner une équipe (optionnel)" />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="">Aucune équipe</SelectItem>
+                {teams.map((team) => (
+                  <SelectItem key={team.id} value={team.id}>
+                    {team.name}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+          <div className="flex justify-end gap-2 pt-4">
+            <Button variant="outline" onClick={onClose} disabled={isSubmitting}>
+              Annuler
+            </Button>
+            <Button onClick={onSubmit} disabled={isSubmitting}>
+              {isSubmitting ? "En cours..." : title.includes("Créer") ? "Créer" : "Mettre à jour"}
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}