denis/peliprint
denis/peliprint
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat routes: make some progress on custom extension routes

Browse source
This commit is contained in:
prplwtf 2024-01-21 22:01:48 +01:00
parent b4e0c761c4
commit 7ac80a4714
6 changed files with 137 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

71
resources/scripts/blueprint/extends/routers/DashboardRouter.tsx Normal file
View file

@ -0,0 +1,71 @@
import React from 'react';
import { NavLink, Route, Switch } from 'react-router-dom';
import { useLocation } from 'react-router';
import { NotFound } from '@/components/elements/ScreenBlock';
import TransitionRouter from '@/TransitionRouter';
import DashboardContainer from '@/components/dashboard/DashboardContainer';
import Spinner from '@/components/elements/Spinner';
import routes from '@/routers/routes';
import blueprintRoutes from './routes';
export const NavigationLinks = () => {
return (
<>
{/* Pterodactyl routes */}
{routes.account
.filter((route) => !!route.name)
.map(({ path, name, exact = false }) => (
<NavLink key={path} to={`/account/${path}`.replace('//', '/')} exact={exact}>
{name}
</NavLink>
))}
{/* Blueprint routes */}
{blueprintRoutes.account
.filter((route) => !!route.name)
.map(({ path, name, exact = false }) => (
<NavLink key={path} to={`/account/${path}`.replace('//', '/')} exact={exact}>
{name}
</NavLink>
))}
</>
);
};
export const NavigationRouter = () => {
const location = useLocation();
return (
<>
<TransitionRouter>
<React.Suspense fallback={<Spinner centered />}>
<Switch location={location}>
<Route path={'/'} exact>
<DashboardContainer />
</Route>
{/* Pterodactyl routes */}
{routes.account.map(({ path, component: Component }) => (
<Route key={path} path={`/account/${path}`.replace('//', '/')} exact>
<Component />
</Route>
))}
{/* Blueprint routes */}
{blueprintRoutes.account.map(({ path, component: Component }) => (
<Route key={path} path={`/account/${path}`.replace('//', '/')} exact>
<Component />
</Route>
))}
<Route path={'*'}>
<NotFound />
</Route>
</Switch>
</React.Suspense>
</TransitionRouter>
</>
);
};

14
resources/scripts/blueprint/extends/routers/ExampleComponent.tsx Normal file
View file

@ -0,0 +1,14 @@
import React from 'react';
import PageContentBlock from '@/components/elements/PageContentBlock';
const ExampleContainer = () => {
return (
<PageContentBlock title={'Example'}>
<>
<p>hello</p>
</>
</PageContentBlock>
);
};
export default ExampleContainer;

8
resources/scripts/blueprint/extends/routers/ServerRouter.tsx Normal file
View file

@ -0,0 +1,8 @@
import React from 'react';
export default () => {
return (
<>
</>
);
};

37
resources/scripts/blueprint/extends/routers/routes.ts Normal file
View file

@ -0,0 +1,37 @@
import React from 'react';
import ExampleContainer from './ExampleComponent';
interface ExtendedRouteDefinition {
path: string;
name: string | undefined;
component: React.ComponentType;
exact?: boolean;
}
interface ExtendedServerRouteDefinition extends ExtendedRouteDefinition {
permission: string | string[] | null;
}
interface Routes {
account: ExtendedRouteDefinition[];
server: ExtendedServerRouteDefinition[];
}
export default {
account: [
{
path: '/example',
name: 'Example',
component: ExampleContainer,
},
],
server: [
{
path: '/example',
permission: null,
name: 'Example',
component: ExampleContainer,
},
],
} as Routes;

33
resources/scripts/routers/DashboardRouter.tsx
View file

@ -1,14 +1,9 @@
import React from 'react';
import { NavLink, Route, Switch } from 'react-router-dom';
import NavigationBar from '@/components/NavigationBar';
import DashboardContainer from '@/components/dashboard/DashboardContainer';
import { NotFound } from '@/components/elements/ScreenBlock';
import TransitionRouter from '@/TransitionRouter';
import SubNavigation from '@/components/elements/SubNavigation';
import { useLocation } from 'react-router';
import Spinner from '@/components/elements/Spinner';
import routes from '@/routers/routes';
import { NavigationLinks, NavigationRouter } from '@/blueprint/extends/routers/DashboardRouter';
import BeforeSubNavigation from '@/blueprint/components/Navigation/SubNavigation/BeforeSubNavigation';
import AdditionalAccountItems from '@/blueprint/components/Navigation/SubNavigation/AdditionalAccountItems';
import AfterSubNavigation from '@/blueprint/components/Navigation/SubNavigation/AfterSubNavigation';
@ -23,35 +18,13 @@ export default () => {
<SubNavigation>
<BeforeSubNavigation />
<div>
{routes.account
.filter((route) => !!route.name)
.map(({ path, name, exact = false }) => (
<NavLink key={path} to={`/account/${path}`.replace('//', '/')} exact={exact}>
{name}
</NavLink>
))}
<NavigationLinks />
<AdditionalAccountItems />
</div>
<AfterSubNavigation />
</SubNavigation>
)}
<TransitionRouter>
<React.Suspense fallback={<Spinner centered />}>
<Switch location={location}>
<Route path={'/'} exact>
<DashboardContainer />
</Route>
{routes.account.map(({ path, component: Component }) => (
<Route key={path} path={`/account/${path}`.replace('//', '/')} exact>
<Component />
</Route>
))}
<Route path={'*'}>
<NotFound />
</Route>
</Switch>
</React.Suspense>
</TransitionRouter>
<NavigationRouter />
</>
);
};

1
resources/scripts/routers/ServerRouter.tsx
View file

@ -21,6 +21,7 @@ import ConflictStateRenderer from '@/components/server/ConflictStateRenderer';
import PermissionRoute from '@/components/elements/PermissionRoute';
import routes from '@/routers/routes';
import BlueprintRouter from '@/blueprint/extends/routers/ServerRouter';
import BeforeSubNavigation from '@/blueprint/components/Navigation/SubNavigation/BeforeSubNavigation';
import AdditionalServerItems from '@/blueprint/components/Navigation/SubNavigation/AdditionalServerItems';
import AfterSubNavigation from '@/blueprint/components/Navigation/SubNavigation/AfterSubNavigation';