feat(preferences): 2FA activation dialog with mocked state (#605)

app/assets/javascripts/components/Button.tsx

@@ -0,0 +1,28 @@
+import { FunctionComponent } from 'preact';
+
+const baseClass = `rounded px-4 py-1.75 font-bold text-sm fit-content cursor-pointer`;
+
+const normalClass = `${baseClass} bg-default color-text border-solid border-gray-300 border-1 \
+focus:bg-contrast hover:bg-contrast`;
+const primaryClass = `${baseClass} no-border bg-info color-info-contrast hover:brightness-130 \
+focus:brightness-130`;
+
+export const Button: FunctionComponent<{
+  className?: string;
+  type: 'normal' | 'primary';
+  label: string;
+  onClick: () => void;
+}> = ({ type, label, className = '', onClick }) => {
+  const buttonClass = type === 'primary' ? primaryClass : normalClass;
+  return (
+    <button
+      className={`${buttonClass} ${className}`}
+      onClick={(e) => {
+        onClick();
+        e.preventDefault();
+      }}
+    >
+      {label}
+    </button>
+  );
+};