From 537cfa0e500c7f40720cc7b06feaab6c8c7ab96f Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Tue, 1 Oct 2024 00:05:24 +0300
Subject: [PATCH 1/8] feat: add preventUserRemoving prop for menu item and  add
 callbacks for aside header

---
 .../AllPagesListItem/AllPagesListItem.tsx         |  2 +-
 src/components/AllPagesPanel/AllPagesPanel.tsx    | 15 ++++++++++++++-
 src/components/AsideHeader/types.tsx              |  3 +++
 src/components/types.ts                           |  1 +
 4 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx b/src/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx
index dfa6bcb..74fbcac 100644
--- a/src/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx
+++ b/src/components/AllPagesPanel/AllPagesListItem/AllPagesListItem.tsx
@@ -39,7 +39,7 @@ export const AllPagesListItem: React.FC<AllPagesListItemProps> = (props) => {
                 <Icon className={b('icon')} data={item.icon} size={item.iconSize} />
             ) : null}
             <span className={b('text')}>{item.title}</span>
-            {editMode && (
+            {editMode && !item.preventUserRemoving && (
                 <Button
                     onClick={onPinButtonClick}
                     view={item.hidden ? 'flat-secondary' : 'flat-action'}
diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index d533c1b..4be428e 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -24,7 +24,14 @@ interface AllPagesPanelProps {
 
 export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
     const {startEditIcon, onEditModeChanged, className} = props;
-    const {menuItems, onMenuItemsChanged} = useAsideHeaderInnerContext();
+    const {
+        menuItems,
+        onMenuItemsChanged,
+        onOpenEditMode,
+        onResetSettingsToDefault,
+        onToggleMenuItem,
+    } = useAsideHeaderInnerContext();
+
     const menuItemsRef = useRef(menuItems);
     menuItemsRef.current = menuItems;
 
@@ -37,6 +44,10 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
 
     useEffect(() => {
         onEditModeChanged?.(isEditMode);
+
+        if (isEditMode) {
+            onOpenEditMode?.();
+        }
     }, [isEditMode, onEditModeChanged]);
 
     const onItemClick = useCallback((item: ListItemData<MenuItem>) => {
@@ -54,6 +65,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
             const originItems = menuItemsRef.current.filter(
                 (menuItem) => menuItem.id !== ALL_PAGES_ID,
             );
+            onToggleMenuItem?.(changedItem);
             onMenuItemsChanged(
                 originItems.map((menuItem) => {
                     if (menuItem.id !== changedItem.id) {
@@ -81,6 +93,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         if (!onMenuItemsChanged) {
             return;
         }
+        onResetSettingsToDefault?.();
         const originItems = menuItemsRef.current.filter((item) => item.id !== ALL_PAGES_ID);
         onMenuItemsChanged(
             originItems.map((item) => ({
diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx
index fb1c5d0..4f21d39 100644
--- a/src/components/AsideHeader/types.tsx
+++ b/src/components/AsideHeader/types.tsx
@@ -37,6 +37,9 @@ export interface AsideHeaderGeneralProps extends QAProps {
     }) => React.ReactNode;
     onClosePanel?: () => void;
     onChangeCompact?: (compact: boolean) => void;
+    onOpenEditMode?: () => void;
+    onToggleMenuItem?: (changedItem: MenuItem) => void;
+    onResetSettingsToDefault?: () => void;
     openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;
 }
 
diff --git a/src/components/types.ts b/src/components/types.ts
index 6a333eb..32db26d 100644
--- a/src/components/types.ts
+++ b/src/components/types.ts
@@ -39,6 +39,7 @@ export interface MenuItem extends QAProps {
             ref: React.RefObject<HTMLElement>;
         },
     ) => React.ReactNode;
+    preventUserRemoving?: boolean;
     rightAdornment?: React.ReactNode;
     type?: MenuItemType;
     afterMoreButton?: boolean;

From a3eb58bacad334e55207732518637edbe1adb6da Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Tue, 1 Oct 2024 00:23:20 +0300
Subject: [PATCH 2/8] fix: update dependency arrays

---
 src/components/AllPagesPanel/AllPagesPanel.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index 4be428e..ba6294d 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -48,7 +48,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         if (isEditMode) {
             onOpenEditMode?.();
         }
-    }, [isEditMode, onEditModeChanged]);
+    }, [isEditMode, onEditModeChanged, onOpenEditMode]);
 
     const onItemClick = useCallback((item: ListItemData<MenuItem>) => {
         //@ts-ignore TODO fix when @gravity-ui/uikit/List will provide event arg on item click
@@ -75,7 +75,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
                 }),
             );
         },
-        [onMenuItemsChanged],
+        [onMenuItemsChanged, onToggleMenuItem],
     );
 
     const itemRender = useCallback(

From 0acfa258dd3ae679c9e32af3ea02de5d44c98b52 Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:48:27 +0300
Subject: [PATCH 3/8] fix: move edit menu callbask onto editMenuProps prop

---
 src/components/AllPagesPanel/AllPagesPanel.tsx | 18 ++++++------------
 src/components/AsideHeader/types.tsx           | 10 +++++++---
 2 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index ba6294d..10557c5 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -24,13 +24,7 @@ interface AllPagesPanelProps {
 
 export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
     const {startEditIcon, onEditModeChanged, className} = props;
-    const {
-        menuItems,
-        onMenuItemsChanged,
-        onOpenEditMode,
-        onResetSettingsToDefault,
-        onToggleMenuItem,
-    } = useAsideHeaderInnerContext();
+    const {menuItems, onMenuItemsChanged, editMenuProps} = useAsideHeaderInnerContext();
 
     const menuItemsRef = useRef(menuItems);
     menuItemsRef.current = menuItems;
@@ -46,9 +40,9 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         onEditModeChanged?.(isEditMode);
 
         if (isEditMode) {
-            onOpenEditMode?.();
+            editMenuProps.onOpenEditMode?.();
         }
-    }, [isEditMode, onEditModeChanged, onOpenEditMode]);
+    }, [isEditMode, onEditModeChanged, editMenuProps.onOpenEditMode]);
 
     const onItemClick = useCallback((item: ListItemData<MenuItem>) => {
         //@ts-ignore TODO fix when @gravity-ui/uikit/List will provide event arg on item click
@@ -65,7 +59,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
             const originItems = menuItemsRef.current.filter(
                 (menuItem) => menuItem.id !== ALL_PAGES_ID,
             );
-            onToggleMenuItem?.(changedItem);
+            editMenuProps.onToggleMenuItem?.(changedItem);
             onMenuItemsChanged(
                 originItems.map((menuItem) => {
                     if (menuItem.id !== changedItem.id) {
@@ -75,7 +69,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
                 }),
             );
         },
-        [onMenuItemsChanged, onToggleMenuItem],
+        [onMenuItemsChanged, editMenuProps.onToggleMenuItem],
     );
 
     const itemRender = useCallback(
@@ -93,7 +87,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         if (!onMenuItemsChanged) {
             return;
         }
-        onResetSettingsToDefault?.();
+        editMenuProps.onResetSettingsToDefault?.();
         const originItems = menuItemsRef.current.filter((item) => item.id !== ALL_PAGES_ID);
         onMenuItemsChanged(
             originItems.map((item) => ({
diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx
index 4f21d39..a3bbd9b 100644
--- a/src/components/AsideHeader/types.tsx
+++ b/src/components/AsideHeader/types.tsx
@@ -18,6 +18,12 @@ export interface LayoutProps {
     topAlert?: AsideHeaderTopAlertProps;
 }
 
+export interface EditMenuProps {
+    onOpenEditMode?: () => void;
+    onToggleMenuItem?: (changedItem: MenuItem) => void;
+    onResetSettingsToDefault?: () => void;
+}
+
 export interface AsideHeaderGeneralProps extends QAProps {
     logo?: LogoProps;
     multipleTooltip?: boolean;
@@ -35,11 +41,9 @@ export interface AsideHeaderGeneralProps extends QAProps {
         compact: boolean;
         asideRef: React.RefObject<HTMLDivElement>;
     }) => React.ReactNode;
+    editMenuProps: EditMenuProps;
     onClosePanel?: () => void;
     onChangeCompact?: (compact: boolean) => void;
-    onOpenEditMode?: () => void;
-    onToggleMenuItem?: (changedItem: MenuItem) => void;
-    onResetSettingsToDefault?: () => void;
     openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;
 }
 

From 4948547e8fc42ff49ffa93b9d9709f36aefed292 Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:50:16 +0300
Subject: [PATCH 4/8] fix: eslint

---
 src/components/AllPagesPanel/AllPagesPanel.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index 10557c5..1e2e807 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -42,7 +42,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         if (isEditMode) {
             editMenuProps.onOpenEditMode?.();
         }
-    }, [isEditMode, onEditModeChanged, editMenuProps.onOpenEditMode]);
+    }, [isEditMode, onEditModeChanged, editMenuProps]);
 
     const onItemClick = useCallback((item: ListItemData<MenuItem>) => {
         //@ts-ignore TODO fix when @gravity-ui/uikit/List will provide event arg on item click
@@ -69,7 +69,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
                 }),
             );
         },
-        [onMenuItemsChanged, editMenuProps.onToggleMenuItem],
+        [onMenuItemsChanged, editMenuProps],
     );
 
     const itemRender = useCallback(

From 39a2f4332840488e3ca838680914b32d9348118e Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:52:51 +0300
Subject: [PATCH 5/8] fix: eslint

---
 src/components/AllPagesPanel/AllPagesPanel.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index 1e2e807..18d5683 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -95,7 +95,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
                 hidden: false,
             })),
         );
