홈 즐겨찾기 변경

src/entities/common/model/types.ts

@@ -72,19 +72,14 @@ export interface HeaderNavigationProps {
   headerTitle?: string;
   headerLeft?: React.ReactNode;
   headerRight?: React.ReactNode;
-  menuOn: boolean;
   headerType: HeaderType;
-  setMenuOn: (menuOn: boolean) => void;
-  favoriteEdit?: boolean;
   loginSuccess: boolean;
   mid?: string;
   setMid: (mid: string) => void;
 };
 
 export interface FooterProps {
-  setMenuOn: (menuOn: boolean) => void;
   footerCurrentPage?: string | null;
-  setFavoriteEdit: (favoriteEdit: boolean) => void;
 };
 export enum FooterItemActiveKey {
   Home = 'Home',

src/entities/home/ui/favorite-wrapper.tsx

@@ -4,29 +4,26 @@ import { Swiper, SwiperSlide } from 'swiper/react';
 import 'swiper/css';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { UserFavorite } from '@/entities/user/model/types';
-import { useStore } from '@/shared/model/store';
+import { useFavoriteEditOnStore, useMenuOnStore, useStore } from '@/shared/model/store';
 import { useTranslation } from 'react-i18next';
 import { showAlert } from '@/widgets/show-alert';
 import { checkGrant } from '@/shared/lib/check-grant';
 
 export interface FavoriteWrapperProps {
   usingType: 'home' | 'menu',
-  editMode?: boolean,
-  setEditMode?: (editMode: boolean) => void;
   changeMenuId?: string;
-  setMenuOn?: (menuOn: boolean) => void;
 };
 
 export const FavoriteWrapper = ({
   usingType,
-  editMode,
-  setEditMode,
   changeMenuId,
-  setMenuOn
 }: FavoriteWrapperProps) => {
   const { navigate } = useNavigate();
   const { i18n, t } = useTranslation();
   
+  const { menuOn, setMenuOn } = useMenuOnStore();
+  const { favoriteEditOn, setFavoriteEditOn } = useFavoriteEditOnStore();
+  
   const [favoriteItems, setFavoriteItems] = useState<Array<UserFavorite>>([]);
   
   const itemAdd: UserFavorite = {
@@ -38,18 +35,15 @@ export const FavoriteWrapper = ({
   };
   
   const onClickToFavoriteEdit = () => {
-    if(setEditMode){
-      setEditMode(true);
-    }
+    setMenuOn(true);
+    setFavoriteEditOn(true);
   };
   
   const onClickToNavigate = (menuId?: number, path?: string) => {
     if(menuId && checkGrant(menuId, 'R')){
       if(!!path){
         navigate(path);
-        if(setMenuOn){
-          setMenuOn(false);
-        }
+        setMenuOn(false);
       }
     }
     else{
@@ -73,7 +67,7 @@ export const FavoriteWrapper = ({
         <SwiperSlide key={ `favorite-slide-key-${i}` }>
           <div
             className="swiper-item"
-            onClick={ () => !editMode && onClickToNavigate(favoriteItems[i]?.menuId, favoriteItems[i]?.programPath) }
+            onClick={ () => !favoriteEditOn && onClickToNavigate(favoriteItems[i]?.menuId, favoriteItems[i]?.programPath) }
           >
             <div className="swiper-icon coin-icon">
               <img
@@ -90,7 +84,7 @@ export const FavoriteWrapper = ({
   };
   const makeAddFavoriteItem = () => {
     let rs = [];
-    if(!editMode && usingType === 'menu'){
+    if(!favoriteEditOn){
       rs.push(
         <SwiperSlide key={ `favorite-item-add-slide-key` }>
           <div 
@@ -114,7 +108,7 @@ export const FavoriteWrapper = ({
 
   useEffect(() => {
     getFavoriteList();
-  }, [changeMenuId]);
+  }, [changeMenuId, favoriteEditOn]);
 
   return (
     <>

src/entities/menu/ui/menu-category.tsx

@@ -1,5 +1,5 @@
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
-import { useStore } from '@/shared/model/store';
+import { useFavoriteEditOnStore, useMenuOnStore, useStore } from '@/shared/model/store';
 import { UserFavorite } from '@/entities/user/model/types';
 import { RefObject, useEffect, useState } from 'react';
 import { MenuItem } from '../model/types';
@@ -13,8 +13,6 @@ export interface MenuCategoryProps {
   menuName?: string;
   iconFilePath?: string;
   subMenu?: Array<MenuItem>;
-  setMenuOn?: (menuOn: boolean) => void;
-  editMode?: boolean;
   changeMenuId?: string;
   setChangeMenuId: (menuIdChecked?: string) => void;
   buttonRefs: RefObject<Array<HTMLDivElement>>;
@@ -26,8 +24,6 @@ export const MenuCategory = ({
   iconFilePath,
   menuName,
   subMenu,
-  setMenuOn,
-  editMode,
   changeMenuId,
   setChangeMenuId,
   buttonRefs,
@@ -39,9 +35,12 @@ export const MenuCategory = ({
   const [favoriteItems, setFavoriteItems] = useState<Array<UserFavorite>>([]);
   const [menuIds, setMenuIds] = useState<Array<number | undefined>>([]);
   
+  const { menuOn, setMenuOn } = useMenuOnStore();
+  const { favoriteEditOn, setFavoriteEditOn } = useFavoriteEditOnStore();
+
   const onClickToNavigate = (menuId?: number, path?: string) => {
     if(menuId && checkGrant(menuId, 'R')){
-      if(!!path && !!setMenuOn && !editMode){
+      if(!!path && !favoriteEditOn){
         setMenuOn(false);
         navigate(path);
       }
@@ -125,7 +124,7 @@ export const MenuCategory = ({
           ? subMenu[i]?.menuNameEng
           : subMenu[i]?.menuName;
 
-        if(!!editMode && subMenu[i] && subMenu[i]?.menuId){
+        if(!!favoriteEditOn && subMenu[i] && subMenu[i]?.menuId){
           rs.push(
             <li
               key={ `menu-item-key-${menuId}-${i}` }