From da0d4a56ca94a2a20d5729711a14cd1e68a568d8 Mon Sep 17 00:00:00 2001
From: sook <sukkyu.chung@gmail.com>
Date: Tue, 1 Aug 2023 20:34:16 +0900
Subject: [PATCH 1/2] add aliases that resolve react & react-dom to
 next/dist/compiled/

---
 code/frameworks/nextjs/src/config/webpack.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/code/frameworks/nextjs/src/config/webpack.ts b/code/frameworks/nextjs/src/config/webpack.ts
index a5f99fd51864..13c1a251cebe 100644
--- a/code/frameworks/nextjs/src/config/webpack.ts
+++ b/code/frameworks/nextjs/src/config/webpack.ts
@@ -17,6 +17,8 @@ export const configureConfig = async ({
   const nextConfig = await resolveNextConfig({ baseConfig, nextConfigPath, configDir });
 
   addScopedAlias(baseConfig, 'next/config');
+  addScopedAlias(baseConfig, 'react', 'next/dist/compiled/react');
+  addScopedAlias(baseConfig, 'react-dom', 'next/dist/compiled/react-dom');
   setupRuntimeConfig(baseConfig, nextConfig);
 
   return nextConfig;

From caf8e1be0f5beaec6a1a169376b7d1ff6153efc8 Mon Sep 17 00:00:00 2001
From: Valentin Palkovic <valentin@chromatic.com>
Date: Fri, 4 Aug 2023 17:29:37 +0200
Subject: [PATCH 2/2] Remove broken dangerouslySetInnerHTML property on
 mounting div in InlineStory

---
 code/ui/blocks/src/components/Story.tsx | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/code/ui/blocks/src/components/Story.tsx b/code/ui/blocks/src/components/Story.tsx
index 2718197456f1..089df560b2d8 100644
--- a/code/ui/blocks/src/components/Story.tsx
+++ b/code/ui/blocks/src/components/Story.tsx
@@ -64,9 +64,6 @@ const InlineStory: FunctionComponent<InlineStoryProps> = (props) => {
     };
   }, [autoplay, renderStoryToElement, story]);
 
-  // We do this so React doesn't complain when we replace the span in a secondary render
-  const htmlContents = `<span></span>`;
-
   if (error) {
     return (
       <pre>
@@ -83,13 +80,7 @@ const InlineStory: FunctionComponent<InlineStoryProps> = (props) => {
         )} { min-height: ${height}; transform: translateZ(0); overflow: auto }`}</style>
       ) : null}
       {showLoader && <StorySkeleton />}
-      <div
-        ref={storyRef}
-        id={`${storyBlockIdFromId(props)}-inner`}
-        data-name={story.name}
-        // eslint-disable-next-line react/no-danger
-        dangerouslySetInnerHTML={{ __html: htmlContents }}
-      />
+      <div ref={storyRef} id={`${storyBlockIdFromId(props)}-inner`} data-name={story.name} />
     </>
   );
 };