66 DialogClose ,
77 DialogContent ,
88 DialogDescription ,
9- DialogFooter ,
109 DialogHeader ,
1110 DialogTitle ,
1211 DialogTrigger ,
@@ -17,13 +16,14 @@ export function DangerSettingCard(props: {
1716 title : string ;
1817 className ?: string ;
1918 footerClassName ?: string ;
20- description : string ;
19+ description : React . ReactNode ;
2120 buttonLabel : string ;
2221 buttonOnClick : ( ) => void ;
22+ isDisabled ?: boolean ;
2323 isPending : boolean ;
2424 confirmationDialog : {
2525 title : string ;
26- description : string ;
26+ description : React . ReactNode ;
2727 } ;
2828 children ?: React . ReactNode ;
2929} ) {
@@ -55,28 +55,30 @@ export function DangerSettingCard(props: {
5555 < Button
5656 variant = "destructive"
5757 className = "gap-2 bg-red-600 font-semibold text-white hover:bg-red-600/80"
58- disabled = { props . isPending }
58+ disabled = { props . isDisabled || props . isPending }
5959 >
6060 { props . isPending && < Spinner className = "size-3" /> }
6161 { props . buttonLabel }
6262 </ Button >
6363 </ DialogTrigger >
6464
6565 < DialogContent
66- className = "z-[10001]"
66+ className = "z-[10001] overflow-hidden p-0 "
6767 dialogOverlayClassName = "z-[10000]"
6868 >
69- < DialogHeader className = "pr-10" >
70- < DialogTitle className = "leading-snug" >
71- { props . confirmationDialog . title }
72- </ DialogTitle >
69+ < div className = "p-6" >
70+ < DialogHeader className = "pr-10" >
71+ < DialogTitle className = "leading-snug" >
72+ { props . confirmationDialog . title }
73+ </ DialogTitle >
7374
74- < DialogDescription >
75- { props . confirmationDialog . description }
76- </ DialogDescription >
77- </ DialogHeader >
75+ < DialogDescription >
76+ { props . confirmationDialog . description }
77+ </ DialogDescription >
78+ </ DialogHeader >
79+ </ div >
7880
79- < DialogFooter className = "mt-4 gap-4 lg:gap-2" >
81+ < div className = "flex justify-end gap-4 border-t bg-card p-6 lg:gap-2" >
8082 < DialogClose asChild >
8183 < Button variant = "outline" > Cancel</ Button >
8284 </ DialogClose >
@@ -90,7 +92,7 @@ export function DangerSettingCard(props: {
9092 { props . isPending && < Spinner className = "size-3" /> }
9193 { props . buttonLabel }
9294 </ Button >
93- </ DialogFooter >
95+ </ div >
9496 </ DialogContent >
9597 </ Dialog >
9698 </ div >
0 commit comments