diff --git a/src/App.tsx b/src/App.tsx
index 636ebcc53627..34193879efbd 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,6 +1,5 @@
 import React, { useCallback, useEffect, useState } from "react";
 import { ThemeProvider, ensure, themes } from "@storybook/theming";
-import { STORY_CHANGED } from "@storybook/core-events";
 import { addons, type API } from "@storybook/manager-api";
 
 import { GuidedTour } from "./features/GuidedTour/GuidedTour";
@@ -72,34 +71,37 @@ export default function App({ api }: { api: API }) {
           }}
         />
       )}
-      <WelcomeModal
-        onProceed={() => setStep("2:StorybookTour")}
-        isOpen={enabled && step === "1:Welcome"}
-        skipOnboarding={skipOnboarding}
-      />
-      {enabled && (step === "2:StorybookTour" || step === "5:ConfigureYourProject") && (
-        <GuidedTour
+      {enabled && step === "1:Welcome" && (
+        <WelcomeModal
+          onProceed={() => setStep("2:StorybookTour")}
+          skipOnboarding={skipOnboarding}
+        />
+      )}
+      {enabled &&
+        (step === "2:StorybookTour" || step === "5:ConfigureYourProject") && (
+          <GuidedTour
+            api={api}
+            isFinalStep={step === "5:ConfigureYourProject"}
+            onFirstTourDone={() => {
+              setStep("3:WriteYourStory");
+            }}
+            onLastTourDone={() => {
+              api.selectStory("configure-your-project--docs");
+              skipOnboarding();
+            }}
+          />
+        )}
+      {enabled && step === "3:WriteYourStory" && (
+        <WriteStoriesModal
           api={api}
-          isFinalStep={step === "5:ConfigureYourProject"}
-          onFirstTourDone={() => {
-            setStep("3:WriteYourStory");
-          }}
-          onLastTourDone={() => {
-            api.selectStory("configure-your-project--docs");
-            skipOnboarding();
+          addonsStore={addons}
+          onFinish={() => {
+            api.selectStory("example-button--warning");
+            setStep("4:VisitNewStory");
           }}
+          skipOnboarding={skipOnboarding}
         />
       )}
-      <WriteStoriesModal
-        api={api}
-        addonsStore={addons}
-        onFinish={() => {
-          api.selectStory("example-button--warning");
-          setStep("4:VisitNewStory");
-        }}
-        isOpen={enabled && step === "3:WriteYourStory"}
-        skipOnboarding={skipOnboarding}
-      />
     </ThemeProvider>
   );
 }
diff --git a/src/features/WriteStoriesModal/WriteStoriesModal.stories.tsx b/src/features/WriteStoriesModal/WriteStoriesModal.stories.tsx
index 1aa9896f5805..cb10e43bca56 100644
--- a/src/features/WriteStoriesModal/WriteStoriesModal.stories.tsx
+++ b/src/features/WriteStoriesModal/WriteStoriesModal.stories.tsx
@@ -9,7 +9,7 @@ import {
   STORY_RENDERED,
 } from "@storybook/core-events";
 
-const getData = jest.fn()
+const getData = jest.fn();
 
 const meta: Meta<typeof WriteStoriesModal> = {
   component: WriteStoriesModal,
@@ -33,7 +33,7 @@ const meta: Meta<typeof WriteStoriesModal> = {
             storyIndexInvalidatedCb = cb;
           }
         },
-        off: () => { },
+        off: () => {},
       }),
     } as any,
   },
@@ -43,10 +43,10 @@ const meta: Meta<typeof WriteStoriesModal> = {
         // do not respond to the first call, this would only return the data correctly if the story already exists
         // which is not the case in this story, it only makes sense in the real scenario
         .mockReturnValueOnce(null)
-        .mockReturnValueOnce({ some: "data" })
+        .mockReturnValueOnce({ some: "data" });
       return (
         <div style={{ width: "1200px", height: "800px" }}>{storyFn()}</div>
-      )
+      );
     },
   ],
 };
@@ -57,11 +57,7 @@ type Story = StoryObj<typeof meta>;
 
 let storyIndexInvalidatedCb: () => void;
 
-export const Default: Story = {
-  args: {
-    isOpen: true,
-  },
-};
+export const Default: Story = {};
 
 export const DefaultPlayed: Story = {
   args: {