Openstatus www.openstatus.dev
at main 67 lines 2.0 kB view raw
1"use client"; 2 3import { FormCard, FormCardGroup } from "@/components/forms/form-card"; 4import { 5 FormSheetContent, 6 FormSheetDescription, 7 FormSheetFooter, 8 FormSheetHeader, 9 FormSheetTitle, 10 FormSheetTrigger, 11 FormSheetWithDirtyProtection, 12} from "@/components/forms/form-sheet"; 13import { 14 FormPrivateLocation, 15 type FormValues, 16} from "@/components/forms/private-location/form"; 17import { Button } from "@/components/ui/button"; 18import { useState } from "react"; 19 20export function FormSheetPrivateLocation({ 21 children, 22 defaultValues, 23 onSubmit, 24 monitors, 25 ...props 26}: Omit<React.ComponentProps<typeof FormSheetTrigger>, "onSubmit"> & { 27 defaultValues?: FormValues; 28 monitors: { id: number; name: string; url: string }[]; 29 onSubmit: (values: FormValues) => Promise<void>; 30}) { 31 const [open, setOpen] = useState(false); 32 33 return ( 34 <FormSheetWithDirtyProtection open={open} onOpenChange={setOpen}> 35 <FormSheetTrigger {...props} asChild> 36 {children} 37 </FormSheetTrigger> 38 <FormSheetContent> 39 <FormSheetHeader> 40 <FormSheetTitle>Private Location</FormSheetTitle> 41 <FormSheetDescription> 42 Configure and update the private location. 43 </FormSheetDescription> 44 </FormSheetHeader> 45 <FormCardGroup className="overflow-y-auto"> 46 <FormCard className="overflow-auto rounded-none border-none"> 47 <FormPrivateLocation 48 monitors={monitors} 49 onSubmit={async (values) => { 50 await onSubmit(values); 51 setOpen(false); 52 }} 53 defaultValues={defaultValues} 54 id="private-location-form" 55 className="my-4" 56 /> 57 </FormCard> 58 </FormCardGroup> 59 <FormSheetFooter> 60 <Button type="submit" form="private-location-form"> 61 Submit 62 </Button> 63 </FormSheetFooter> 64 </FormSheetContent> 65 </FormSheetWithDirtyProtection> 66 ); 67}