Fix Tune routing
This commit is contained in:
parent
fe91066c76
commit
99b854fad6
|
@ -4,19 +4,13 @@ import {
|
||||||
useNavigate,
|
useNavigate,
|
||||||
} from 'react-router-dom';
|
} from 'react-router-dom';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import {
|
import { useEffect } from 'react';
|
||||||
useEffect,
|
|
||||||
useMemo,
|
|
||||||
} from 'react';
|
|
||||||
import { Config as ConfigType } from '@speedy-tuner/types';
|
import { Config as ConfigType } from '@speedy-tuner/types';
|
||||||
import Dialog from '../components/Tune/Dialog';
|
import Dialog from '../components/Tune/Dialog';
|
||||||
import SideBar from '../components/Tune/SideBar';
|
import SideBar from '../components/Tune/SideBar';
|
||||||
import { Routes } from '../routes';
|
import { Routes } from '../routes';
|
||||||
import useConfig from '../hooks/useConfig';
|
import useConfig from '../hooks/useConfig';
|
||||||
import {
|
import { AppState } from '../types/state';
|
||||||
AppState,
|
|
||||||
NavigationState,
|
|
||||||
} from '../types/state';
|
|
||||||
import Loader from '../components/Loader';
|
import Loader from '../components/Loader';
|
||||||
|
|
||||||
const mapStateToProps = (state: AppState) => ({
|
const mapStateToProps = (state: AppState) => ({
|
||||||
|
@ -25,7 +19,7 @@ const mapStateToProps = (state: AppState) => ({
|
||||||
config: state.config,
|
config: state.config,
|
||||||
});
|
});
|
||||||
|
|
||||||
const Tune = ({ navigation, config }: { navigation: NavigationState, config: ConfigType }) => {
|
const Tune = ({ config }: { config: ConfigType }) => {
|
||||||
const dialogMatch = useMatch(Routes.TUNE_DIALOG);
|
const dialogMatch = useMatch(Routes.TUNE_DIALOG);
|
||||||
const tuneRootMatch = useMatch(Routes.TUNE_TUNE);
|
const tuneRootMatch = useMatch(Routes.TUNE_TUNE);
|
||||||
// const { storageGetSync } = useBrowserStorage();
|
// const { storageGetSync } = useBrowserStorage();
|
||||||
|
@ -33,26 +27,23 @@ const Tune = ({ navigation, config }: { navigation: NavigationState, config: Con
|
||||||
const { isConfigReady } = useConfig(config);
|
const { isConfigReady } = useConfig(config);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
const firstDialogPath = useMemo(() => {
|
const tunePathMatch = useMatch(`${Routes.TUNE_ROOT}/*`);
|
||||||
if (!isConfigReady) {
|
const tuneId = tunePathMatch?.params.tuneId;
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const firstCategory = Object.keys(config.menus)[0];
|
|
||||||
const firstDialog = Object.keys(config.menus[firstCategory].subMenus)[0];
|
|
||||||
|
|
||||||
return generatePath(Routes.TUNE_DIALOG, {
|
|
||||||
tuneId: navigation.tuneId!,
|
|
||||||
category: firstCategory,
|
|
||||||
dialog: firstDialog,
|
|
||||||
});
|
|
||||||
}, [config.menus, isConfigReady, navigation.tuneId]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (tuneRootMatch && firstDialogPath) {
|
if (isConfigReady && tuneRootMatch) {
|
||||||
|
const firstCategory = Object.keys(config.menus)[0];
|
||||||
|
const firstDialog = Object.keys(config.menus[firstCategory].subMenus)[0];
|
||||||
|
|
||||||
|
const firstDialogPath = generatePath(Routes.TUNE_DIALOG, {
|
||||||
|
tuneId,
|
||||||
|
category: firstCategory,
|
||||||
|
dialog: firstDialog,
|
||||||
|
});
|
||||||
|
|
||||||
navigate(firstDialogPath, { replace: true });
|
navigate(firstDialogPath, { replace: true });
|
||||||
}
|
}
|
||||||
}, [firstDialogPath, navigate, tuneRootMatch, isConfigReady]);
|
}, [navigate, tuneRootMatch, isConfigReady, config.menus, tuneId]);
|
||||||
|
|
||||||
if (!isConfigReady || !dialogMatch) {
|
if (!isConfigReady || !dialogMatch) {
|
||||||
return <Loader />;
|
return <Loader />;
|
||||||
|
|
Loading…
Reference in New Issue