Select Git revision
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
Main.js 2.35 KiB
import React, {useState, useEffect } from 'react';
import '../App.css';
import { get_backend_url } from '../utils/web'
import { useGlobalReducer } from '../Store';
import { useFetchDataSources} from '../hooks/useFetchDataSources';
import { NavigationBar } from './NavigationBar';
import DataSourcesPage from '../routes/datasources/DataSourcesPage';
import { About } from './About';
import {
BrowserRouter as Router,
Switch,
Route,
useParams
} from "react-router-dom";
// This site has multiple pages, all of which are rendered
// dynamically in the browser (not server rendered).
//
// Although the page does not ever refresh, notice how
// React Router keeps the URL up to date as you navigate
// through the site. This preserves the browser history,
// making sure things like the back button and bookmarks
// work properly.
function Main () {
// use global state
const [ my_state , my_dispatch] = useGlobalReducer()
// a timer is used for a 60 second polling of the data.
const [timer, setTimer] = useState(undefined)
useFetchDataSources(get_backend_url("/adex-api/datasources"),{onMount:true})
return (
// basename defines which path is is added before the routing urls.
<Router basename="adex">
<div>
<NavigationBar/>
{/*
A <Switch> looks through all its children <Route>
elements and renders the first one whose path
matches the current URL. Use a <Switch> any time
you have multiple routes, but you want only one
of them to render at a time
*/}
<Switch>
<Route exact path="/">
<DataSourcesPage />
</Route>
<Route path="/lofar">
<About />
</Route>
<Route path="/wsrt">
<About />
</Route>
<Route path="/apertif">
<About />
</Route>