feat(Simulator/screens/GeneratingKeys): create stories

src/components/Simulator/screens/CreateAccount/GeneratingKeys.tsx

@@ -56,6 +56,7 @@ export const GeneratingKeys = ({
             initial={{ opacity: 0 }}
             animate={{ opacity: 1 }}
             transition={{ duration: 0.5 }}
+            data-testid="loading-spinner"
           >
             <Spinner w={SPINNER_SIZE} h={SPINNER_SIZE} />
           </motion.div>
@@ -90,6 +91,7 @@ export const GeneratingKeys = ({
             <ProgressCta
               className="inset-x-0"
               progressStepper={progressStepper}
+              data-testid="generating-keys-cta"
             >
               {ctaLabel}
             </ProgressCta>

src/components/Simulator/screens/CreateAccount/__stories__/GeneratingKeys.stories.tsx

@@ -0,0 +1,60 @@
+import type { Meta, StoryObj } from "@storybook/react/*"
+import {
+  expect,
+  fn,
+  waitFor,
+  waitForElementToBeRemoved,
+  within,
+} from "@storybook/test"
+
+import { BUTTON_DELAY_DURATION } from "../constants"
+import { GeneratingKeys } from "../GeneratingKeys"
+
+const meta = {
+  title:
+    "Molecules / Display Content / Simulator / CreateAccount Screen / GeneratingKeys",
+  component: GeneratingKeys,
+  args: {
+    ctaLabel: "Next",
+    nav: {
+      openPath: fn(),
+      progressStepper: fn(),
+      regressStepper: fn(),
+      step: 0,
+      totalSteps: 2,
+    },
+    generateNewWords: fn(),
+  },
+  decorators: [
+    (Story) => (
+      <div className="relative h-[590px] w-[312px]">
+        <Story />
+      </div>
+    ),
+  ],
+} satisfies Meta<typeof GeneratingKeys>
+
+export default meta
+
+type Story = StoryObj<typeof meta>
+
+export const Loading: Story = {}
+
+export const LoadingDoneCheck: Story = {
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement)
+
+    await waitForElementToBeRemoved(canvas.getByTestId("loading-spinner"), {
+      timeout: BUTTON_DELAY_DURATION + 1000,
+    })
+
+    await waitFor(
+      () => {
+        expect(canvas.getByTestId("generating-keys-cta")).toBeInTheDocument()
+      },
+      {
+        timeout: 1500,
+      }
+    )
+  },
+}