47 lines
1.6 KiB
TypeScript
47 lines
1.6 KiB
TypeScript
'use client'
|
|
import React, { useEffect } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import { UpdateFormProps } from "@/validations/mutual/forms/type";
|
|
import { useForm } from "react-hook-form";
|
|
import { zodResolver } from "@hookform/resolvers/zod";
|
|
import { Form } from "@/components/mutual/shadcnui/form";
|
|
import { renderInputsBySchema } from "@/lib/renderInputs";
|
|
import { Button } from "@/components/mutual/shadcnui/button";
|
|
|
|
const UpdateForm: React.FC<UpdateFormProps> = ({ schemas, selectedRow, rollbackTo, labels }) => {
|
|
const router = useRouter()
|
|
useEffect(() => {
|
|
if (!selectedRow) {
|
|
router.push(rollbackTo, { scroll: false })
|
|
}
|
|
}, [selectedRow])
|
|
const updateSchema = schemas.update
|
|
const findLabels = Object.entries(updateSchema?.shape || {}).reduce((acc: any, [key, value]: any) => {
|
|
acc[key] = {
|
|
label: labels[key] || key,
|
|
description: value.description,
|
|
}
|
|
return acc
|
|
}, {})
|
|
const handleSubmit = (data: any) => {
|
|
console.log(data)
|
|
}
|
|
const form = useForm<FormData>({
|
|
resolver: zodResolver(updateSchema),
|
|
defaultValues: selectedRow,
|
|
});
|
|
return (
|
|
<div>
|
|
<div>Update Form</div>
|
|
<Form {...form}>
|
|
<form onSubmit={form.handleSubmit(handleSubmit)} className="space-y-4">
|
|
{selectedRow && renderInputsBySchema(findLabels, form)}
|
|
{selectedRow && <Button type="submit">Submit</Button>}
|
|
</form>
|
|
</Form>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default UpdateForm
|