Finalize API key management for accounts

resources/scripts/components/elements/ConfirmationModal.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import Modal from '@/components/elements/Modal';
+
+interface Props {
+    title: string;
+    buttonText: string;
+    children: string;
+    visible: boolean;
+    onConfirmed: () => void;
+    onCanceled: () => void;
+}
+
+const ConfirmationModal = ({ title, children, visible, buttonText, onConfirmed, onCanceled }: Props) => (
+    <Modal
+        appear={true}
+        visible={visible}
+        onDismissed={() => onCanceled()}
+    >
+        <h3 className={'mb-6'}>{title}</h3>
+        <p className={'text-sm'}>{children}</p>
+        <div className={'flex items-center justify-end mt-8'}>
+            <button className={'btn btn-secondary btn-sm'} onClick={() => onCanceled()}>
+                Cancel
+            </button>
+            <button className={'btn btn-red btn-sm ml-4'} onClick={() => onConfirmed()}>
+                {buttonText}
+            </button>
+        </div>
+    </Modal>
+);
+
+export default ConfirmationModal;