-    }, [onMenuItemsChanged]);
+    }, [onMenuItemsChanged, editMenuProps]);
     return (
         <Flex className={b(null, className)} gap="5" direction="column">
             <Flex gap="4" alignItems="center" justifyContent="space-between">

From 0217000f17c8975215d0e3d196eaede9ac7805d7 Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:55:41 +0300
Subject: [PATCH 6/8] fix: types

---
 src/components/AsideHeader/types.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx
index a3bbd9b..4ebf865 100644
--- a/src/components/AsideHeader/types.tsx
+++ b/src/components/AsideHeader/types.tsx
@@ -41,7 +41,7 @@ export interface AsideHeaderGeneralProps extends QAProps {
         compact: boolean;
         asideRef: React.RefObject<HTMLDivElement>;
     }) => React.ReactNode;
-    editMenuProps: EditMenuProps;
+    editMenuProp?: EditMenuProps;
     onClosePanel?: () => void;
     onChangeCompact?: (compact: boolean) => void;
     openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;

From 56710c8e6cbb162cfc2286c4017018105fe15518 Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:57:03 +0300
Subject: [PATCH 7/8] fix: misstyping

---
 src/components/AsideHeader/types.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx
index 4ebf865..a9dbad1 100644
--- a/src/components/AsideHeader/types.tsx
+++ b/src/components/AsideHeader/types.tsx
@@ -41,7 +41,7 @@ export interface AsideHeaderGeneralProps extends QAProps {
         compact: boolean;
         asideRef: React.RefObject<HTMLDivElement>;
     }) => React.ReactNode;
