feat: enhance FormDialog component with improved layout and utility class integration
This commit is contained in:
parent
ddbbf1cc7f
commit
89454c3cc4
@ -9,6 +9,7 @@ import {
|
|||||||
DialogHeader,
|
DialogHeader,
|
||||||
DialogTitle,
|
DialogTitle,
|
||||||
} from '@/components/ui/dialog';
|
} from '@/components/ui/dialog';
|
||||||
|
import { cn } from '@/lib/utils';
|
||||||
|
|
||||||
type FormDialogProps = {
|
type FormDialogProps = {
|
||||||
open: boolean;
|
open: boolean;
|
||||||
@ -44,23 +45,29 @@ export function FormDialog({
|
|||||||
}: FormDialogProps) {
|
}: FormDialogProps) {
|
||||||
return (
|
return (
|
||||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||||
<DialogContent className={contentClassName}>
|
<DialogContent
|
||||||
|
className={cn(
|
||||||
|
'flex max-h-[85vh] flex-col overflow-hidden',
|
||||||
|
contentClassName,
|
||||||
|
)}
|
||||||
|
>
|
||||||
<Form
|
<Form
|
||||||
action={action}
|
action={action}
|
||||||
resetOnSuccess={resetOnSuccess}
|
resetOnSuccess={resetOnSuccess}
|
||||||
onSuccess={onSuccess}
|
onSuccess={onSuccess}
|
||||||
|
className="flex min-h-0 flex-1 flex-col"
|
||||||
>
|
>
|
||||||
{({ errors, processing }) => (
|
{({ errors, processing }) => (
|
||||||
<>
|
<>
|
||||||
<DialogHeader>
|
<DialogHeader className="shrink-0">
|
||||||
<DialogTitle>{title}</DialogTitle>
|
<DialogTitle>{title}</DialogTitle>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="grid gap-4 py-4">
|
<div className="grid flex-1 gap-4 overflow-y-auto py-4">
|
||||||
{typeof children === 'function'
|
{typeof children === 'function'
|
||||||
? children({ errors, processing })
|
? children({ errors, processing })
|
||||||
: children}
|
: children}
|
||||||
</div>
|
</div>
|
||||||
<DialogFooter>
|
<DialogFooter className="shrink-0">
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
variant="outline"
|
variant="outline"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user