MIF_E31221222/sigap-website/components/admin/users/user-form.tsx

149 lines
5.5 KiB
TypeScript

// "use client"
// import { zodResolver } from "@hookform/resolvers/zod"
// import { useForm } from "react-hook-form"
// import { z } from "zod"
// import { Button } from "@/components/ui/button"
// import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form"
// import { Input } from "@/components/ui/input"
// import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
// import { useState } from "react"
// import { User } from "./column"
// import { updateUser } from "../../user-management/action"
// import { toast } from "@/app/_hooks/use-toast"
// const userFormSchema = z.object({
// email: z.string().email({ message: "Please enter a valid email address" }),
// first_name: z.string().nullable(),
// last_name: z.string().nullable(),
// role: z.enum(["user", "admin", "moderator"]),
// })
// type UserFormValues = z.infer<typeof userFormSchema>
// interface UserFormProps {
// user: User
// }
// export function UserForm({ user }: UserFormProps) {
// const [isSubmitting, setIsSubmitting] = useState(false)
// const form = useForm<UserFormValues>({
// resolver: zodResolver(userFormSchema),
// defaultValues: {
// email: user.email,
// first_name: user.first_name,
// last_name: user.last_name,
// role: user.role as "user" | "admin" | "moderator",
// },
// })
// async function onSubmit(data: UserFormValues) {
// try {
// setIsSubmitting(true)
// await updateUser(user.id, data)
// toast({
// title: "User updated",
// description: "The user" + user.email + " has been updated.",
// })
// } catch (error) {
// toast({
// title: "Failed to update user",
// description: "An error occurred while updating the user.",
// variant: "destructive",
// })
// console.error(error)
// } finally {
// setIsSubmitting(false)
// }
// }
// return (
// <Form {...form}>
// <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
// <FormField
// control={form.control}
// name="email"
// render={({ field }) => (
// <FormItem>
// <FormLabel className="text-white">Email</FormLabel>
// <FormControl>
// <Input
// {...field}
// className="bg-[#1c1c1c] border-[#2a2a2a] text-white focus-visible:ring-[#2a2a2a] focus-visible:ring-offset-0"
// />
// </FormControl>
// <FormDescription className="text-gray-400">This is the user's email address.</FormDescription>
// <FormMessage />
// </FormItem>
// )}
// />
// <div className="grid grid-cols-2 gap-4">
// <FormField
// control={form.control}
// name="first_name"
// render={({ field }) => (
// <FormItem>
// <FormLabel className="text-white">First Name</FormLabel>
// <FormControl>
// <Input
// {...field}
// value={field.value || ""}
// className="bg-[#1c1c1c] border-[#2a2a2a] text-white focus-visible:ring-[#2a2a2a] focus-visible:ring-offset-0"
// />
// </FormControl>
// <FormMessage />
// </FormItem>
// )}
// />
// <FormField
// control={form.control}
// name="last_name"
// render={({ field }) => (
// <FormItem>
// <FormLabel className="text-white">Last Name</FormLabel>
// <FormControl>
// <Input
// {...field}
// value={field.value || ""}
// className="bg-[#1c1c1c] border-[#2a2a2a] text-white focus-visible:ring-[#2a2a2a] focus-visible:ring-offset-0"
// />
// </FormControl>
// <FormMessage />
// </FormItem>
// )}
// />
// </div>
// <FormField
// control={form.control}
// name="role"
// render={({ field }) => (
// <FormItem>
// <FormLabel className="text-white">Role</FormLabel>
// <Select onValueChange={field.onChange} defaultValue={field.value}>
// <FormControl>
// <SelectTrigger className="bg-[#1c1c1c] border-[#2a2a2a] text-white focus:ring-[#2a2a2a] focus:ring-offset-0">
// <SelectValue placeholder="Select a role" />
// </SelectTrigger>
// </FormControl>
// <SelectContent className="bg-[#1c1c1c] border-[#2a2a2a] text-white">
// <SelectItem value="user">User</SelectItem>
// <SelectItem value="admin">Admin</SelectItem>
// <SelectItem value="moderator">Moderator</SelectItem>
// </SelectContent>
// </Select>
// <FormDescription className="text-gray-400">The user's role determines their permissions.</FormDescription>
// <FormMessage />
// </FormItem>
// )}
// />
// <Button type="submit" disabled={isSubmitting} className="bg-emerald-600 hover:bg-emerald-700 text-white">
// {isSubmitting ? "Saving..." : "Save changes"}
// </Button>
// </form>
// </Form>
// )
// }