3ae87334bd
Add WireGuard networking fields (interface, management pool, listen port), container network pool, coold/corrosion versioning, and builder CPU quota to clusters and servers via new migrations and model fillables. Expose full cluster and server CRUD on the Clusters page with private key selection, pending state tracking, and new form primitives (Field, Input, Textarea). Add server status check fields and a lima test VM config for development.
93 lines
3.3 KiB
TypeScript
93 lines
3.3 KiB
TypeScript
import { Dialog as DialogPrimitive } from '@base-ui/react/dialog';
|
|
import { XIcon } from '@phosphor-icons/react';
|
|
import type * as React from 'react';
|
|
|
|
import { Button } from '@/components/ui/button';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {
|
|
return <DialogPrimitive.Root data-slot="dialog" {...props} />;
|
|
}
|
|
|
|
function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {
|
|
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />;
|
|
}
|
|
|
|
function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Backdrop>) {
|
|
return (
|
|
<DialogPrimitive.Backdrop
|
|
data-slot="dialog-overlay"
|
|
className={cn('fixed inset-0 bg-background/80 backdrop-blur-sm', className)}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|
|
|
|
function DialogContent({
|
|
className,
|
|
children,
|
|
showCloseButton = true,
|
|
...props
|
|
}: React.ComponentProps<typeof DialogPrimitive.Popup> & {
|
|
showCloseButton?: boolean;
|
|
}) {
|
|
return (
|
|
<DialogPortal>
|
|
<DialogOverlay />
|
|
<DialogPrimitive.Popup
|
|
data-slot="dialog-content"
|
|
className={cn(
|
|
'fixed left-1/2 top-1/2 z-50 max-h-[calc(100dvh-2rem)] w-[calc(100%-2rem)] max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-lg border border-border bg-card p-6 shadow-lg outline-none',
|
|
className,
|
|
)}
|
|
{...props}
|
|
>
|
|
{children}
|
|
{showCloseButton && (
|
|
<DialogPrimitive.Close
|
|
data-slot="dialog-close"
|
|
aria-label="Close dialog"
|
|
render={<Button type="button" variant="ghost" size="icon-sm" className="absolute top-3 right-3" />}
|
|
>
|
|
<XIcon />
|
|
<span className="sr-only">Close</span>
|
|
</DialogPrimitive.Close>
|
|
)}
|
|
</DialogPrimitive.Popup>
|
|
</DialogPortal>
|
|
);
|
|
}
|
|
|
|
function DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {
|
|
return <div data-slot="dialog-header" className={cn('flex flex-col gap-1.5', className)} {...props} />;
|
|
}
|
|
|
|
function DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {
|
|
return <div data-slot="dialog-footer" className={cn('flex justify-end gap-2', className)} {...props} />;
|
|
}
|
|
|
|
function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {
|
|
return (
|
|
<DialogPrimitive.Title
|
|
data-slot="dialog-title"
|
|
className={cn('text-lg font-semibold text-foreground', className)}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|
|
|
|
function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {
|
|
return (
|
|
<DialogPrimitive.Description
|
|
data-slot="dialog-description"
|
|
className={cn('text-sm text-muted-foreground', className)}
|
|
{...props}
|
|
/>
|
|
);
|
|
}
|
|
|
|
function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {
|
|
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />;
|
|
}
|
|
|
|
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle };
|