FInally fix catalog

src/views/catalog/CatalogView.tsx

@@ -8,9 +8,9 @@ import { NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, Nitro
 import { LocalizeText } from '../../utils/LocalizeText';
 import { CatalogMessageHandler } from './CatalogMessageHandler';
 import { CatalogMode, CatalogViewProps } from './CatalogView.types';
-import { GetCatalogPageTree } from './common/CatalogUtilities';
+import { BuildCatalogPageTree } from './common/CatalogUtilities';
 import { CatalogContextProvider } from './context/CatalogContext';
-import { CatalogActions, CatalogReducer, initialCatalog } from './reducers/CatalogReducer';
+import { CatalogReducer, initialCatalog } from './reducers/CatalogReducer';
 import { CatalogNavigationView } from './views/navigation/CatalogNavigationView';
 import { CatalogPageView } from './views/page/CatalogPageView';
 
@@ -21,7 +21,8 @@ export const CatalogView: FC<CatalogViewProps> = props =>
     const [ pendingPageId, setPendingPageId ] = useState(-1);
     const [ pendingTree, setPendingTree ] = useState<ICatalogPageData[]>(null);
     const [ catalogState, dispatchCatalogState ] = useReducer(CatalogReducer, initialCatalog);
-    const { root = null, currentTab = null, pageParser = null, activeOffer = null, searchResult = null} = catalogState;
+    const [ currentTab, setCurrentTab ] = useState<ICatalogPageData>(null);
+    const { root = null, pageParser = null, activeOffer = null, searchResult = null} = catalogState;
 
     const onCatalogEvent = useCallback((event: CatalogEvent) =>
     {
@@ -44,27 +45,6 @@ export const CatalogView: FC<CatalogViewProps> = props =>
     useUiEvent(CatalogEvent.TOGGLE_CATALOG, onCatalogEvent);
     useUiEvent(CatalogEvent.CATALOG_RESET, onCatalogEvent);
 
-    const setCurrentTab = useCallback((page: ICatalogPageData) =>
-    {
-        dispatchCatalogState({
-            type: CatalogActions.SET_CATALOG_CURRENT_TAB,
-            payload: {
-                currentTab: page
-            }
-        });
-    }, [ dispatchCatalogState ]);
-
-    const buildCatalogPageTree = useCallback((page: ICatalogPageData, targetPageId: number) =>
-    {
-        const pageTree: ICatalogPageData[] = [];
-
-        GetCatalogPageTree(page, targetPageId, pageTree);
-
-        if(pageTree.length) pageTree.reverse();
-
-        return pageTree;
-    }, []);
-
     const linkReceived = useCallback((url: string) =>
     {
         const parts = url.split('/');
@@ -106,6 +86,8 @@ export const CatalogView: FC<CatalogViewProps> = props =>
         {
             SendMessageHook(new CatalogModeComposer(CatalogMode.MODE_NORMAL));
             SendMessageHook(new CatalogRequestGiftConfigurationComposer());
+
+            return;
         }
 
         if(catalogState.root)
@@ -119,14 +101,32 @@ export const CatalogView: FC<CatalogViewProps> = props =>
 
             if(pendingPageId > -1)
             {
-                const tree = buildCatalogPageTree(catalogState.root, pendingPageId);
+                const tree = BuildCatalogPageTree(catalogState.root, pendingPageId);
 
                 setCurrentTab(tree.shift());
                 setPendingPageId(-1);
                 setPendingTree(tree);
             }
+            else
+            {
+
+                setCurrentTab(prevValue =>
+                    {
+                        if(catalogState.root.children.length)
+                        {
+                            if(prevValue)
+                            {
+                                if(catalogState.root.children.indexOf(prevValue) >= 0) return prevValue;
+                            }
+
+                            return ((catalogState.root.children.length && catalogState.root.children[0]) || null);
+                        }
+
+                        return null;
+                    });
+            }
         }
-    }, [ isVisible, pendingPageId, catalogState.root, buildCatalogPageTree, setCurrentTab ]);
+    }, [ isVisible, pendingPageId, catalogState.root, setCurrentTab ]);
 
     useEffect(() =>
     {
@@ -151,6 +151,7 @@ export const CatalogView: FC<CatalogViewProps> = props =>
     }, []);
 
     const currentNavigationPage = ((searchResult && searchResult.page) || currentTab);
+    const navigationHidden = (pageParser && pageParser.frontPageItems.length);
 
     return (
         <CatalogContextProvider value={ { catalogState, dispatchCatalogState } }>
@@ -170,7 +171,7 @@ export const CatalogView: FC<CatalogViewProps> = props =>
                     </NitroCardTabsView>
                     <NitroCardContentView>
                         <div className="row h-100">
-                            { (!pageParser || (pageParser && !pageParser.frontPageItems.length)) &&
+                            { currentNavigationPage && !navigationHidden &&
                                 <div className="col-3 d-flex flex-column h-100">
                                     <CatalogNavigationView page={ currentNavigationPage } pendingTree={ pendingTree } setPendingTree={ setPendingTree } />
                                 </div> }

src/views/catalog/common/CatalogUtilities.ts

@@ -166,3 +166,14 @@ export function GetCatalogPageTree(page: ICatalogPageData, targetPageId: number,
         }
     }
 }
+
+export function BuildCatalogPageTree(page: ICatalogPageData, targetPageId: number)
+{
+    const pageTree: ICatalogPageData[] = [];
+
+    GetCatalogPageTree(page, targetPageId, pageTree);
+
+    if(pageTree.length) pageTree.reverse();
+
+    return pageTree;
+}

src/views/catalog/views/navigation/item/CatalogNavigationItemView.tsx

@@ -43,18 +43,12 @@ export const CatalogNavigationItemView: FC<CatalogNavigationItemViewProps> = pro
 
         if(page !== pendingTree[0]) return;
 
-        if(pendingTree.length > 1)
+        const newTree = [ ...pendingTree ];
-        {
-            const newTree = [ ...pendingTree ];
 
-            newTree.shift();
+        newTree.shift();
 
-            setPendingTree(newTree);
+        if(newTree.length) setPendingTree(newTree);
-        }
+        else setPendingTree(null);
-        else
-        {
-            setPendingTree(null);
-        }
 
         select(page, true);
     }, [ page, pendingTree, setPendingTree, select ]);

src/views/catalog/views/navigation/set/CatalogNavigationSetView.tsx

@@ -7,23 +7,23 @@ export const CatalogNavigationSetView: FC<CatalogNavigationSetViewProps> = props
 {
     const { page = null, isFirstSet = false, pendingTree = null, setPendingTree = null } = props;
     const [ activeChild, setActiveChild ] = useState<ICatalogPageData>(null);
-    
+
     useEffect(() =>
     {
-        if(!isFirstSet || !page || (page.pageId === -1) || pendingTree) return;
+        if(!page || (page.pageId === -1) || !isFirstSet || pendingTree) return;
 
-        if(page && page.children.length)
+        if(page.children.length)
         {
-            const child = page.children[0];
+            if(activeChild)
-
+            {
-            //if(child) setActiveChild(child);
+                if(page.children.indexOf(activeChild) === -1) setActiveChild(null);
+                
+                return;
+            }
+            
+            setActiveChild(page.children[0]);
         }
-    }, [ page, isFirstSet, pendingTree ]);
+    }, [ page, isFirstSet, activeChild, pendingTree ]);
-
-    useEffect(() =>
-    {
-        console.log('activeChild', activeChild, page);
-    }, [ page, activeChild ]);
     
     return (
         <div className="row row-cols-1 g-0 catalog-navigation-set-container w-100">