mirror of
https://github.com/billsonnn/nitro-react.git
synced 2025-02-18 18:02:36 +01:00
Catalog remember last opened page
This commit is contained in:
parent
2961ef64ce
commit
b200e93968
@ -11,7 +11,7 @@ import { CatalogMode, CatalogViewProps } from './CatalogView.types';
|
|||||||
import { BuildCatalogPageTree } from './common/CatalogUtilities';
|
import { BuildCatalogPageTree } from './common/CatalogUtilities';
|
||||||
import { CatalogContextProvider } from './context/CatalogContext';
|
import { CatalogContextProvider } from './context/CatalogContext';
|
||||||
import { CatalogReducer, initialCatalog } from './reducers/CatalogReducer';
|
import { CatalogReducer, initialCatalog } from './reducers/CatalogReducer';
|
||||||
import { CatalogNavigationView } from './views/navigation/CatalogNavigationView';
|
import { ACTIVE_PAGES, CatalogNavigationView } from './views/navigation/CatalogNavigationView';
|
||||||
import { CatalogPageView } from './views/page/CatalogPageView';
|
import { CatalogPageView } from './views/page/CatalogPageView';
|
||||||
|
|
||||||
export const CatalogView: FC<CatalogViewProps> = props =>
|
export const CatalogView: FC<CatalogViewProps> = props =>
|
||||||
@ -20,25 +20,37 @@ export const CatalogView: FC<CatalogViewProps> = props =>
|
|||||||
const [ roomPreviewer, setRoomPreviewer ] = useState<RoomPreviewer>(null);
|
const [ roomPreviewer, setRoomPreviewer ] = useState<RoomPreviewer>(null);
|
||||||
const [ pendingPageLookup, setPendingPageLookup ] = useState<{ value: string, isOffer: boolean }>(null);
|
const [ pendingPageLookup, setPendingPageLookup ] = useState<{ value: string, isOffer: boolean }>(null);
|
||||||
const [ pendingTree, setPendingTree ] = useState<ICatalogPageData[]>(null);
|
const [ pendingTree, setPendingTree ] = useState<ICatalogPageData[]>(null);
|
||||||
|
const [ pendingOpenTree, setPendingOpenTree ] = useState<ICatalogPageData[]>(null);
|
||||||
const [ catalogState, dispatchCatalogState ] = useReducer(CatalogReducer, initialCatalog);
|
const [ catalogState, dispatchCatalogState ] = useReducer(CatalogReducer, initialCatalog);
|
||||||
const [ currentTab, setCurrentTab ] = useState<ICatalogPageData>(null);
|
const [ currentTab, setCurrentTab ] = useState<ICatalogPageData>(null);
|
||||||
const { root = null, pageParser = null, activeOffer = null, searchResult = null} = catalogState;
|
const { root = null, pageParser = null, activeOffer = null, searchResult = null} = catalogState;
|
||||||
|
|
||||||
|
const saveActivePages = useCallback(() =>
|
||||||
|
{
|
||||||
|
setPendingOpenTree(ACTIVE_PAGES.slice());
|
||||||
|
}, []);
|
||||||
|
|
||||||
const onCatalogEvent = useCallback((event: CatalogEvent) =>
|
const onCatalogEvent = useCallback((event: CatalogEvent) =>
|
||||||
{
|
{
|
||||||
|
let save = false;
|
||||||
|
|
||||||
switch(event.type)
|
switch(event.type)
|
||||||
{
|
{
|
||||||
case CatalogEvent.SHOW_CATALOG:
|
case CatalogEvent.SHOW_CATALOG:
|
||||||
setIsVisible(true);
|
setIsVisible(true);
|
||||||
return;
|
return;
|
||||||
case CatalogEvent.HIDE_CATALOG:
|
case CatalogEvent.HIDE_CATALOG:
|
||||||
|
save = true;
|
||||||
setIsVisible(false);
|
setIsVisible(false);
|
||||||
return;
|
return;
|
||||||
case CatalogEvent.TOGGLE_CATALOG:
|
case CatalogEvent.TOGGLE_CATALOG:
|
||||||
|
save = true;
|
||||||
setIsVisible(value => !value);
|
setIsVisible(value => !value);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}, []);
|
|
||||||
|
if(save) saveActivePages();
|
||||||
|
}, [ saveActivePages ]);
|
||||||
|
|
||||||
useUiEvent(CatalogEvent.SHOW_CATALOG, onCatalogEvent);
|
useUiEvent(CatalogEvent.SHOW_CATALOG, onCatalogEvent);
|
||||||
useUiEvent(CatalogEvent.HIDE_CATALOG, onCatalogEvent);
|
useUiEvent(CatalogEvent.HIDE_CATALOG, onCatalogEvent);
|
||||||
@ -88,7 +100,7 @@ export const CatalogView: FC<CatalogViewProps> = props =>
|
|||||||
AddEventLinkTracker(linkTracker);
|
AddEventLinkTracker(linkTracker);
|
||||||
|
|
||||||
return () => RemoveLinkEventTracker(linkTracker);
|
return () => RemoveLinkEventTracker(linkTracker);
|
||||||
}, [ linkReceived]);
|
}, [ linkReceived ]);
|
||||||
|
|
||||||
useEffect(() =>
|
useEffect(() =>
|
||||||
{
|
{
|
||||||
@ -111,11 +123,21 @@ export const CatalogView: FC<CatalogViewProps> = props =>
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if(pendingPageLookup !== null)
|
if(pendingPageLookup !== null || pendingOpenTree)
|
||||||
{
|
{
|
||||||
const tree = BuildCatalogPageTree(catalogState.root, pendingPageLookup.value, pendingPageLookup.isOffer);
|
let tree: ICatalogPageData[] = [];
|
||||||
|
|
||||||
|
if(pendingPageLookup !== null)
|
||||||
|
{
|
||||||
|
tree = BuildCatalogPageTree(catalogState.root, pendingPageLookup.value, pendingPageLookup.isOffer);
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
tree = pendingOpenTree.slice();
|
||||||
|
}
|
||||||
|
|
||||||
setCurrentTab(tree.shift());
|
setCurrentTab(tree.shift());
|
||||||
|
setPendingOpenTree(null);
|
||||||
setPendingPageLookup(null);
|
setPendingPageLookup(null);
|
||||||
setPendingTree(tree);
|
setPendingTree(tree);
|
||||||
}
|
}
|
||||||
@ -137,7 +159,7 @@ export const CatalogView: FC<CatalogViewProps> = props =>
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [ isVisible, pendingPageLookup, catalogState.root, setCurrentTab ]);
|
}, [ isVisible, pendingPageLookup, pendingOpenTree, catalogState.root, setCurrentTab ]);
|
||||||
|
|
||||||
useEffect(() =>
|
useEffect(() =>
|
||||||
{
|
{
|
||||||
@ -169,7 +191,7 @@ export const CatalogView: FC<CatalogViewProps> = props =>
|
|||||||
<CatalogMessageHandler />
|
<CatalogMessageHandler />
|
||||||
{ isVisible &&
|
{ isVisible &&
|
||||||
<NitroCardView className="nitro-catalog">
|
<NitroCardView className="nitro-catalog">
|
||||||
<NitroCardHeaderView headerText={ LocalizeText('catalog.title') } onCloseClick={ event => setIsVisible(false) } />
|
<NitroCardHeaderView headerText={ LocalizeText('catalog.title') } onCloseClick={ event => { saveActivePages(); setIsVisible(false); } } />
|
||||||
<NitroCardTabsView>
|
<NitroCardTabsView>
|
||||||
{ root && root.children.length && root.children.map((page, index) =>
|
{ root && root.children.length && root.children.map((page, index) =>
|
||||||
{
|
{
|
||||||
|
@ -4,7 +4,7 @@ import { CatalogSearchView } from '../search/CatalogSearchView';
|
|||||||
import { CatalogNavigationViewProps } from './CatalogNavigationView.types';
|
import { CatalogNavigationViewProps } from './CatalogNavigationView.types';
|
||||||
import { CatalogNavigationSetView } from './set/CatalogNavigationSetView';
|
import { CatalogNavigationSetView } from './set/CatalogNavigationSetView';
|
||||||
|
|
||||||
export const ACTIVE_PAGES: ICatalogPageData[] = [];
|
export let ACTIVE_PAGES: ICatalogPageData[] = [];
|
||||||
|
|
||||||
export const CatalogNavigationView: FC<CatalogNavigationViewProps> = props =>
|
export const CatalogNavigationView: FC<CatalogNavigationViewProps> = props =>
|
||||||
{
|
{
|
||||||
@ -14,11 +14,11 @@ export const CatalogNavigationView: FC<CatalogNavigationViewProps> = props =>
|
|||||||
{
|
{
|
||||||
if(!page) return;
|
if(!page) return;
|
||||||
|
|
||||||
const index = (ACTIVE_PAGES.push(page) - 1);
|
ACTIVE_PAGES = [ page ];
|
||||||
|
|
||||||
return () =>
|
return () =>
|
||||||
{
|
{
|
||||||
ACTIVE_PAGES.splice(index, 1);
|
ACTIVE_PAGES = [];
|
||||||
}
|
}
|
||||||
}, [ page ]);
|
}, [ page ]);
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user