Fix router logic to account for logged out users; closes #4085

Middleware was removed from the `/` route to redirect users without authentication, so now we need to handle this on the front-end properly.
This commit is contained in:
DaneEveritt 2022-05-28 13:32:35 -04:00
parent b051718afe
commit 3fceb588fb
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
5 changed files with 99 additions and 61 deletions

View file

@ -1,5 +1,5 @@
import React from 'react';
import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom';
import { NavLink, Route, Switch } from 'react-router-dom';
import AccountOverviewContainer from '@/components/dashboard/AccountOverviewContainer';
import NavigationBar from '@/components/NavigationBar';
import DashboardContainer from '@/components/dashboard/DashboardContainer';
@ -8,37 +8,42 @@ import { NotFound } from '@/components/elements/ScreenBlock';
import TransitionRouter from '@/TransitionRouter';
import SubNavigation from '@/components/elements/SubNavigation';
import AccountSSHContainer from '@/components/dashboard/ssh/AccountSSHContainer';
import { useLocation } from 'react-router';
export default ({ location }: RouteComponentProps) => (
<>
<NavigationBar/>
{location.pathname.startsWith('/account') &&
<SubNavigation>
<div>
<NavLink to={'/account'} exact>Settings</NavLink>
<NavLink to={'/account/api'}>API Credentials</NavLink>
<NavLink to={'/account/ssh'}>SSH Keys</NavLink>
</div>
</SubNavigation>
}
<TransitionRouter>
<Switch location={location}>
<Route path={'/'} exact>
<DashboardContainer/>
</Route>
<Route path={'/account'} exact>
<AccountOverviewContainer/>
</Route>
<Route path={'/account/api'} exact>
<AccountApiContainer/>
</Route>
<Route path={'/account/ssh'} exact>
<AccountSSHContainer/>
</Route>
<Route path={'*'}>
<NotFound/>
</Route>
</Switch>
</TransitionRouter>
</>
);
export default () => {
const location = useLocation();
return (
<>
<NavigationBar/>
{location.pathname.startsWith('/account') &&
<SubNavigation>
<div>
<NavLink to={'/account'} exact>Settings</NavLink>
<NavLink to={'/account/api'}>API Credentials</NavLink>
<NavLink to={'/account/ssh'}>SSH Keys</NavLink>
</div>
</SubNavigation>
}
<TransitionRouter>
<Switch location={location}>
<Route path={'/'} exact>
<DashboardContainer/>
</Route>
<Route path={'/account'} exact>
<AccountOverviewContainer/>
</Route>
<Route path={'/account/api'} exact>
<AccountApiContainer/>
</Route>
<Route path={'/account/ssh'} exact>
<AccountSSHContainer/>
</Route>
<Route path={'*'}>
<NotFound/>
</Route>
</Switch>
</TransitionRouter>
</>
);
};