Files
NODEDC_DESIGN_GUIDELINE/packages/ui-react/src/ApplicationWorkspace.ts
T

68 lines
2.1 KiB
TypeScript

import { useCallback, useState } from "react";
export interface ApplicationWorkspaceState<ViewId extends string> {
navigationOpen: boolean;
activeView: ViewId | null;
contentOpen: boolean;
contentExpanded: boolean;
}
export interface ApplicationWorkspaceController<ViewId extends string> extends ApplicationWorkspaceState<ViewId> {
openNavigation: () => void;
toggleNavigation: () => void;
closeNavigation: () => void;
openView: (view: ViewId) => void;
closeView: () => void;
setContentExpanded: (expanded: boolean) => void;
}
export interface ApplicationWorkspaceInitialState<ViewId extends string> {
navigationOpen?: boolean;
activeView?: ViewId | null;
contentExpanded?: boolean;
}
/** Owns the Launcher-derived navigation/content-window state machine. */
export function useApplicationWorkspace<ViewId extends string>({
navigationOpen: initialNavigationOpen = false,
activeView: initialActiveView = null,
contentExpanded: initialContentExpanded = true,
}: ApplicationWorkspaceInitialState<ViewId> = {}): ApplicationWorkspaceController<ViewId> {
const [navigationOpen, setNavigationOpen] = useState(initialNavigationOpen || initialActiveView !== null);
const [activeView, setActiveView] = useState<ViewId | null>(initialActiveView);
const [contentExpanded, setContentExpanded] = useState(initialContentExpanded);
const openNavigation = useCallback(() => setNavigationOpen(true), []);
const closeView = useCallback(() => setActiveView(null), []);
const closeNavigation = useCallback(() => {
setNavigationOpen(false);
setActiveView(null);
}, []);
const toggleNavigation = useCallback(() => {
if (navigationOpen) {
setNavigationOpen(false);
setActiveView(null);
} else {
setNavigationOpen(true);
}
}, [navigationOpen]);
const openView = useCallback((view: ViewId) => {
setNavigationOpen(true);
setActiveView(view);
setContentExpanded(true);
}, []);
return {
navigationOpen,
activeView,
contentOpen: activeView !== null,
contentExpanded,
openNavigation,
toggleNavigation,
closeNavigation,
openView,
closeView,
setContentExpanded,
};
}