chore(storybook): add LockWalletConfirmDialog story

Author: theborakompanioni

src/components/ui/jam/LockWalletConfirmDialog.tsx

@@ -33,22 +33,20 @@ export const LockWalletConfirmDialog = ({
         <DialogHeader>
           <DialogTitle>{t('wallets.wallet_preview.modal_lock_wallet_title')}</DialogTitle>
         </DialogHeader>
-        <div className="flex flex-col gap-2">
-          {makerRunning && (
-            <Alert variant="warning">
-              <AlertTriangleIcon />
-              <AlertDescription>{t('wallets.wallet_preview.modal_lock_wallet_maker_running_text')}</AlertDescription>
-            </Alert>
-          )}
-          {coinjoinInProgress && (
-            <Alert variant="warning">
-              <AlertTriangleIcon />
-              <AlertDescription>
-                {t('wallets.wallet_preview.modal_lock_wallet_coinjoin_in_progress_text')}
-              </AlertDescription>
-            </Alert>
-          )}
-        </div>
+        {makerRunning && (
+          <Alert variant="warning">
+            <AlertTriangleIcon />
+            <AlertDescription>{t('wallets.wallet_preview.modal_lock_wallet_maker_running_text')}</AlertDescription>
+          </Alert>
+        )}
+        {coinjoinInProgress && (
+          <Alert variant="warning">
+            <AlertTriangleIcon />
+            <AlertDescription>
+              {t('wallets.wallet_preview.modal_lock_wallet_coinjoin_in_progress_text')}
+            </AlertDescription>
+          </Alert>
+        )}
         <p className="text-muted-foreground">{t('wallets.wallet_preview.modal_lock_wallet_alternative_action_text')}</p>
         <DialogFooter>
           <Button variant="outline" onClick={() => onOpenChange(false)} disabled={isLocking}>

src/stories/jam/dialogs/LockWalletConfirmDialog.stories.tsx

@@ -0,0 +1,58 @@
+import { useState } from 'react'
+import type { Meta, StoryObj } from '@storybook/react-vite'
+import { Button } from '@/components/ui/button'
+import { LockWalletConfirmDialog } from '@/components/ui/jam/LockWalletConfirmDialog'
+
+const meta: Meta<typeof LockWalletConfirmDialog> = {
+  title: 'Dialog/LockWalletConfirmDialog',
+  component: LockWalletConfirmDialog,
+  tags: ['autodocs'],
+  render: (args) => {
+    const [open, setOpen] = useState(false)
+    return (
+      <>
+        <Button onClick={() => setOpen(true)}>Open</Button>
+        <LockWalletConfirmDialog {...args} open={open} onOpenChange={() => setOpen(false)} />
+      </>
+    )
+  },
+}
+export default meta
+
+type Story = StoryObj<typeof LockWalletConfirmDialog>
+
+export const Default: Story = {
+  args: {
+    coinjoinInProgress: false,
+    makerRunning: false,
+    isLocking: false,
+    onConfirm: async () => alert('Confirm clicked!'),
+  },
+}
+
+export const MakerRunning: Story = {
+  args: {
+    coinjoinInProgress: false,
+    makerRunning: true,
+    isLocking: false,
+    onConfirm: async () => alert('Confirm clicked!'),
+  },
+}
+
+export const CoinjoinInProgress: Story = {
+  args: {
+    coinjoinInProgress: true,
+    makerRunning: false,
+    isLocking: false,
+    onConfirm: async () => alert('Confirm clicked!'),
+  },
+}
+
+export const Locking: Story = {
+  args: {
+    coinjoinInProgress: true,
+    makerRunning: false,
+    isLocking: true,
+    onConfirm: async () => alert('Confirm clicked!'),
+  },
+}