diff --git a/src/components/CommandPalette.tsx b/src/components/CommandPalette.tsx
index 0e6e3c9..10b609f 100644
--- a/src/components/CommandPalette.tsx
+++ b/src/components/CommandPalette.tsx
@@ -54,7 +54,8 @@ import {
NavigationState,
} from '../types/state';
import {
- buildUrl,
+ buildDialogUrl,
+ buildGroupMenuDialogUrl,
SKIP_MENUS,
SKIP_SUB_MENUS,
} from './Tune/SideBar';
@@ -261,7 +262,12 @@ const ActionsProvider = (props: CommandPaletteProps) => {
},
];
- const mapSubMenuItems = (rootMenuName: string, rootMenu: MenuType, subMenus: { [name: string]: SubMenuType | GroupMenuType | GroupChildMenuType }) => {
+ const mapSubMenuItems = (
+ rootMenuName: string,
+ rootMenu: MenuType,
+ subMenus: { [name: string]: SubMenuType | GroupMenuType | GroupChildMenuType },
+ groupMenuName: string | null = null,
+ ) => {
Object
.keys(subMenus)
.forEach((subMenuName: string) => {
@@ -276,17 +282,22 @@ const ActionsProvider = (props: CommandPaletteProps) => {
const subMenu = subMenus[subMenuName];
if ((subMenu as GroupMenuType).type === 'groupMenu') {
- mapSubMenuItems(rootMenuName, rootMenu, (subMenu as GroupMenuType).groupChildMenus);
+ // recurrence
+ mapSubMenuItems(rootMenuName, rootMenu, (subMenu as GroupMenuType).groupChildMenus, (subMenu as GroupMenuType).title);
return;
}
+ const url = groupMenuName ?
+ buildGroupMenuDialogUrl(navigation.tuneId!, rootMenuName, groupMenuName, subMenuName) :
+ buildDialogUrl(navigation.tuneId!, rootMenuName, subMenuName);
+
newActions.push({
- id: buildUrl(navigation.tuneId!, rootMenuName, subMenuName),
+ id: url,
section: rootMenu.title,
name: subMenu.title,
icon: ,
- perform: () => navigate(buildUrl(navigation.tuneId!, rootMenuName, subMenuName)),
+ perform: () => navigate(url),
});
});
};
diff --git a/src/components/Tune/SideBar.tsx b/src/components/Tune/SideBar.tsx
index f66530c..ba359a0 100644
--- a/src/components/Tune/SideBar.tsx
+++ b/src/components/Tune/SideBar.tsx
@@ -48,10 +48,17 @@ export const SKIP_SUB_MENUS = [
'tuning/std_realtime',
];
-export const buildUrl = (tuneId: string, main: string, sub: string) => generatePath(Routes.TUNE_DIALOG, {
+export const buildDialogUrl = (tuneId: string, main: string, dialog: string) => generatePath(Routes.TUNE_DIALOG, {
tuneId,
category: main,
- dialog: sub,
+ dialog: dialog.replaceAll(' ', '-'),
+});
+
+export const buildGroupMenuDialogUrl = (tuneId: string, main: string, groupMenu: string, dialog: string) => generatePath(Routes.TUNE_GROUP_MENU_DIALOG, {
+ tuneId,
+ category: main,
+ groupMenu: groupMenu.replaceAll(' ', '-'),
+ dialog,
});
const mapStateToProps = (state: AppState) => ({
@@ -66,13 +73,14 @@ interface SideBarProps {
tune: TuneType | null;
ui: UIState;
navigation: NavigationState;
- matchedPath: PathMatch<'dialog' | 'tuneId' | 'category'>;
+ matchedPath: PathMatch<'dialog' | 'tuneId' | 'category'> | null;
+ matchedGroupMenuDialogPath: PathMatch<'dialog' | 'groupMenu' | 'tuneId' | 'category'> | null;
};
export const sidebarWidth = 250;
export const collapsedSidebarWidth = 50;
-const SideBar = ({ config, tune, ui, navigation, matchedPath }: SideBarProps) => {
+const SideBar = ({ config, tune, ui, navigation, matchedPath, matchedGroupMenuDialogPath }: SideBarProps) => {
const siderProps = {
width: sidebarWidth,
collapsedWidth: collapsedSidebarWidth,
@@ -84,7 +92,11 @@ const SideBar = ({ config, tune, ui, navigation, matchedPath }: SideBarProps) =>
const [menus, setMenus] = useState([]);
const navigate = useNavigate();
- const mapSubMenuItems = useCallback((rootMenuName: string, subMenus: { [name: string]: SubMenuType | GroupMenuType | GroupChildMenuType }): ItemType[] => {
+ const mapSubMenuItems = useCallback((
+ rootMenuName: string,
+ subMenus: { [name: string]: SubMenuType | GroupMenuType | GroupChildMenuType },
+ groupMenuName: string | null = null,
+ ): ItemType[] => {
const items: ItemType[] = [];
Object
@@ -105,16 +117,26 @@ const SideBar = ({ config, tune, ui, navigation, matchedPath }: SideBarProps) =>
const subMenu = subMenus[subMenuName];
if ((subMenu as GroupMenuType).type === 'groupMenu') {
- items.push(...mapSubMenuItems(rootMenuName, (subMenu as GroupMenuType).groupChildMenus));
+ // recurrence
+ items.push({
+ key: buildDialogUrl(navigation.tuneId!, rootMenuName, (subMenu as GroupMenuType).title),
+ icon: ,
+ label: (subMenu as GroupMenuType).title,
+ children: mapSubMenuItems(rootMenuName, (subMenu as GroupMenuType).groupChildMenus, (subMenu as GroupMenuType).title),
+ });
return;
}
+ const url = groupMenuName ?
+ buildGroupMenuDialogUrl(navigation.tuneId!, rootMenuName, groupMenuName, subMenuName) :
+ buildDialogUrl(navigation.tuneId!, rootMenuName, subMenuName);
+
items.push({
- key: buildUrl(navigation.tuneId!, rootMenuName, subMenuName),
+ key: url,
icon: ,
label: subMenu.title,
- onClick: () => navigate(buildUrl(navigation.tuneId!, rootMenuName, subMenuName)),
+ onClick: () => navigate(url),
});
});
@@ -144,15 +166,30 @@ const SideBar = ({ config, tune, ui, navigation, matchedPath }: SideBarProps) =>
}
}, [config, config?.menus, menusList, tune, tune?.constants]);
+ const defaultOpenSubmenus = () => {
+ if (matchedGroupMenuDialogPath) {
+ return [
+ `/${matchedGroupMenuDialogPath.params.category}`,
+ buildDialogUrl(
+ navigation.tuneId!,
+ matchedGroupMenuDialogPath.params.category!,
+ matchedGroupMenuDialogPath.params.groupMenu!,
+ ),
+ ];
+ }
+
+ return [`/${matchedPath!.params.category}`];
+ };
+
return (
diff --git a/src/pages/Tune.tsx b/src/pages/Tune.tsx
index 6ee54e3..3226f98 100644
--- a/src/pages/Tune.tsx
+++ b/src/pages/Tune.tsx
@@ -26,8 +26,7 @@ const mapStateToProps = (state: AppState) => ({
const Tune = ({ config, tune }: { config: ConfigType | null, tune: TuneState }) => {
const dialogMatch = useMatch(Routes.TUNE_DIALOG);
const tuneRootMatch = useMatch(Routes.TUNE_TUNE);
- // const { storageGetSync } = useBrowserStorage();
- // const lastDialogPath = storageGetSync('lastDialog');
+ const groupMenuDialogMatch = useMatch(Routes.TUNE_GROUP_MENU_DIALOG);
const { isConfigReady } = useConfig(config);
const navigate = useNavigate();
@@ -47,18 +46,21 @@ const Tune = ({ config, tune }: { config: ConfigType | null, tune: TuneState })
navigate(firstDialogPath, { replace: true });
}
- }, [navigate, tuneRootMatch, isConfigReady, config?.menus, tuneId, config, tune, dialogMatch]);
+ }, [navigate, tuneRootMatch, isConfigReady, config?.menus, tuneId, config, tune, dialogMatch, groupMenuDialogMatch]);
- if (!tune || !config || !dialogMatch) {
+ if (!tune || !config || (!dialogMatch && !groupMenuDialogMatch)) {
return ;
}
return (
<>
-
+
>
);
diff --git a/src/routes.ts b/src/routes.ts
index 5705c85..7382f06 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -7,6 +7,7 @@ export enum Routes {
TUNE_TAB = '/t/:tuneId/:tab',
TUNE_TUNE = '/t/:tuneId/tune',
TUNE_DIALOG = '/t/:tuneId/tune/:category/:dialog',
+ TUNE_GROUP_MENU_DIALOG = '/t/:tuneId/tune/:category/:groupMenu/:dialog',
TUNE_LOGS = '/t/:tuneId/logs',
TUNE_LOGS_FILE = '/t/:tuneId/logs/:fileName',
TUNE_DIAGNOSE = '/t/:tuneId/diagnose',