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.
1.4 kB · 45 lines
TSX
12345678910111213141516171819202122232425262728293031323334353637383940414243444546"use client";
import { Kbd } from "@openstatus/ui/components/ui/kbd";import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger,} from "@openstatus/ui/components/ui/tooltip";import { useIsMobile } from "@openstatus/ui/hooks/use-mobile";import * as Portal from "@radix-ui/react-portal";
export function DevelopmentIndicator() { const isMobile = useIsMobile();
if (process.env.NODE_ENV !== "production") return null;
return ( <Portal.Root> <div className="border-destructive pointer-events-none fixed inset-0 z-[9999] border-2" /> <div className="fixed inset-x-0 bottom-0 z-[9999] select-none"> <div className="flex items-center justify-center"> <TooltipProvider delayDuration={0}> <Tooltip> <TooltipTrigger> <div className="bg-destructive text-background w-fit rounded-t-sm px-2 py-1 font-mono text-xs"> In Beta </div> </TooltipTrigger> <TooltipContent side="top"> {!isMobile ? ( <p> Press <Kbd>F</Kbd> key to provide feedback. </p> ) : ( <p>Use a larger screen to provide feedback.</p> )} </TooltipContent> </Tooltip> </TooltipProvider> </div> </div> </Portal.Root> );}