Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/openstatusHQ/openstatus. 🫖 Status page with uptime monitoring & API monitoring as code 🫖 openstatus.dev
bun drizzle-orm monitoring monitoring-as-code nextjs observability on-call open-source shadcn-ui status-page statuspage synthetic-monitoring tinybird turso uptime uptime-checker uptime-monitor
Something went wrong. Try again.
3.0 kB · 89 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990import { Check, Copy } from "@openstatus/icons";import { Button } from "@openstatus/ui/components/ui/button";import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle,} from "@openstatus/ui/components/ui/dialog";import { Tabs, TabsContent, TabsList, TabsTrigger,} from "@openstatus/ui/components/ui/tabs";import { useCopyToClipboard } from "@openstatus/ui/hooks/use-copy-to-clipboard";import type { DialogProps } from "@radix-ui/react-dialog";
import { Link } from "@/components/common/link";
// TODL: make it dynamicconst YML = `openstatus-marketing: name: OpenStatus Marketing description: Marketing website for OpenStatus active: true public: false frequency: "10m" regions: ["ams", "fra", "gru", "sin", "iad"] kind: "http" request: url: https://api.openstatus.dev method: GET`;
export function ExportCodeDialog(props: DialogProps) { const { copy, isCopied } = useCopyToClipboard();
return ( <Dialog {...props}> <DialogContent> <DialogHeader> <DialogTitle>Export Configuration</DialogTitle> <DialogDescription> Export and manage your monitor configuration using Infra as Code. </DialogDescription> </DialogHeader> <Tabs defaultValue="yml"> <TabsList> <TabsTrigger value="yml">YAML</TabsTrigger> <TabsTrigger value="terraform">Terraform</TabsTrigger> </TabsList> <TabsContent value="yml" className="space-y-2"> <pre className="bg-muted relative rounded border p-2 text-xs"> {YML} <Button variant="outline" size="icon" className="absolute top-2 right-2 size-7 p-1" onClick={() => copy(YML, { withToast: false, timeout: 1000 })} > {isCopied ? ( <Check className="size-3" /> ) : ( <Copy className="size-3" /> )} </Button> </pre> <p className="text-muted-foreground text-xs"> Use a <code>monitor.openstatus.yml</code> file to configure your monitors. <Link href="#">Read more.</Link> </p> </TabsContent> <TabsContent value="terraform" className="space-y-2"> <pre className="bg-muted relative rounded border p-2 text-xs"> TODO: </pre> {/* TODO: only showcase if there are any assertions */} <p className="text-destructive text-xs"> The Terraform provider does not support assertions yet. </p> <p className="text-muted-foreground text-xs"> Use a Terraform provider to manage your monitors.{" "} <Link href="#">Read more.</Link> </p> </TabsContent> </Tabs> </DialogContent> </Dialog> );}