Initial commitHEADmain

Created from https://vercel.com/new

1 files changed, 42 insertions, 0 deletions

diff --git a/src/components/common/ConfirmationForm.tsx b/src/components/common/ConfirmationForm.tsx
new file mode 100644
index 0000000..b909ef5
--- /dev/null
+++ b/src/components/common/ConfirmationForm.tsx
@@ -0,0 +1,42 @@
+import { Box, Button, Form, FormButtons, FormSubmitButton } from '@umami/react-zen';
+import type { ReactNode } from 'react';
+import { useMessages } from '@/components/hooks';
+
+export interface ConfirmationFormProps {
+  message: ReactNode;
+  buttonLabel?: ReactNode;
+  buttonVariant?: 'primary' | 'quiet' | 'danger';
+  isLoading?: boolean;
+  error?: string | Error;
+  onConfirm?: () => void;
+  onClose?: () => void;
+}
+
+export function ConfirmationForm({
+  message,
+  buttonLabel,
+  buttonVariant,
+  isLoading,
+  error,
+  onConfirm,
+  onClose,
+}: ConfirmationFormProps) {
+  const { formatMessage, labels, getErrorMessage } = useMessages();
+
+  return (
+    <Form onSubmit={onConfirm} error={getErrorMessage(error)}>
+      <Box marginY="4">{message}</Box>
+      <FormButtons>
+        <Button onPress={onClose}>{formatMessage(labels.cancel)}</Button>
+        <FormSubmitButton
+          data-test="button-confirm"
+          isLoading={isLoading}
+          variant={buttonVariant}
+          isDisabled={false}
+        >
+          {buttonLabel || formatMessage(labels.ok)}
+        </FormSubmitButton>
+      </FormButtons>
+    </Form>
+  );
+}