Implement public/private routing

src/screens/App.js

@@ -1,51 +0,0 @@
-import React from 'react';
-import 'rsuite/lib/styles/index.less';
-import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
-
-import Dashboard from './Dashboard';
-import Schedule from './Schedule/Schedule';
-import Availability from './Availability/Availability';
-import Invite from './Invite/Invite';
-import Login from './Login';
-import Register from './Register';
-
-const titles = {
-	schedule: 'Schedule a meeting',
-	invite: 'Invite participants',
-	availability: 'Add your availability',
-	confirm: 'Confirm meeting date',
-	dashboard: 'Dashboard',
-	login: 'Login',
-	register: 'Register',
-	settings: 'Settings',
-};
-
-export default function App() {
-	return (
-		<Router>
-			<Switch>
-				<Route path='/' exact>
-					<Login title={titles.login} />
-				</Route>
-				<Route path='/schedule'>
-					<Schedule title={titles.schedule} />
-				</Route>
-				<Route path='/invite'>
-					<Invite title={titles.invite} />
-				</Route>
-				<Route path='/availability'>
-					<Availability title={titles.availability} />
-				</Route>
-				<Route path='/dashboard'>
-					<Dashboard title={titles.dashboard} />
-				</Route>
-				<Route path='/login'>
-					<Login title={titles.login} />
-				</Route>
-				<Route path='/register'>
-					<Register title={titles.register} />
-				</Route>
-			</Switch>
-		</Router>
-	);
-}

src/screens/Availability/Availability.js

@@ -17,7 +17,7 @@ import IntervalSelector from '../../components/Interval/IntervalSelector';
 
 import './Availability.less';
 
-export default function Availability({ title }) {
+export default function Availability() {
 	const [availability, setAvailability] = useState([...availabilityList]);
 
 	const handleClear = () => {
@@ -36,7 +36,7 @@ export default function Availability({ title }) {
 
 	return (
 		<>
-			<NavBar title={title} />
+			<NavBar title='Add your availability' />
 			<Panel style={containerStyle}>
 				<Form className={'av-container'}>
 					<div className={'av-details'}>

src/screens/Invite/Invite.js

@@ -6,7 +6,7 @@ import { Panel, Form, Button, ButtonGroup, Message, TagPicker } from 'rsuite';
 import NavBar from '../../components/Navbar/NavBar';
 import './Invite.less';
 
-export default function Invite({ title }) {
+export default function Invite() {
 	const [participants, setParticipants] = useState([]);
 	const [contactDropdown, setContactDropdown] = useState([]);
 
@@ -63,7 +63,7 @@ export default function Invite({ title }) {
 
 	return (
 		<>
-			<NavBar title={title} />
+			<NavBar title='Invite participants' />
 			<Panel style={containerStyle}>
 				<Form className={'av-container'}>
 					<div className={'interval-selector'}>

src/screens/Login.js

@@ -14,7 +14,7 @@ import {
 import { setUserSession } from '../utils/common';
 import NavBar from './../components/Navbar/NavBar';
 
-export default function Login({ title }) {
+export default function Login() {
 	const history = useHistory();
 
 	const [error, setError] = useState(false);
@@ -46,7 +46,7 @@ export default function Login({ title }) {
 
 	return (
 		<>
-			<NavBar title={title} />
+			<NavBar title='Login' />
 			<Panel bordered style={boxStyle}>
 				{error && <Message type='error' description={error} />}
 				<Form>

src/screens/Register.js

@@ -16,10 +16,10 @@ const boxStyle = {
 	padding: '1rem',
 };
 
-export default function Register({ title }) {
+export default function Register() {
 	return (
 		<>
-			<NavBar title={title} />
+			<NavBar title='Register' />
 			<Panel bordered style={boxStyle}>
 				<Form>
 					<FormGroup>

src/screens/Schedule/Schedule.js

@@ -21,7 +21,7 @@ import SelectedDates from '../../components/Schedule/SelectedDates';
 
 import './Schedule.less';
 
-export default function Schedule({ title }) {
+export default function Schedule() {
 	const [eventsList, setEventsList] = useState([]);
 	const [datesList, setDatesList] = useState(eventsToDates(eventsList));
 
@@ -117,7 +117,7 @@ export default function Schedule({ title }) {
 
 	return (
 		<>
-			<NavBar title={title} />
+			<NavBar title='Schedule a meeting' />
 			<Panel style={containerStyle}>
 				<Form className={'meeting-container'}>
 					<div className={'meeting-info'}>