From c6cb88edb8375e49cd89782f447e0a8f677c58fe Mon Sep 17 00:00:00 2001
From: David Murdoch <187813+davidmurdoch@users.noreply.github.com>
Date: Thu, 15 Feb 2024 15:09:53 -0500
Subject: [PATCH] test: optimize memory usage when building storybook by using
 swc (#22975)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Building storybook in CI seems to fail often -- probably due to running out of memory. Changing the compiler to swc might help (according to https://github.com/storybookjs/storybook/issues/6408#issuecomment-1655220274).

I don't know what the ramifications of this change may be (I don't even know what storybook is for 😅). So someone with knowledge here should review this PR.

---------

Co-authored-by: Howard Braham <howrad@gmail.com>
---
 .storybook/main.js                    | 6 +++++-
 ui/components/ui/icon/README.mdx      | 8 --------
 ui/components/ui/icon/icon.stories.js | 2 +-
 ui/components/ui/logo/logo.stories.js | 2 +-
 4 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/.storybook/main.js b/.storybook/main.js
index b2060367f6e7..db8c7e0dd540 100644
--- a/.storybook/main.js
+++ b/.storybook/main.js
@@ -104,6 +104,10 @@ module.exports = {
   },
   framework: {
     name: '@storybook/react-webpack5',
-    options: {},
+    options: {
+      builder: {
+        useSWC: true,
+      },
+    },
   },
 };
diff --git a/ui/components/ui/icon/README.mdx b/ui/components/ui/icon/README.mdx
index b9c654992e2f..3f3592549786 100644
--- a/ui/components/ui/icon/README.mdx
+++ b/ui/components/ui/icon/README.mdx
@@ -146,14 +146,6 @@ Use the `className` prop to add an additional class to the icon. This additional
 
 <ArgsTable of={SunCheck} />
 
-## Send/SwapIcon
-
-<Canvas>
-  <Story id="components-ui-icon--send-swap-icon-story" />
-</Canvas>
-
-<ArgsTable of={SwapIconComponent} />
-
 ## Preloader
 
 <Canvas>
diff --git a/ui/components/ui/icon/icon.stories.js b/ui/components/ui/icon/icon.stories.js
index e4c9e573bab9..9a18f70b35d7 100644
--- a/ui/components/ui/icon/icon.stories.js
+++ b/ui/components/ui/icon/icon.stories.js
@@ -75,7 +75,7 @@ const IconItem = ({ Component }) => {
       backgroundColor={BackgroundColor.backgroundDefault}
     >
       <Box marginBottom={2}>{Component}</Box>
-      <code>{`${Component.type.__docgenInfo.displayName}`}</code>
+      <code>{`${Component.type.name}`}</code>
     </Card>
   );
 };
diff --git a/ui/components/ui/logo/logo.stories.js b/ui/components/ui/logo/logo.stories.js
index dc0accc8e050..01a9be0b10a1 100644
--- a/ui/components/ui/logo/logo.stories.js
+++ b/ui/components/ui/logo/logo.stories.js
@@ -45,7 +45,7 @@ const LogoItem = ({ Component }) => {
       backgroundColor={BackgroundColor.backgroundDefault}
     >
       <Box marginBottom={2}>{Component}</Box>
-      <Text>{`${Component.type.__docgenInfo.displayName}`}</Text>
+      <Text>{`${Component.type.name}`}</Text>
     </Card>
   );
 };