From 9c410d1ee7762c773da7501792b12eb3bca7c5d9 Mon Sep 17 00:00:00 2001
From: dongkyun-dev <thd6576@naver.com>
Date: Thu, 4 Jan 2024 01:01:16 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20store=20=ED=98=95=ED=83=9C=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Modal/Modal.tsx          |  4 ++--
 src/components/Modal/ModalContainer.tsx |  4 ++--
 src/components/Toast/Toast.stories.tsx  |  6 +++---
 src/components/Toast/Toast.tsx          |  4 ++--
 src/stores/modalStore.ts                | 10 +++-------
 src/stores/toastStore.ts                | 10 +++-------
 6 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx
index 5c4e34be..8a9180bd 100644
--- a/src/components/Modal/Modal.tsx
+++ b/src/components/Modal/Modal.tsx
@@ -1,9 +1,9 @@
-import { useModal } from '@/src/stores/modalStore';
+import { useModalStore } from '@/src/stores/modalStore';
 
 import DeleteArticle from './components/DeleteArticle';
 
 const Modal = () => {
-  const { type } = useModal();
+  const { type } = useModalStore();
 
   if (type === 'deleteArticle') return <DeleteArticle />;
 
diff --git a/src/components/Modal/ModalContainer.tsx b/src/components/Modal/ModalContainer.tsx
index 04e2569f..3d1b3fcf 100644
--- a/src/components/Modal/ModalContainer.tsx
+++ b/src/components/Modal/ModalContainer.tsx
@@ -1,7 +1,7 @@
 import type { PropsWithChildren } from 'react';
 import { assignInlineVars } from '@vanilla-extract/dynamic';
 
-import { useModal } from '@/src/stores/modalStore';
+import { useModalStore } from '@/src/stores/modalStore';
 import { COLORS } from '@/src/styles/tokens';
 
 import * as styles from './style.css';
@@ -25,7 +25,7 @@ const ModalContainer = ({
   firstButtonProps,
   secondButtonProps,
 }: PropsWithChildren<ModalContainerProps>) => {
-  const { closeModal } = useModal();
+  const { closeModal } = useModalStore();
 
   const {
     text: firstButtonText = '취소',
diff --git a/src/components/Toast/Toast.stories.tsx b/src/components/Toast/Toast.stories.tsx
index 908e589f..7a93fc3e 100644
--- a/src/components/Toast/Toast.stories.tsx
+++ b/src/components/Toast/Toast.stories.tsx
@@ -2,7 +2,7 @@ import { useEffect } from 'react';
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { TOAST_DURATION_TIME } from '@/src/models/toastModel';
-import { useToast } from '@/src/stores/toastStore';
+import { useToastStore } from '@/src/stores/toastStore';
 
 import Toast from './Toast';
 
@@ -23,7 +23,7 @@ type Story = StoryObj<typeof Toast>;
 
 export const Basic: Story = {
   render: function Render() {
-    const { showToast } = useToast();
+    const { showToast } = useToastStore();
 
     useEffect(() => {
       showToast({ message: '테스트', type: TOAST_DURATION_TIME.SHOW });
@@ -42,7 +42,7 @@ export const Basic: Story = {
 
 export const WithAction: Story = {
   render: function Render() {
-    const { showToast } = useToast();
+    const { showToast } = useToastStore();
 
     useEffect(() => {
       showToast({ message: '테스트', type: TOAST_DURATION_TIME.ACTION });
diff --git a/src/components/Toast/Toast.tsx b/src/components/Toast/Toast.tsx
index 4f481ce1..0b8d76fa 100644
--- a/src/components/Toast/Toast.tsx
+++ b/src/components/Toast/Toast.tsx
@@ -1,11 +1,11 @@
 import { useEffect } from 'react';
 
-import { useToast } from '@/src/stores/toastStore';
+import { useToastStore } from '@/src/stores/toastStore';
 
 import * as styles from './style.css';
 
 const Toast = () => {
-  const { toastData, hideToast } = useToast();
+  const { toastData, hideToast } = useToastStore();
 
   const { message, type, isToastVisible } = toastData;
 
diff --git a/src/stores/modalStore.ts b/src/stores/modalStore.ts
index 62afea43..534e64f8 100644
--- a/src/stores/modalStore.ts
+++ b/src/stores/modalStore.ts
@@ -19,13 +19,9 @@ export const modalStore = createStore<State & Action>((set) => ({
   closeModal: () => set({ type: 'no' }),
 }));
 
-const useModalStore = <T>(
-  selector: (state: State & Action) => T,
-  equals?: (a: T, b: T) => boolean,
-) => useStore(modalStore, selector, equals);
-
-export const useModal = () =>
-  useModalStore(
+export const useModalStore = () =>
+  useStore(
+    modalStore,
     (state) => ({
       type: state.type,
       openModal: state.openModal,
diff --git a/src/stores/toastStore.ts b/src/stores/toastStore.ts
index 9291ccb4..f20f0927 100644
--- a/src/stores/toastStore.ts
+++ b/src/stores/toastStore.ts
@@ -39,13 +39,9 @@ export const toastStore = createStore<State & Action>((set, get) => ({
   },
 }));
 
-const useToastStore = <T>(
-  selector: (state: State & Action) => T,
-  equals?: (a: T, b: T) => boolean,
-) => useStore(toastStore, selector, equals);
-
-export const useToast = () =>
-  useToastStore(
+export const useToastStore = () =>
+  useStore(
+    toastStore,
     (state) => ({
       toastData: state.toastData,
       showToast: state.showToast,