-    editMenuProp?: EditMenuProps;
+    editMenuProps?: EditMenuProps;
     onClosePanel?: () => void;
     onChangeCompact?: (compact: boolean) => void;
     openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;

From 321a9a59b83951bcd624e821ec62507b1d0a10a3 Mon Sep 17 00:00:00 2001
From: Yauheni Mileika <mileikayauhen@yandex-team.ru>
Date: Fri, 4 Oct 2024 13:57:32 +0300
Subject: [PATCH 8/8] fix: optional chaining

---
 src/components/AllPagesPanel/AllPagesPanel.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/AllPagesPanel/AllPagesPanel.tsx b/src/components/AllPagesPanel/AllPagesPanel.tsx
index 18d5683..f62f53b 100644
--- a/src/components/AllPagesPanel/AllPagesPanel.tsx
+++ b/src/components/AllPagesPanel/AllPagesPanel.tsx
@@ -40,7 +40,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         onEditModeChanged?.(isEditMode);
 
         if (isEditMode) {
-            editMenuProps.onOpenEditMode?.();
+            editMenuProps?.onOpenEditMode?.();
         }
     }, [isEditMode, onEditModeChanged, editMenuProps]);
 
@@ -59,7 +59,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
             const originItems = menuItemsRef.current.filter(
                 (menuItem) => menuItem.id !== ALL_PAGES_ID,
             );
-            editMenuProps.onToggleMenuItem?.(changedItem);
+            editMenuProps?.onToggleMenuItem?.(changedItem);
             onMenuItemsChanged(
                 originItems.map((menuItem) => {
                     if (menuItem.id !== changedItem.id) {
@@ -87,7 +87,7 @@ export const AllPagesPanel: React.FC<AllPagesPanelProps> = (props) => {
         if (!onMenuItemsChanged) {
             return;
         }
-        editMenuProps.onResetSettingsToDefault?.();
+        editMenuProps?.onResetSettingsToDefault?.();
         const originItems = menuItemsRef.current.filter((item) => item.id !== ALL_PAGES_ID);
         onMenuItemsChanged(
             originItems.map((item) => ({