Skip to content
Snippets Groups Projects
Select Git revision
  • d471272c110b5c31a6487a3f7212023357fc0137
  • master default protected
  • esap-gui-auth
  • esap-gui-dev
4 results

Main.js

Blame
  • 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>