website refactor

apps/website/ui/ConfirmDialog.tsx

@@ -0,0 +1,47 @@
+import { Button } from '@/ui/Button';
+import { Modal } from '@/ui/Modal';
+import { Text } from '@/ui/Text';
+import { Icon } from '@/ui/Icon';
+import { AlertCircle } from 'lucide-react';
+import React from 'react';
+
+interface ConfirmDialogProps {
+  isOpen: boolean;
+  onClose: () => void;
+  onConfirm: () => void;
+  title: string;
+  description: string;
+  confirmLabel?: string;
+  cancelLabel?: string;
+  variant?: 'danger' | 'primary';
+  isLoading?: boolean;
+}
+
+export function ConfirmDialog({
+  isOpen,
+  onClose,
+  onConfirm,
+  title,
+  description,
+  confirmLabel = 'Confirm',
+  cancelLabel = 'Cancel',
+  variant = 'primary',
+  isLoading = false,
+}: ConfirmDialogProps) {
+  return (
+    <Modal 
+      isOpen={isOpen} 
+      onClose={onClose} 
+      title={title}
+      primaryActionLabel={isLoading ? 'Processing...' : confirmLabel}
+      onPrimaryAction={onConfirm}
+      secondaryActionLabel={cancelLabel}
+      onSecondaryAction={onClose}
+      icon={variant === 'danger' ? <Icon icon={AlertCircle} size={5} intent="critical" /> : undefined}
+    >
+      <Text variant="low" size="sm">
+        {description}
+      </Text>
+    </Modal>
+  );
+}