fix: move slices to features

packages/app/src/features/auth/hook/useLogout.tsx

@@ -4,8 +4,7 @@ import TokenManager from '@lib/TokenManager'
 import { useDialog } from '@hooks'
 import { useToast } from '@features/toast'
 import { useDispatch } from 'react-redux'
-import { resetPage } from '@store/studentParamSlice'
-import { resetStudents } from '@store/studentListSlice'
+import { actions } from '@features/student/stores'
 import { useStudent } from '@features/student'
 import useLoggedIn from './useLoggedIn'
 
@@ -32,8 +31,8 @@ const useLogout = () => {
     TokenManager.clearToken()
 
     addToast('success', '로그아웃에 성공했습니다')
-    dispatch(resetPage())
-    dispatch(resetStudents())
+    dispatch(actions.resetPage())
+    dispatch(actions.resetStudents())
     refetchStudents({ page: 1, size: 20 })
     router.push('/')
     refetchLoggedIn()

packages/app/src/features/auth/hook/useWithdraw.tsx

@@ -4,8 +4,7 @@ import { useToast } from '@features/toast'
 import { useDialog } from '@hooks'
 import TokenManager from '@lib/TokenManager'
 import { useDispatch } from 'react-redux'
-import { resetPage } from '@store/studentParamSlice'
-import { resetStudents } from '@store/studentListSlice'
+import { actions } from '@features/student/stores'
 import { useStudent } from '@features/student'
 import useLoggedIn from './useLoggedIn'
 
@@ -31,8 +30,8 @@ const useWithdraw = () => {
 
     TokenManager.clearToken()
     addToast('success', '회원탈퇴에 성공했습니다')
-    dispatch(resetPage())
-    dispatch(resetStudents())
+    dispatch(actions.resetPage())
+    dispatch(actions.resetStudents())
     refetchStudents({ page: 1, size: 20 })
     router.push('/')
     refetchLoggedIn()

packages/app/src/features/dialog/molecules/DialogProvider.tsx

@@ -1,7 +1,7 @@
 import { Dialog } from '@sms/shared'
 import { useDispatch, useSelector } from 'react-redux'
 import { RootState } from '@store'
-import { setIsShow } from '@store/dialogSlice'
+import { actions } from '@features/dialog/stores'
 import Portal from '@features/dialog/atoms/Portal'
 
 const DialogProvider = () => {
@@ -12,7 +12,7 @@ const DialogProvider = () => {
 
   const onClose = () => {
     dialog.emitter.emit('dialog', false)
-    dispatch(setIsShow())
+    dispatch(actions.setIsShow())
   }
 
   return dialog.isShow ? (
@@ -23,7 +23,7 @@ const DialogProvider = () => {
         cancelText={dialog.cancelText || '취소'}
         confirmText={dialog.confirmText || '확인'}
         emitter={dialog.emitter}
-        onClose={() => dispatch(setIsShow())}
+        onClose={() => dispatch(actions.setIsShow())}
       />
     </Portal>
   ) : null

packages/app/src/features/dialog/stores/index.ts

@@ -0,0 +1,7 @@
+import * as dialogActions from './dialogSlice'
+
+export { default as dialogSlice } from './dialogSlice'
+
+export const actions = {
+  ...dialogActions,
+}

packages/app/src/features/modal/hooks/useModal.tsx

@@ -1,4 +1,4 @@
-import { close, show } from '@store/modalSlice'
+import { actions } from '@features/modal/stores'
 import { ReactElement } from 'react'
 import { useDispatch } from 'react-redux'
 import { useRouter } from 'next/router'
@@ -9,11 +9,11 @@ const useModal = () => {
 
   const onClose = () => {
     router.push('/', '/')
-    dispatch(close())
+    dispatch(actions.close())
   }
 
   const onShow = (element: ReactElement) => {
-    dispatch(show(element))
+    dispatch(actions.show(element))
   }
 
   return {

packages/app/src/features/modal/hooks/usePortal.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState, MouseEvent } from 'react'
 import { useRouter } from 'next/router'
 import { useDispatch } from 'react-redux'
-import { close } from '@store/modalSlice'
+import { actions } from '@features/modal/stores'
 
 const usePortal = () => {
   const router = useRouter()
@@ -36,7 +36,7 @@ const usePortal = () => {
 
   const onClose = () => {
     router.push('/', '/')
-    dispatch(close())
+    dispatch(actions.close())
   }
 
   return {

packages/app/src/features/modal/stores/index.ts

@@ -0,0 +1,7 @@
+import * as modalActions from './modalSlice'
+
+export const actions = {
+  ...modalActions,
+}
+
+export { default as modalSlice } from './modalSlice'

packages/app/src/features/modal/stores/modalSlice.ts

@@ -0,0 +1,29 @@
+import { PayloadAction, createSlice } from '@reduxjs/toolkit'
+import { ReactElement } from 'react'
+
+interface InitialState {
+  name: string | null
+  value: boolean
+
+  element: ReactElement | null
+  props?: object
+}
+
+const initialState: InitialState = { name: null, value: false, element: null }
+
+const modalSlice = createSlice({
+  name: 'modal',
+  initialState,
+  reducers: {
+    show: (state, { payload }: PayloadAction<ReactElement>) => {
+      state.element = payload
+    },
+    close: (state) => {
+      state.element = null
+    },
+  },
+})
+
+export const { close, show } = modalSlice.actions
+
+export default modalSlice

packages/app/src/features/student/hooks/useStudent.tsx

@@ -2,8 +2,7 @@ import errors from '@features/student/service/errors'
 import { useToast } from '@features/toast'
 import ErrorMapper from '@lib/ErrorMapper'
 import { RootState } from '@store'
-import { addStudents, setTotoalSize } from '@store/studentListSlice'
-import { nextStop, setIsError, setLoading } from '@store/studentParamSlice'
+import { actions } from '@features/student/stores'
 import { useDispatch, useSelector } from 'react-redux'
 import studentListApi from '@features/student/service/studentListApi'
 
@@ -26,19 +25,19 @@ const useStudent = () => {
   const refetchStudents = async (params: StudentsParams) => {
     if (studentParam.nextStop) return
 
-    dispatch(setLoading(true))
+    dispatch(actions.setLoading(true))
     const { data, isError, error } = await studentListApi({
       ...params,
     })
-    dispatch(setLoading(false))
+    dispatch(actions.setLoading(false))
 
     if (isError) {
-      dispatch(setIsError(isError))
+      dispatch(actions.setIsError(isError))
       return addToast('error', ErrorMapper(error, errors))
     }
-    dispatch(setTotoalSize(data.totalSize))
-    if (data?.content) dispatch(addStudents(data.content))
-    if (data.last) return dispatch(nextStop())
+    dispatch(actions.setTotoalSize(data.totalSize))
+    if (data?.content) dispatch(actions.addStudents(data.content))
+    if (data.last) return dispatch(actions.nextStop())
   }
 
   return {

packages/app/src/features/student/hooks/useStudentsFilter.tsx

@@ -2,8 +2,7 @@ import { useRouter } from 'next/router'
 import { useForm } from 'react-hook-form'
 import { useDispatch, useSelector } from 'react-redux'
 import { RootState } from '@store'
-import { resetPage, setParam } from '@store/studentParamSlice'
-import { resetStudents } from '@store/studentListSlice'
+import { actions } from '@features/student/stores'
 import ParamsFilter from '@lib/ParamsFilter'
 import { useModal } from '@features/modal/hooks'
 import useStudent from './useStudent'
@@ -35,9 +34,9 @@ const useStudentsFilter = () => {
     })
 
   const onSubmit = handleSubmit(async (form) => {
-    dispatch(resetPage())
-    dispatch(resetStudents())
-    dispatch(setParam(form))
+    dispatch(actions.resetPage())
+    dispatch(actions.resetStudents())
+    dispatch(actions.setParam(form))
     refetchStudents({ ...form, size: studentParam.size, page: 1 })
 
     await router.push('/', {

packages/app/src/features/student/hooks/useStudentsParam.tsx

@@ -1,5 +1,5 @@
 import { ParsedUrlQuery } from 'querystring'
-import { setParam } from '@store/studentParamSlice'
+import { actions } from '@features/student/stores'
 import { useEffect } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import {
@@ -40,7 +40,7 @@ const useStudentsParam = ({ query }: Props) => {
     } = query
 
     dispatch(
-      setParam({
+      actions.setParam({
         grade: toNumberArray(grade),
         majors: toStringArray(majors),
         classNum: toNumberArray(classNum),

packages/app/src/features/student/stores/index.ts

@@ -0,0 +1,10 @@
+export { default as studentListSlice } from './studentListSlice'
+export { default as studentParamSlice } from './studentParamSlice'
+
+import * as studentListActions from './studentListSlice'
+import * as studentParamActions from './studentParamSlice'
+
+export const actions = {
+  ...studentListActions,
+  ...studentParamActions,
+}

packages/app/src/features/toast/components/ToastContainer/index.tsx

@@ -1,6 +1,6 @@
 import { Toast } from '@sms/shared'
 import { RootState } from '@store'
-import { ToastType } from '@store/toastSlice'
+import { ToastType } from '@features/toast/stores/toastSlice'
 import { useSelector } from 'react-redux'
 
 import * as S from './style'

packages/app/src/features/toast/hooks/useToast.tsx

@@ -1,19 +1,19 @@
-import { addToast, hideToast, removeToast } from '@store/toastSlice'
+import { actions } from '@features/toast/stores'
 import { useDispatch } from 'react-redux'
 
 const useToast = () => {
   const dispatch = useDispatch()
 
   const createToast = (type: 'success' | 'error', comment: string) => {
     const id = Symbol('toast')
-    dispatch(addToast({ id, type, comment, milliseconds: 3000 }))
+    dispatch(actions.addToast({ id, type, comment, milliseconds: 3000 }))
 
     setTimeout(() => {
-      dispatch(hideToast(id))
+      dispatch(actions.hideToast(id))
     }, 3000)
 
     setTimeout(() => {
-      dispatch(removeToast(id))
+      dispatch(actions.removeToast(id))
     }, 3400)
   }
 

packages/app/src/features/toast/stores/index.ts

@@ -0,0 +1,7 @@
+export { default as toastSlice } from './toastSlice'
+
+import * as toastActions from './toastSlice'
+
+export const actions = {
+  ...toastActions,
+}

packages/app/src/hooks/useDialog.tsx

@@ -1,4 +1,4 @@
-import { setIsShow, setLogInfo } from '@store/dialogSlice'
+import { actions } from '@features/dialog/stores'
 import { useDispatch } from 'react-redux'
 import { Emitter } from '@sms/shared'
 import { SetLogInfoType } from '@/types/store/dialogSlice'
@@ -12,8 +12,8 @@ const useDialog = () => {
   const dialog = (dialogInfo: Omit<SetLogInfoType, 'emitter'>) =>
     new Promise((resolve) => {
       emitter.on(eventName, (result) => resolve(result))
-      dispatch(setLogInfo({ ...dialogInfo, emitter }))
-      dispatch(setIsShow())
+      dispatch(actions.setLogInfo({ ...dialogInfo, emitter }))
+      dispatch(actions.setIsShow())
     })
 
   return { dialog }

packages/app/src/store/index.ts

@@ -1,11 +1,10 @@
 import { rtkApi } from '@api'
 import { AnyAction, combineReducers, configureStore } from '@reduxjs/toolkit'
 import { HYDRATE, createWrapper } from 'next-redux-wrapper'
-import dialogSlice from './dialogSlice'
-import studentParamSlice from './studentParamSlice'
-import modalSlice from './modalSlice'
-import toastSlice from './toastSlice'
-import studentListSlice from './studentListSlice'
+import { dialogSlice } from '@features/dialog/stores'
+import { modalSlice } from '@features/modal/stores'
+import { studentListSlice, studentParamSlice } from '@features/student/stores'
+import { toastSlice } from '@features/toast/stores'
 
 const reducers = combineReducers({
   dialog: dialogSlice.reducer,