From b6e904d7f7db483c1c558ce7beec9bc86b23ef54 Mon Sep 17 00:00:00 2001
From: Lee-Seungje <moondgod@gmail.com>
Date: Mon, 27 Nov 2023 00:08:40 +0900
Subject: [PATCH 1/3] Add useWidthStore

---
 packages/common/src/stores/index.ts         |  1 +
 packages/common/src/stores/useWidthStore.ts | 13 +++++++++++++
 2 files changed, 14 insertions(+)
 create mode 100644 packages/common/src/stores/index.ts
 create mode 100644 packages/common/src/stores/useWidthStore.ts

diff --git a/packages/common/src/stores/index.ts b/packages/common/src/stores/index.ts
new file mode 100644
index 0000000..c414d37
--- /dev/null
+++ b/packages/common/src/stores/index.ts
@@ -0,0 +1 @@
+export { default as useWidthState } from './useWidthStore';
diff --git a/packages/common/src/stores/useWidthStore.ts b/packages/common/src/stores/useWidthStore.ts
new file mode 100644
index 0000000..fa10f68
--- /dev/null
+++ b/packages/common/src/stores/useWidthStore.ts
@@ -0,0 +1,13 @@
+import { create } from 'zustand';
+
+interface WidthState {
+  width: number;
+  setWidth: (value: number) => void;
+}
+
+const useWidthState = create<WidthState>((set) => ({
+  width: 1920,
+  setWidth: (value) => set({ width: value }),
+}));
+
+export default useWidthState;

From 03372d8b59ca005ce540353203a2490ea85b1238 Mon Sep 17 00:00:00 2001
From: Lee-Seungje <moondgod@gmail.com>
Date: Mon, 27 Nov 2023 00:08:49 +0900
Subject: [PATCH 2/3] Add useWindowResizeEffect

---
 package.json                                  |  3 ++-
 packages/common/src/hooks/index.ts            |  0
 .../common/src/hooks/useWindowResizeEffect.ts | 22 ++++++++++++++++++
 pnpm-lock.yaml                                | 23 +++++++++++++++++++
 4 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 packages/common/src/hooks/index.ts
 create mode 100644 packages/common/src/hooks/useWindowResizeEffect.ts

diff --git a/package.json b/package.json
index 241ae4a..2ad7d7e 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,8 @@
     "@types/react": "^18.2.0",
     "next": "13.4.2",
     "react": "^18.2.0",
-    "react-toastify": "^9.1.3"
+    "react-toastify": "^9.1.3",
+    "zustand": "^4.4.6"
   },
   "keywords": [],
   "author": "",
diff --git a/packages/common/src/hooks/index.ts b/packages/common/src/hooks/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/packages/common/src/hooks/useWindowResizeEffect.ts b/packages/common/src/hooks/useWindowResizeEffect.ts
new file mode 100644
index 0000000..a8233a5
--- /dev/null
+++ b/packages/common/src/hooks/useWindowResizeEffect.ts
@@ -0,0 +1,22 @@
+import { useEffect } from 'react';
+
+import { useWidthState } from 'stores';
+
+const useWindowResizeEffect = () => {
+  const { setWidth } = useWidthState();
+
+  const handleResize = () => {
+    setWidth(window.innerWidth);
+  };
+
+  useEffect(() => {
+    handleResize();
+    window.addEventListener('resize', handleResize);
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};
+
+export default useWindowResizeEffect;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 26e33dd..76129d3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -38,6 +38,9 @@ importers:
       react-toastify:
         specifier: ^9.1.3
         version: 9.1.3(react-dom@18.2.0)(react@18.2.0)
+      zustand:
+        specifier: ^4.4.6
+        version: 4.4.6(@types/react@18.2.0)(react@18.2.0)
     devDependencies:
       '@types/gtag.js':
         specifier: ^0.0.17
@@ -10865,3 +10868,23 @@ packages:
 
   /zod@3.21.4:
     resolution: {integrity: sha512-m46AKbrzKVzOzs/DZgVnG5H55N1sv1M8qZU3A8RIKbs3mrACDNeIOeilDymVb2HdmP8uwshOCF4uJ8uM9rCqJw==}
+
+  /zustand@4.4.6(@types/react@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-Rb16eW55gqL4W2XZpJh0fnrATxYEG3Apl2gfHTyDSE965x/zxslTikpNch0JgNjJA9zK6gEFW8Fl6d1rTZaqgg==}
+    engines: {node: '>=12.7.0'}
+    peerDependencies:
+      '@types/react': '>=16.8'
+      immer: '>=9.0'
+      react: '>=16.8'
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      immer:
+        optional: true
+      react:
+        optional: true
+    dependencies:
+      '@types/react': 18.2.0
+      react: 18.2.0
+      use-sync-external-store: 1.2.0(react@18.2.0)
+    dev: false

From 499147b8c789e98ba7c953e1034f1a4021bb6a74 Mon Sep 17 00:00:00 2001
From: Lee-Seungje <moondgod@gmail.com>
Date: Mon, 27 Nov 2023 00:09:01 +0900
Subject: [PATCH 3/3] Update useless code

---
 packages/common/src/hooks/useWindowResizeEffect.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/common/src/hooks/useWindowResizeEffect.ts b/packages/common/src/hooks/useWindowResizeEffect.ts
index a8233a5..cec91d1 100644
--- a/packages/common/src/hooks/useWindowResizeEffect.ts
+++ b/packages/common/src/hooks/useWindowResizeEffect.ts
@@ -15,7 +15,6 @@ const useWindowResizeEffect = () => {
     return () => {
       window.removeEventListener('resize', handleResize);
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 };