feat: add admin image workflow

2026-09-08 22:13:47 -04:00
parent efeca42d0f
commit c382852924
3 changed files with 151 additions and 0 deletions
@@ -0,0 +1,27 @@
+import { expect, userEvent, within } from '@storybook/test';
+
+import AdminImageManager from './AdminImageManager.vue';
+
+const images = [
+  { id: 'image-1', label: 'FRONT', altText: 'Front of card', sortOrder: 0, isPrimary: true },
+  { id: 'image-2', label: 'BACK', altText: 'Back of card', sortOrder: 1, isPrimary: false },
+];
+
+export default { title: 'Organisms/AdminImageManager', component: AdminImageManager };
+
+export const Completed = { args: { images, processingStatus: 'COMPLETED' } };
+export const Processing = { args: { images, processingStatus: 'PROCESSING' } };
+export const Failed = { args: { images, processingStatus: 'FAILED', errorMessage: 'Derivative generation failed.' } };
+
+export const EditAltTextWithKeyboard = {
+  args: { images, processingStatus: 'COMPLETED' },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    await userEvent.click(canvas.getByRole('button', { name: 'Edit alt text' }));
+    const input = canvas.getByLabelText('Alt text');
+    await userEvent.clear(input);
+    await userEvent.type(input, 'Updated front image');
+    await userEvent.click(canvas.getByRole('button', { name: 'Save alt text' }));
+    await expect(canvas.getByDisplayValue('Updated front image')).toBeInTheDocument();
+  },
+};