Mirrored_Repos/InvenTree
1
0
Fork 0
mirror of https://github.com/inventree/InvenTree synced 2024-08-30 18:33:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Cleanup hooks for changing panel state

Browse Source
This commit is contained in:
Oliver Walters 2024-08-30 04:00:06 +00:00
parent ef64a4cd5a
commit 1dfad61c52
1 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/frontend/src/components/nav/PanelGroup.tsx
View File

@ -63,6 +63,7 @@ function BasePanelGroup({
id, id,
collapsible = true collapsible = true
}: Readonly<PanelProps>): ReactNode { }: Readonly<PanelProps>): ReactNode {
const localState = useLocalState();
const location = useLocation(); const location = useLocation();
const navigate = useNavigate(); const navigate = useNavigate();
const { panel } = useParams(); const { panel } = useParams();
@ -77,8 +78,8 @@ function BasePanelGroup({
}); });
const allPanels = useMemo( const allPanels = useMemo(
() => [...panels, ...pluginPanels.panels], () => [...panels, ...pluginPanels],
[panels, pluginPanels.panels] [panels, pluginPanels]
); );
const activePanels = useMemo( const activePanels = useMemo(
@ -86,8 +87,13 @@ function BasePanelGroup({
[allPanels] [allPanels]
); );
const setLastUsedPanel = useLocalState((state) => const changePanel = useCallback(
state.setLastUsedPanel(pageKey) (value: string) => {
if (value != panel) {
localState.setLastUsedPanel(pageKey)(value);
}
},
[localState, pageKey, panel]
); );
// Callback when the active panel changes // Callback when the active panel changes
@ -110,16 +116,9 @@ function BasePanelGroup({
onPanelChange(panel); onPanelChange(panel);
} }
}, },
[activePanels, setLastUsedPanel, navigate, location, onPanelChange] [activePanels, navigate, location, onPanelChange]
); );
useEffect(() => {
if (panel) {
setLastUsedPanel(panel);
}
// panel is intentionally no dependency as this should only run on initial render
}, [setLastUsedPanel]);
// if the selected panel state changes update the current panel // if the selected panel state changes update the current panel
useEffect(() => { useEffect(() => {
if (selectedPanel && selectedPanel !== panel) { if (selectedPanel && selectedPanel !== panel) {
@ -130,10 +129,10 @@ function BasePanelGroup({
// Update the active panel when panels changes and the active is no longer available // Update the active panel when panels changes and the active is no longer available
useEffect(() => { useEffect(() => {
if (activePanels.findIndex((p) => p.name === panel) === -1) { if (activePanels.findIndex((p) => p.name === panel) === -1) {
setLastUsedPanel(''); changePanel('');
return navigate('../'); return navigate('../');
} }
}, [activePanels, panel]); }, [activePanels, changePanel, panel]);
return ( return (
<Boundary label={`PanelGroup-${pageKey}`}> <Boundary label={`PanelGroup-${pageKey}`}>