Skip to main content
Glama
ConvexStatusWidget.tsx2.09 kB
import { ExternalLinkIcon } from "@radix-ui/react-icons"; import { cn } from "@ui/cn"; import { Spinner } from "@ui/Spinner"; export type ConvexStatusIndicator = "none" | "minor" | "major" | "critical"; export interface ConvexStatus { indicator: ConvexStatusIndicator; description: string; } const STATUS_PAGE_URL = "https://status.convex.dev"; export function ConvexStatusWidget({ status }: { status?: ConvexStatus }) { return ( <a href={STATUS_PAGE_URL} target="_blank" rel="noreferrer" className={cn( "flex items-center gap-2 text-sm hover:underline", !status && "animate-fadeInFromLoading", )} > {!status ? ( <> <div> <Spinner className="animate-fadeInFromLoading" /> </div> <span className="animate-fadeInFromLoading text-content-secondary"> Loading system status... </span> <ExternalLinkIcon className="animate-fadeInFromLoading" /> </> ) : ( <> <span className="relative flex size-3 shrink-0"> {status.indicator === "none" && ( <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-content-success opacity-75" /> )} <span className={cn( "relative inline-flex size-3 rounded-full", // eslint-disable-next-line no-restricted-syntax status.indicator === "none" && "bg-content-success", status.indicator === "minor" && "bg-yellow-500", // eslint-disable-next-line no-restricted-syntax status.indicator === "major" && "bg-content-errorSecondary", // eslint-disable-next-line no-restricted-syntax status.indicator === "critical" && "bg-content-errorSecondary", )} /> </span> <span className="flex items-center gap-1"> {status.description} <ExternalLinkIcon /> </span> </> )} </a> ); }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/get-convex/convex-backend'

If you have feedback or need assistance with the MCP directory API, please join our Discord server