From 0d454c19738d4969a645f2e2775cc25f0385234c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 8 Jan 2026 15:28:01 +0000
Subject: [PATCH] Final code review improvements - consolidate imports and
 improve documentation

Co-authored-by: johndoe6345789 <224850594+johndoe6345789@users.noreply.github.com>
---
 src/components/admin/CreateTableDialog.tsx |  5 ++++-
 src/components/admin/DataGrid.tsx          |  2 +-
 src/components/admin/DropTableDialog.tsx   |  3 ++-
 src/utils/storybook/storyGenerator.ts      | 17 +++++++++++++++--
 tests/utils/playbookRunner.ts              | 17 +++++++++--------
 5 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/src/components/admin/CreateTableDialog.tsx b/src/components/admin/CreateTableDialog.tsx
index f8d59cc..3ea0be2 100644
--- a/src/components/admin/CreateTableDialog.tsx
+++ b/src/components/admin/CreateTableDialog.tsx
@@ -11,8 +11,11 @@ import {
   Checkbox,
   MenuItem,
   Select,
+  Button,
+  TextField,
+  Typography,
+  IconButton,
 } from '../atoms';
-import { Button, TextField, Typography, IconButton } from '../atoms';
 
 type Column = {
   name: string;
diff --git a/src/components/admin/DataGrid.tsx b/src/components/admin/DataGrid.tsx
index f0b7a87..0894029 100644
--- a/src/components/admin/DataGrid.tsx
+++ b/src/components/admin/DataGrid.tsx
@@ -9,8 +9,8 @@ import {
   TableHead,
   TableRow,
   Tooltip,
+  IconButton,
 } from '../atoms';
-import { IconButton } from '../atoms';
 
 type DataGridProps = {
   columns: Array<{ name: string; label?: string }>;
diff --git a/src/components/admin/DropTableDialog.tsx b/src/components/admin/DropTableDialog.tsx
index fd84007..229fc6e 100644
--- a/src/components/admin/DropTableDialog.tsx
+++ b/src/components/admin/DropTableDialog.tsx
@@ -8,8 +8,9 @@ import {
   DialogTitle,
   MenuItem,
   Select,
+  Button,
+  Typography,
 } from '../atoms';
-import { Button, Typography } from '../atoms';
 
 type DropTableDialogProps = {
   open: boolean;
diff --git a/src/utils/storybook/storyGenerator.ts b/src/utils/storybook/storyGenerator.ts
index 2054d6d..9327365 100644
--- a/src/utils/storybook/storyGenerator.ts
+++ b/src/utils/storybook/storyGenerator.ts
@@ -26,6 +26,21 @@ export function generateMeta<T>(
 
 /**
  * Generate a single story from features.json story definition
+ * 
+ * Note: Play functions cannot be stored directly in JSON due to serialization limitations.
+ * For interactive stories that need play functions:
+ * 1. Define the story structure in features.json (args, parameters)
+ * 2. Add play functions manually in the .stories.tsx file after generation
+ * 
+ * Example:
+ * ```typescript
+ * export const Interactive: Story = {
+ *   ...generateStory(storyConfig),
+ *   play: async ({ canvasElement }) => {
+ *     // Your play function here
+ *   }
+ * };
+ * ```
  */
 export function generateStory<T>(
   storyConfig: StorybookStory
@@ -34,8 +49,6 @@ export function generateStory<T>(
     name: storyConfig.name,
     args: storyConfig.args || {},
     parameters: storyConfig.parameters,
-    // Note: play functions would need to be converted from strings to actual functions
-    // This is a limitation of JSON - we can only store the play steps as strings
   };
 }
 
diff --git a/tests/utils/playbookRunner.ts b/tests/utils/playbookRunner.ts
index 82d759c..5a81f27 100644
--- a/tests/utils/playbookRunner.ts
+++ b/tests/utils/playbookRunner.ts
@@ -55,13 +55,10 @@ export async function executeStep(page: Page, step: PlaywrightStep, variables: R
       } else if (text && selector) {
         await expect(page.locator(selector)).toContainText(text);
       } else if (text) {
-        // Check for status code in text
-        const statusCode = parseInt(text, 10);
-        if (!isNaN(statusCode)) {
-          // This is a status code check - would need API interception
-          // For now, we skip this as it requires special handling
-          console.warn(`Status code check (${statusCode}) not yet implemented in playbook runner`);
-        }
+        // Note: Status code checks require special handling in Playwright
+        // They are not directly supported in playbooks and should be handled
+        // with API route interception in custom tests
+        console.warn('Status code checks should be implemented in custom test files, not playbooks');
       }
       break;
 
@@ -72,7 +69,11 @@ export async function executeStep(page: Page, step: PlaywrightStep, variables: R
       const uniqueId = `${timestamp}-${random}`;
       
       if (selector) {
-        const safeSelector = selector.replace(/[^a-z0-9]/gi, '_');
+        // Sanitize selector for use in filename
+        const safeSelector = selector
+          .replace(/[^a-z0-9]/gi, '_')  // Replace non-alphanumeric with underscore
+          .replace(/_+/g, '_')            // Replace multiple underscores with single
+          .replace(/^_|_$/g, '');         // Remove leading/trailing underscores
         await page.locator(selector).screenshot({ 
           path: `screenshots/${uniqueId}-${safeSelector}.png` 
         });