KL-176/refactor: separate navIndex setting into custom hook

src/hooks/useNavIndex.js

@@ -0,0 +1,14 @@
+import { useEffect } from 'react'
+import { navIndex } from '@constants/navIndex'
+import { useCurrentPageStore } from '@stores/navbarStores'
+
+const useNavIndex = (index) => {
+  const { currentPage, setCurrentPage } = useCurrentPageStore()
+
+  useEffect(() => {
+    if (currentPage !== navIndex[index]) setCurrentPage(navIndex[index])
+    return () => setCurrentPage(navIndex.NONE)
+  }, [])
+}
+
+export default useNavIndex

src/pages/FeedPage/FeedPage.jsx

@@ -1,9 +1,8 @@
 import React, { useEffect } from 'react'
 import { useLocation } from 'react-router-dom'
-import { navIndex } from '@constants/navIndex'
-import { useCurrentPageStore } from '@stores/navbarStores'
 import useFeedStore from '@stores/useFeedStore'
 import useInitializeState from '@hooks/useInitializeState'
+import useNavIndex from '@hooks/useNavIndex'
 import Thumbnail from './components/Thumbnail/Thumbnail'
 import BasicFilter from './components/BasicFilter/BasicFilter'
 import AdditionalFilter from './components/AdditionalFilter/AdditionalFilter'
@@ -13,16 +12,11 @@ import { FeedPageLayout, FeedPageContent, FeedArea } from './FeedPage.style'
 
 function FeedPage() {
   useInitializeState()
+  useNavIndex('FEED')
 
   const location = useLocation()
-  const { currentPage, setCurrentPage } = useCurrentPageStore()
   const resetSelectedField = useFeedStore((state) => state.resetSelectedField)
 
-  useEffect(() => {
-    if (currentPage !== navIndex.FEED) setCurrentPage(navIndex.FEED)
-    return () => setCurrentPage(navIndex.NONE)
-  }, [])
-
   useEffect(() => {
     const deleteDataState = (state) => {
       if (!state?.usr) return state