App.js

import React, { useContext, useEffect } from 'react';
import Home from './Pages/Home';
import Search from './Pages/Search'
import Header from './Components/Header'
import EcFooter from './Components/EcFooter';
import GNUAGPLfooter from './Components/AGPLFooter';
import UserPage from './Pages/UserPage';
import ResourcePage from './Pages/ResourcePage';
import {BrowserRouter, Switch, Route} from 'react-router-dom';
import { Store } from './Store'

export default function App(){
  // eslint-disable-next-line
  const { state, dispatch } = useContext(Store)

  useEffect(()=>{
      dispatch({
        type: 'WINDOW_SIZE',
        innerWindow: {
          width: window.innerWidth,
          height: window.innerHeight
        }
      })
  },[])

  useEffect(()=>{
    const setWindowSize = () => {
      dispatch({
        type: 'WINDOW_SIZE',
        innerWindow: {
          width: window.innerWidth,
          height: window.innerHeight
        }
      })
    }

    window.addEventListener('resize',setWindowSize)

    return () => window.removeEventListener('resize',setWindowSize)
  },[window.innerWidth,window.innerHeight])

  return(
    <BrowserRouter>
      <Header />
      <div style={{backgroundImage: "linear-gradient(to right,#ff7f00,#e81f4f,#673ab7,#00bcd4)", height:"5px"}}></div>
      <Switch>
        <Route path="/" exact={true} component={Home}/>
        <Route path="/busca" component={Search} />
        <Route path="/usuario" component={UserPage} />
        <Route path="/recurso" component={ResourcePage}/>
      </Switch>
      <EcFooter/>
      <GNUAGPLfooter/>
    </BrowserRouter>
  )
}