Rohit Luni
TTCTheo's Typesafe Cult
•Created by FleetAdmiralJakob 🗕 🗗 🗙 on 12/27/2024 in #questions
use(props.params) vs useParams() in Client Component in Next.js
I don't know man I just thought 😆
14 replies
TTCTheo's Typesafe Cult
•Created by tyler4949 on 12/24/2024 in #questions
shadcn Dialog - "submit" vs "cancel"
export function MyDialog() {
const [isOpen, setIsOpen] = useState(false);
const [isFormSubmitted, setIsFormSubmitted] = useState(false);
const { register, handleSubmit, reset } = useForm();
// Handle form submission
const onSubmit = async (data) => {
setIsFormSubmitted(true);
await fetch("/api/save", {
method: "POST",
body: JSON.stringify(data),
});
setIsOpen(false); // Close the dialog after submission
};
// Handle dialog close
const onOpenChange = (open) => {
if (!open && !isFormSubmitted) {
reset(); // Reset the form if the dialog is closed manually
}
setIsOpen(open);
setIsFormSubmitted(false); // Reset the flag
};
return (
<Dialog open={isOpen} onOpenChange={onOpenChange}>
<Button onClick={() => setIsOpen(true)}>Open Dialog</Button>
<DialogContent>
<DialogHeader>
<DialogTitle>My Form</DialogTitle>
</DialogHeader>
<form onSubmit={handleSubmit(onSubmit)}>
<input {...register("name")} placeholder="Name" />
<DialogFooter>
<Button type="submit">Save</Button>
</DialogFooter>
</form>
</DialogContent>
</Dialog>
);
}
this might work
6 replies
TTCTheo's Typesafe Cult
•Created by FleetAdmiralJakob 🗕 🗗 🗙 on 12/27/2024 in #questions
use(props.params) vs useParams() in Client Component in Next.js
I think useParams() is the more ideal and future-oriented choice for Client Components in Next.js 15
14 replies