From f4dcd4bafafc03edf45459de2bf798fe6084f744 Mon Sep 17 00:00:00 2001
From: Sor4chi <80559385+sor4chi@users.noreply.github.com>
Date: Sun, 14 Apr 2024 17:16:09 +0900
Subject: [PATCH] =?UTF-8?q?fix(perf):=20logo=20svg=E3=82=92=E5=A4=96?=
 =?UTF-8?q?=E9=83=A8=E5=8F=82=E7=85=A7=E6=96=B9=E5=BC=8F=E3=81=AB=E5=A4=89?=
 =?UTF-8?q?=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/components/.storybook/main.ts              | 1 +
 packages/components/{src/header => public}/logo.svg | 0
 packages/components/src/header/Header.stories.tsx   | 8 ++++----
 packages/components/src/header/Header.tsx           | 5 +++--
 4 files changed, 8 insertions(+), 6 deletions(-)
 rename packages/components/{src/header => public}/logo.svg (100%)

diff --git a/packages/components/.storybook/main.ts b/packages/components/.storybook/main.ts
index 383287d..ef8eaa0 100644
--- a/packages/components/.storybook/main.ts
+++ b/packages/components/.storybook/main.ts
@@ -14,6 +14,7 @@ const config = {
   docs: {
     autodocs: 'tag',
   },
+  staticDirs: ['../public'],
   core: {
     builder: '@storybook/builder-vite',
   },
diff --git a/packages/components/src/header/logo.svg b/packages/components/public/logo.svg
similarity index 100%
rename from packages/components/src/header/logo.svg
rename to packages/components/public/logo.svg
diff --git a/packages/components/src/header/Header.stories.tsx b/packages/components/src/header/Header.stories.tsx
index 789c473..3f6415a 100644
--- a/packages/components/src/header/Header.stories.tsx
+++ b/packages/components/src/header/Header.stories.tsx
@@ -59,19 +59,19 @@ const NAVIGATIONS = [
 
 export const Light = () => (
   <Container theme="light">
-    <Header navigations={NAVIGATIONS} />
+    <Header navigations={NAVIGATIONS} iconSrc="/logo.svg" />
   </Container>
 );
 
 export const Dark = () => (
   <Container theme="dark">
-    <Header navigations={NAVIGATIONS} />
+    <Header navigations={NAVIGATIONS} iconSrc="/logo.svg" />
   </Container>
 );
 
 export const DropdownOpenLight = () => (
   <Container theme="light">
-    <Header navigations={NAVIGATIONS} dropdownOpen>
+    <Header navigations={NAVIGATIONS} iconSrc="/logo.svg" dropdownOpen>
       <Button leftIcon={<User />} variant="tertiary" />
       <Button leftIcon={<Menu />} variant="tertiary" />
     </Header>
@@ -80,7 +80,7 @@ export const DropdownOpenLight = () => (
 
 export const DropdownOpenDark = () => (
   <Container theme="dark">
-    <Header navigations={NAVIGATIONS} dropdownOpen>
+    <Header navigations={NAVIGATIONS} iconSrc="/logo.svg" dropdownOpen>
       <Button leftIcon={<User />} variant="tertiary" />
       <Button leftIcon={<Menu />} variant="tertiary" />
     </Header>
diff --git a/packages/components/src/header/Header.tsx b/packages/components/src/header/Header.tsx
index 345dbb3..5a9c32a 100644
--- a/packages/components/src/header/Header.tsx
+++ b/packages/components/src/header/Header.tsx
@@ -4,7 +4,6 @@ import { ArrowUpRight, X } from 'react-feather';
 import { Button } from '../button';
 
 import styles from './Header.module.scss';
-import logo from './logo.svg';
 
 type NavigationItem = {
   name: string;
@@ -31,6 +30,7 @@ export interface HeaderProps {
   navigations: NavigationItem[];
   children?: React.ReactNode;
   link?: LinkComponent;
+  iconSrc: string;
   dropdownOpen?: boolean;
   dropdownChildren?: React.ReactNode;
   onDropdownClose?: () => void;
@@ -40,6 +40,7 @@ export const Header = ({
   navigations,
   children,
   link,
+  iconSrc,
   dropdownOpen,
   dropdownChildren,
   onDropdownClose,
@@ -54,7 +55,7 @@ export const Header = ({
         <div className={styles.headerInner}>
           <nav className={styles.nav}>
             <Link to="/" href="/" className={styles.logoLink}>
-              <img className={styles.logo} src={logo} alt="Maximum Logo" />
+              <img className={styles.logo} src={iconSrc} alt="Maximum Logo" />
             </Link>
             <ul className={styles.navList}>
               {navigations.map((nav) => (