6364 update settings after menu changes (#6372)

* update redux from recoil

* remove old navlinks actions

* e2e for menu updates

app/react/V2/Routes/Settings/MenuConfig/MenuConfig.tsx

@@ -14,7 +14,7 @@ import { ConfirmNavigationModal } from 'app/V2/Components/Forms';
 
 import { ClientSettingsLinkSchema } from 'app/apiResponseTypes';
 import { notificationAtom } from 'app/V2/atoms';
-
+import { settingsAtom } from 'app/V2/atoms/settingsAtom';
 import { Button, Table, Sidepanel } from 'app/V2/Components/UI';
 import { SettingsContent } from 'app/V2/Components/Layouts/SettingsContent';
 import uniqueID from 'shared/uniqueID';
@@ -38,6 +38,7 @@ const MenuConfig = () => {
   );
   const [linkChanges, setLinkChanges] = useState<ClientSettingsLinkSchema[]>([]);
   const [showModal, setShowModal] = useState(false);
+  const setSettings = useSetRecoilState(settingsAtom);
 
   useEffect(() => {
     const linksWIthid = links?.map(link => {
@@ -98,7 +99,8 @@ const MenuConfig = () => {
   };
 
   const save = async () => {
-    await SettingsAPI.saveLinks(linkChanges.map(sanitizeIds));
+    const settings = await SettingsAPI.saveLinks(linkChanges.map(sanitizeIds));
+    setSettings(settings);
     revalidator.revalidate();
     setNotifications({
       type: 'success',

app/react/V2/atoms/settingsAtom.ts

@@ -1,9 +1,18 @@
 import { atom } from 'recoil';
 import { ClientSettings } from 'app/apiResponseTypes';
+import { store } from 'app/store';
 
 const settingsAtom = atom({
   key: 'settings',
   default: {} as ClientSettings,
+  //sync deprecated redux store
+  effects: [
+    ({ onSet }) => {
+      onSet(newValue => {
+        store?.dispatch({ type: 'settings/collection/SET', value: newValue });
+      });
+    },
+  ],
 });
 
 export { settingsAtom };

cypress/e2e/settings/menu.cy.ts

@@ -91,6 +91,16 @@ describe('Menu configuration', () => {
     cy.wait('@fetchLinks');
   });
 
+  it('should update the navigation bar with the changes', () => {
+    cy.get('.menuItems > .menuNav-list > .menuNav-item')
+      .should('have.length', 3)
+      .then($els => Cypress.$.makeArray($els).map(el => el.innerText))
+      .should('deep.equal', ['Link 2', 'Group 1  ', 'Group 2  ']);
+
+    cy.get('.menuItems > .menuNav-list > .menuNav-item').eq(2).click();
+    cy.get('.dropdown-menu.expanded').contains('Link 1 edited');
+  });
+
   it('tests delete', () => {
     cy.get('tbody tr:nth-of-type(1) input').click();