diff --git a/src/views/catalog/CatalogView.tsx b/src/views/catalog/CatalogView.tsx index db3735f0..2199c0ca 100644 --- a/src/views/catalog/CatalogView.tsx +++ b/src/views/catalog/CatalogView.tsx @@ -122,8 +122,8 @@ export const CatalogView: FC = props => const tree = buildCatalogPageTree(catalogState.root, pendingPageId); setCurrentTab(tree.shift()); - setPendingTree(tree); setPendingPageId(-1); + setPendingTree(tree); } } }, [ isVisible, pendingPageId, catalogState.root, buildCatalogPageTree, setCurrentTab ]); diff --git a/src/views/catalog/views/navigation/CatalogNavigationView.tsx b/src/views/catalog/views/navigation/CatalogNavigationView.tsx index a240a71f..d185f223 100644 --- a/src/views/catalog/views/navigation/CatalogNavigationView.tsx +++ b/src/views/catalog/views/navigation/CatalogNavigationView.tsx @@ -1,11 +1,26 @@ -import { FC } from 'react'; +import { ICatalogPageData } from 'nitro-renderer'; +import { FC, useEffect } from 'react'; import { CatalogSearchView } from '../search/CatalogSearchView'; import { CatalogNavigationViewProps } from './CatalogNavigationView.types'; import { CatalogNavigationSetView } from './set/CatalogNavigationSetView'; +export const ACTIVE_PAGES: ICatalogPageData[] = []; + export const CatalogNavigationView: FC = props => { const { page = null, pendingTree = null, setPendingTree = null } = props; + + useEffect(() => + { + if(!page) return; + + const index = (ACTIVE_PAGES.push(page) - 1); + + return () => + { + ACTIVE_PAGES.splice(index, 1); + } + }, [ page ]); return ( <> diff --git a/src/views/catalog/views/navigation/item/CatalogNavigationItemView.tsx b/src/views/catalog/views/navigation/item/CatalogNavigationItemView.tsx index 941c1c00..1ec16de1 100644 --- a/src/views/catalog/views/navigation/item/CatalogNavigationItemView.tsx +++ b/src/views/catalog/views/navigation/item/CatalogNavigationItemView.tsx @@ -2,8 +2,8 @@ import { CatalogPageComposer, ICatalogPageData } from 'nitro-renderer'; import { FC, useCallback, useEffect, useState } from 'react'; import { SendMessageHook } from '../../../../../hooks/messages/message-event'; import { CatalogMode } from '../../../CatalogView.types'; -import { useCatalogContext } from '../../../context/CatalogContext'; import { CatalogIconView } from '../../catalog-icon/CatalogIconView'; +import { ACTIVE_PAGES } from '../CatalogNavigationView'; import { CatalogNavigationSetView } from '../set/CatalogNavigationSetView'; import { CatalogNavigationItemViewProps } from './CatalogNavigationItemView.types'; @@ -11,9 +11,8 @@ export const CatalogNavigationItemView: FC = pro { const { page = null, isActive = false, pendingTree = null, setPendingTree = null, setActiveChild = null } = props; const [ isExpanded, setIsExpanded ] = useState(false); - const { dispatchCatalogState = null } = useCatalogContext(); - const select = useCallback((selectPage: ICatalogPageData) => + const select = useCallback((selectPage: ICatalogPageData, expand: boolean = false) => { if(!selectPage) return; @@ -21,7 +20,7 @@ export const CatalogNavigationItemView: FC = pro { if(prevValue === selectPage) { - SendMessageHook(new CatalogPageComposer(selectPage.pageId, -1, CatalogMode.MODE_NORMAL)); + if(selectPage.pageId > -1) SendMessageHook(new CatalogPageComposer(selectPage.pageId, -1, CatalogMode.MODE_NORMAL)); } return selectPage; @@ -31,6 +30,8 @@ export const CatalogNavigationItemView: FC = pro { setIsExpanded(prevValue => { + if(expand) return true; + return !prevValue; }); } @@ -38,25 +39,41 @@ export const CatalogNavigationItemView: FC = pro useEffect(() => { - if(!isActive || !page) return; + if(!pendingTree || !pendingTree.length) return; - setIsExpanded(true); - - SendMessageHook(new CatalogPageComposer(page.pageId, -1, CatalogMode.MODE_NORMAL)); - }, [ isActive, page, select, dispatchCatalogState ]); + if(page !== pendingTree[0]) return; + + if(pendingTree.length > 1) + { + const newTree = [ ...pendingTree ]; + + newTree.shift(); + + setPendingTree(newTree); + } + else + { + setPendingTree(null); + } + + select(page, true); + }, [ page, pendingTree, setPendingTree, select ]); useEffect(() => { - if(!page || !pendingTree || !pendingTree.length) return; + if(!isActive || !page) return; - const index = pendingTree.indexOf(page); + setIsExpanded(true); - if(index === -1) return; + if(page.pageId > -1) SendMessageHook(new CatalogPageComposer(page.pageId, -1, CatalogMode.MODE_NORMAL)); - //if(!pendingTree.length) setPendingTree(null); + const index = (ACTIVE_PAGES.push(page) - 1); - select(page); - }, [ pendingTree, page, select, setPendingTree ]); + return () => + { + ACTIVE_PAGES.length = index; + } + }, [ isActive, page ]); return (
diff --git a/src/views/catalog/views/navigation/set/CatalogNavigationSetView.tsx b/src/views/catalog/views/navigation/set/CatalogNavigationSetView.tsx index a9e897ec..5d895528 100644 --- a/src/views/catalog/views/navigation/set/CatalogNavigationSetView.tsx +++ b/src/views/catalog/views/navigation/set/CatalogNavigationSetView.tsx @@ -7,7 +7,7 @@ export const CatalogNavigationSetView: FC = props { const { page = null, isFirstSet = false, pendingTree = null, setPendingTree = null } = props; const [ activeChild, setActiveChild ] = useState(null); - + useEffect(() => { if(!isFirstSet || !page || (page.pageId === -1) || pendingTree) return; @@ -16,9 +16,14 @@ export const CatalogNavigationSetView: FC = props { const child = page.children[0]; - setActiveChild(child); + //if(child) setActiveChild(child); } }, [ page, isFirstSet, pendingTree ]); + + useEffect(() => + { + console.log('activeChild', activeChild, page); + }, [ page, activeChild ]); return (