diff --git a/client/src/App.tsx b/client/src/App.tsx index 429313ae1af999aa9d4e6de2d20b7afe3cb05b18..73eb7e14f00af8969519c96b295eddff9a8d74b6 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,24 +1,23 @@ import { Suspense, lazy } from 'react'; import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'; -import { isLoggedIn } from 'adapters/api'; +import ProtectedRoute from 'components/helpers/Rerouters/ProtectedRoute'; +import LoginRoute from 'components/helpers/Rerouters/LoginRoute'; const Home = lazy(() => import('pages/Home')); const Login = lazy(() => import('pages/Login')); const Register = lazy(() => import('pages/Register')); const Tasks = lazy(() => import('pages/Tasks')); -const Navigation = lazy(() => import('components/ui/Navigation')); export default function App() { return ( <Router> <Suspense fallback={false}> - {isLoggedIn() && <Navigation />} <Switch> - {!isLoggedIn() && <Route path="/register" component={Register} />} - {!isLoggedIn() && <Route exact path="/" component={Home} />} - {!isLoggedIn() && <Route path="/" component={Login} />} - <Route path="/" component={Tasks} /> + <ProtectedRoute path="/tasks" component={Tasks} /> + <LoginRoute path="/login" component={Login} /> + <LoginRoute path="/register" component={Register} /> + <Route path="/" component={Home} /> </Switch> </Suspense> </Router> diff --git a/client/src/adapters/api.ts b/client/src/adapters/api.ts index 929c441a0d606cc634e5f0e8a308b5ebbc788afe..28227040739216551352419a16fb0f27020e02e7 100644 --- a/client/src/adapters/api.ts +++ b/client/src/adapters/api.ts @@ -1 +1 @@ -export const isLoggedIn = (): boolean => false; +export const isLoggedIn = (): boolean => true; diff --git a/client/src/components/helpers/Rerouters/LoginRoute.tsx b/client/src/components/helpers/Rerouters/LoginRoute.tsx new file mode 100644 index 0000000000000000000000000000000000000000..56de5692595ad31d6bddc743d29bb81fa2c073e0 --- /dev/null +++ b/client/src/components/helpers/Rerouters/LoginRoute.tsx @@ -0,0 +1,19 @@ +import { ComponentType } from 'react'; +import { Redirect, Route } from 'react-router-dom'; +import { isLoggedIn } from 'adapters/api'; + +interface Props { + path: string, + exact?: boolean, + component: ComponentType<any> +} +export default function ProtectedRoute({ path, exact, component }: Props) { + if (!isLoggedIn()) { + return ( + <Route path={path} exact={exact} component={component} /> + ); + } + return ( + <Redirect to="/tasks"/> + ); +} \ No newline at end of file diff --git a/client/src/components/helpers/Rerouters/ProtectedRoute.tsx b/client/src/components/helpers/Rerouters/ProtectedRoute.tsx new file mode 100644 index 0000000000000000000000000000000000000000..1d9ff0078a61f77f72bb79270f5b49f46637a4ea --- /dev/null +++ b/client/src/components/helpers/Rerouters/ProtectedRoute.tsx @@ -0,0 +1,20 @@ + +import { ComponentType } from 'react'; +import { Redirect, Route } from 'react-router-dom'; +import { isLoggedIn } from 'adapters/api'; + +interface Props { + path: string, + exact?: boolean, + component: ComponentType<any> +} +export default function ProtectedRoute({ path, exact, component }: Props) { + if (isLoggedIn()) { + return ( + <Route path={path} exact={exact} component={component} /> + ); + } + return ( + <Redirect to="/login" /> + ); +} \ No newline at end of file diff --git a/client/src/pages/Register/register.scss b/client/src/pages/Register/register.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..8b137891791fe96927ad78e64b0aad7bded08bdc 100644 --- a/client/src/pages/Register/register.scss +++ b/client/src/pages/Register/register.scss @@ -0,0 +1 @@ + diff --git a/client/src/pages/Tasks/index.tsx b/client/src/pages/Tasks/index.tsx index 9978280ce48e8acc50cb8fbd858913143d108c66..83935611405705560f5860375c2d9acf8ef16d31 100644 --- a/client/src/pages/Tasks/index.tsx +++ b/client/src/pages/Tasks/index.tsx @@ -1,9 +1,13 @@ +import Navigation from 'components/ui/Navigation'; import './tasks.scss'; export default function Tasks() { return ( - <main> - <h1>Tasks</h1> - </main> + <div className="tasks-page"> + <Navigation /> + <main> + <h1>Tasks</h1> + </main> + </div> ); } \ No newline at end of file