curiousroamers/src/client/Root.tsx

55 lines
1.1 KiB
TypeScript

import React, {useEffect, useState} from 'react';
import Navbar from './Navbar';
import Home from './Home';
import Blog from './Blog';
import About from './About';
import Contact from './Contact';
/**
* @return {jsx} The root component
*/
export default function Root() {
const [navbarStatus, setNavbarStatus] = useState('Home');
const [page, setPage] = useState(<Home setStatus={setNavbarStatus} />);
useEffect(() => {
if (navbarStatus == 'Home') {
setPage(<Home setStatus={setNavbarStatus} />);
} else if (navbarStatus == 'Blog') {
setPage(<Blog />);
} else if (navbarStatus == 'About') {
setPage(<About />);
} else if (navbarStatus == 'Contact') {
setPage(<Contact />);
}
}, [navbarStatus]);
return (
<React.Fragment>
<Navbar
setStatus={setNavbarStatus}
main={{
text: 'Curious Roamers',
status: 'Home',
}}
sub={[
{
text: 'Home',
status: 'Home',
}, {
text: 'Carnet de voyage',
status: 'Blog',
}, {
text: 'Qui sommes nous ?',
status: 'About',
}, {
text: 'Contact',
status: 'Contact',
},
]}
/>
{page}
</React.Fragment>
);
}