✨ (EventPassList.stories.tsx): streamline story by focusing on releva…

…nt interactions

♻️ (OffKeyInfo.stories.tsx): separate OffKeyInfoSkeleton import for clarity
🔥 (test-utils/functions): remove unused test-utils library to clean up project
✨ (.storybook/main.ts): enable SWC for Storybook to improve build performance
♻️ (Button.stories.tsx): replace delayData with sleep for consistency in utils usage

♻️ (button/examples.tsx): replace `delayData` with `sleep` for consistency
🔧 (tsconfig.base.json): remove `@test-utils/functions` path to clean up unused dependencies

libs/features/cart/src/lib/EventPassList/EventPassList.stories.tsx

@@ -54,13 +54,6 @@ export const Default: Story = {
 export const Opened: Story = {
   ...Default,
   play: async () => {
-    await userEvent.click(
-      await screen.findByRole('button', {
-        name: /Lorem ipsum/i,
-      }),
-    );
-    await screen.findByText(/6 x/i);
-    await screen.findByText(/General Admission/i);
     await userEvent.click(
       await screen.findByRole('button', {
         name: /World cup/i,

libs/features/unlock/shopify/src/lib/OffKeyInfo/OffKeyInfo.stories.tsx

@@ -1,7 +1,8 @@
 import { OffKeyState } from '@next/iframe';
 import { StoryObj, type Meta } from '@storybook/react';
 import React from 'react';
-import { OffKeyInfo, OffKeyInfoSkeleton } from './OffKeyInfo';
+import { OffKeyInfo } from './OffKeyInfo';
+import { OffKeyInfoSkeleton } from './OffKeyInfoSkeleton';
 
 const meta = {
   component: OffKeyInfo,

libs/ui/components/.storybook/main.ts

@@ -29,8 +29,19 @@ module.exports = {
   },
   framework: {
     name: '@storybook/react-webpack5',
-    options: {},
+    options: {
+      builder: { useSWC: true },
+    },
   },
+  swc: (config, options) => ({
+    jsc: {
+      transform: {
+        react: {
+          runtime: 'automatic',
+        },
+      },
+    },
+  }),
   docs: {
     autodocs: true,
   },

libs/ui/components/src/lib/button/Button.stories.tsx

@@ -6,7 +6,6 @@ import {
   waitForElementToBeRemoved,
   within,
 } from '@storybook/test';
-import { delayData } from '@test-utils/functions';
 import { Settings } from '@ui/icons';
 
 import { sleep } from '@utils';
@@ -54,7 +53,7 @@ type Story = StoryObj<typeof meta>;
 export const DefaultButton = {
   args: {
     children: 'Button with Click and Loading',
-    onClick: () => delayData(1000, null),
+    onClick: () => sleep(1000),
   },
   play: async ({ canvasElement, controls }) => {
     const canvas = within(canvasElement);

libs/ui/components/src/lib/button/examples.tsx

@@ -4,7 +4,7 @@ import {
   buttonSizes,
   type ButtonProps,
 } from './Button';
-import { delayData } from '@test-utils/functions';
+import { sleep } from '@utils';
 import { OutlineArrowRight } from '@ui/icons';
 
 export const variantOptions = Object.keys(buttonVariants);
@@ -65,7 +65,7 @@ export const AllbuttonVariantsLoadingComponent: React.FC<
         key={variant}
         size={size}
         variant={variant as keyof typeof buttonVariants}
-        onClick={() => delayData(3000, null)}
+        onClick={() => sleep(3000)}
         isLoading
       >
         {variant} Loading
@@ -83,7 +83,7 @@ export const AllbuttonSizesLoadingComponent: React.FC<
         key={size}
         size={size as keyof typeof buttonSizes}
         variant={variant}
-        onClick={() => delayData(3000, null)}
+        onClick={() => sleep(3000)}
         isLoading
       >
         {size} Loading

tsconfig.base.json

@@ -219,7 +219,6 @@
       "@smart-wallet/admin": ["libs/smart-wallet/admin/src/index.ts"],
       "@test-utils/cache": ["libs/test-utils/cache/src/index.ts"],
       "@test-utils/db": ["libs/test-utils/db/src/index.ts"],
-      "@test-utils/functions": ["libs/test-utils/functions/src/index.ts"],
       "@test-utils/gql": ["libs/test-utils/gql/src/index.ts"],
       "@test-utils/hasura": ["libs/test-utils/hasura/src/index.ts"],
       "@test-utils/next-intl": ["libs/test-utils/next-intl/src/index.tsx"],