App.js

/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana

This file is part of Plataforma Integrada MEC.

Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/

import React, { useContext, useEffect, useState } from "react";
import Home from "./Pages/HomeFunction";
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 UserTerms from "./Pages/UserTerms";
import Contact from "./Pages/Contact";
import Teste from "./Pages/Teste";
import AboutPage from "./Pages/AboutPage";
import HelpCenter from "./Pages/HelpCenter";
import TabResoursePub from "./Pages/TabsHelp/TabResoursePub";
import TabResourseFind from "./Pages/TabsHelp/TabResourseFind";
import TabNetPart from "./Pages/TabsHelp/TabNetPart";
import TabManageAc from "./Pages/TabsHelp/TabManageAc";
import PasswordRecoveryPage from "./Pages/PasswordRecoveryPage.js";
import PageProfessor from "./Pages/PageProfessor.js";
import ResourcePage from "./Pages/ResourcePage";
import { BrowserRouter, Switch, Route, Link } from "react-router-dom";
import { Store } from "./Store";
import TermsPage from "./Pages/TermsPage.js";
import PublicationPermissionsPage from "./Pages/PublicationPermissionsPage.js";
import TabPlataformaMEC from "./Pages/TabsHelp/TabPlataformaMEC";
import ItemStore from "./Pages/ItemStore.js";
import EditProfilePage from "./Pages/EditProfilePage.js";
import PublicUserPage from "./Pages/PublicUserPage.js";
import UploadPage from "./Pages/UploadPage.js";
import EditLearningObjectPage from "./Pages/EditLearningObjectPage.js";
import SiteMap from "./Pages/SiteMap";
import Accessibility from "./Pages/Accessibility";
import CollectionPage from "./Pages/CollectionPage.js";
import FormationMaterialPage from "./Pages/FormationMaterialPage.js";
import FormationMaterialIframe from "./Pages/FormationMaterialIframe.js";
import MaterialPage from "./Pages/MaterialPage";

//material ui
import { Tab, Tabs } from "@material-ui/core";

//admin
import { makeStyles } from "@material-ui/core/styles";
import DisplayIcon from "./Admin/Components/Components/DisplayIcon";
import NoteVariables from "./Admin/Pages/Pages/SubPages/NoteVariables";
import Institution from "./Admin/Pages/Pages/SubPages/Institutions";
import SendEmail from "./Admin/Pages/Pages/SubPages/SendEmail";
import Inframe from "./Admin/Pages/Pages/SubPages/Inframe";
import Languages from "./Admin/Pages/Pages/SubPages/Languages";
import Activity from "./Admin/Pages/Pages/SubPages/Activity";
import InstitutionCard from "./Admin/Components/Components/DataCards/InstitutionsCard";
import InstitutionsInput from "./Admin/Components/Components/Inputs/IntitutionsInputs";
import CreateInstitution from "./Admin/Components/Components/Inputs/CreateInstitution";
import NoteVarCard from "./Admin/Components/Components/DataCards/NoteVarCard";
import NoteVarInputs from "./Admin/Components/Components/Inputs/NoteVarInputs";
import EditLanguage from "./Admin/Components/Components/Inputs/EditLanguage";
import CreateLanguage from "./Admin/Components/Components/Inputs/CreateLanguage";
import ActivityCard from "./Admin/Components/Components/DataCards/ActivityCard";
import CommunityQuestions from "./Admin/Pages/Pages/SubPages/CommunityQuestions";
import CommunityCard from "./Admin/Components/Components/DataCards/CommunityQuestionCard";
import Collections from "./Admin/Pages/Pages/SubPages/Collections";
import CollectionCard from "./Admin/Components/Components/DataCards/CollectionCard";
import EditCollection from "./Admin/Components/Components/Inputs/EditCollection";
import Ratings from "./Admin/Pages/Pages/SubPages/Rating";
import RatingCard from "./Admin/Components/Components/DataCards/RatingCard";
import EditRating from "./Admin/Components/Components/Inputs/EditRating";
import CreateRating from "./Admin/Components/Components/Inputs/CreateRating";
import Questions from "./Admin/Pages/Pages/SubPages/Questions";
import CreateQuestions from "./Admin/Components/Components/Inputs/CreateQuestion";
import EducationalObject from "./Admin/Pages/Pages/SubPages/EducationalObjects";
import EducationalObjectCard from "./Admin/Components/Components/DataCards/EducationalObjectsCard";
import EducationalObjectEdit from "./Admin/Components/Components/Inputs/EditEducationalObect";
import Complaints from "./Admin/Pages/Pages/SubPages/Complaints";
import ComplaintCard from "./Admin/Components/Components/DataCards/ComplaintsCard";
import AproveTeacher from "./Admin/Pages/Pages/SubPages/AproveTeacher";
import UserCard from "./Admin/Components/Components/DataCards/UserCard";
import EditUser from "./Admin/Components/Components/Inputs/EditUser";
import UserList from "./Admin/Pages/Pages/SubPages/Users";
import UserPermissions from "./Admin/Pages/Pages/SubPages/Permissions";
import EditRole from "./Admin/Components/Components/Inputs/EditRoles";
import CreateRole from "./Admin/Components/Components/Inputs/CreateRole";
import BlockedUser from "./Admin/Pages/Pages/SubPages/BlockedUsers";
import PropTypes from "prop-types";
import Typography from "@material-ui/core/Typography";
import Box from "@material-ui/core/Box";
import AppBar from "@material-ui/core/AppBar";

function TabPanel(props) {
  const { children, value, index, ...other } = props;

  return (
    <div
      role="tabpanel"
      hidden={value !== index}
      id={`nav-tabpanel-${index}`}
      aria-labelledby={`nav-tab-${index}`}
      {...other}
    >
      {value === index && (
        <Box p={3}>
          <Typography>{children}</Typography>
        </Box>
      )}
    </div>
  );
}

TabPanel.propTypes = {
  children: PropTypes.node,
  index: PropTypes.any.isRequired,
  value: PropTypes.any.isRequired,
};

function a11yProps(index) {
  return {
    id: `nav-tab-${index}`,
    "aria-controls": `nav-tabpanel-${index}`,
  };
}

const useStyles = makeStyles({
  list: {
    width: 250,
  },
  fullList: {
    width: "auto",
  },
});

export default function App() {
  // eslint-disable-next-line
  const classes = useStyles();

  const { dispatch } = useContext(Store);
  const [hideFooter, setHideFooter] = useState(false);
  const [value, setValue] = React.useState(0);

  const handleChange = (event, newValue) => {
    setValue(newValue);
  };

  useEffect(() => {
    setHideFooter(String(window.location.href).includes("iframe-colecao"));
  }, [window.location.href]);

  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 basename="/react">
      <Header />
      <div
        style={{
          backgroundImage:
            "linear-gradient(to right,#ff7f00,#e81f4f,#673ab7,#00bcd4)",
          height: "5px",
        }}
      ></div>
      <link
        href="https://fonts.googleapis.com/css?family=Kalam|Pompiere|Roboto&display=swap"
        rel="stylesheet"
      />
      <Switch>
        <Route path="/" exact={true} component={Home} />
        <Route path="/busca" component={Search} />
        <Route path="/perfil" component={UserPage} />
        <Route path="/editarperfil" component={EditProfilePage} />
        <Route path="/recurso/:recursoId" component={ResourcePage} />
        <Route path="/termos-publicar-recurso" component={TermsPage} />
        <Route path="/permission" component={PublicationPermissionsPage} />
        {/*<Route path="termos-de-uso#publicacoes-de-usuario" component={}*/}
        <Route path="/ajuda" component={HelpCenter} />
        <Route path="/contato" component={Contact} />
        <Route path="/termos" component={UserTerms} />
        <Route path="/teste" component={Teste} />
        <Route path="/sobre" component={AboutPage} />
        <Route path="/mapa-site" component={SiteMap} />
        <Route path="/acessibilidade" component={Accessibility} />
        <Route path="/publicando-recurso" component={TabResoursePub} />
        <Route path="/encontrando-recurso" component={TabResourseFind} />
        <Route path="/participando-da-rede" component={TabNetPart} />
        <Route path="/gerenciando-conta" component={TabManageAc} />
        <Route path="/plataforma-mec" component={TabPlataformaMEC} />
        <Route path="/recuperar-senha" component={PasswordRecoveryPage} />
        <Route path="/usuario-publico/:userId" component={PublicUserPage} />
        <Route
          path="/editar-recurso/:recursoId"
          component={EditLearningObjectPage}
        />
        <Route path="/professor" component={PageProfessor} />
        <Route path="/upload" component={UploadPage} />
        <Route path="/loja" component={ItemStore} />
        <Route path="/colecao-do-usuario/:id" component={CollectionPage} />
        <Route path="/colecao" component={FormationMaterialPage} />
        <Route path="/topico" component={FormationMaterialPage} />
        <Route path="/iframe-colecao" component={FormationMaterialIframe} />
        <Route path="/material-formacao" component={MaterialPage} />
        <div style={{ backgroundColor: "	#D3D3D3" }}>
          <AppBar position="static" color="default">
            <Tabs
              variant="scrollable"
              scrollButtons="on"
              value={value}
              onChange={handleChange}
              aria-label="nav tabs example"
            >
              <Tab
                label="Home"
                to="/admin/home"
                icon={<DisplayIcon i={0} />}
                component={Link}
                {...a11yProps(0)}
              />
              <Tab
                label="Coleções"
                to="/admin/Collections"
                icon={<DisplayIcon i={1} />}
                component={Link}
                {...a11yProps(1)}
              />
              <Tab
                label="Atividades"
                to="/admin/activities"
                icon={<DisplayIcon i={2} />}
                component={Link}
                {...a11yProps(2)}
              />
              <Tab
                label="Dúvidas da comunidade"
                to="/admin/CommunityQuestions"
                icon={<DisplayIcon i={3} />}
                component={Link}
                {...a11yProps(3)}
              />
              <Tab
                label="Instituição"
                to="/admin/intitutions"
                icon={<DisplayIcon i={4} />}
                component={Link}
                {...a11yProps(4)}
              />
              <Tab
                label="Linguagens"
                to="/admin/languages"
                icon={<DisplayIcon i={5} />}
                component={Link}
                {...a11yProps(5)}
              />
              <Tab
                label="Objetos educacionais"
                to="/admin/learningObjects"
                icon={<DisplayIcon i={6} />}
                component={Link}
                {...a11yProps(6)}
              />
              <Tab
                label="Rating"
                to="/admin/Ratings"
                icon={<DisplayIcon i={7} />}
                component={Link}
                {...a11yProps(7)}
              />
              <Tab
                label="Permissões do usuário"
                to="/admin/permissions"
                icon={<DisplayIcon i={8} />}
                component={Link}
                {...a11yProps(8)}
              />
              <Tab
                label="Variáveis de nota"
                to="/admin/noteVars"
                icon={<DisplayIcon i={9} />}
                component={Link}
                {...a11yProps(9)}
              />
              <Tab
                label="Perguntas da curadoria"
                to="/admin/Questions"
                icon={<DisplayIcon i={10} />}
                component={Link}
                {...a11yProps(10)}
              />
              <Tab
                label="Aprovação de professores"
                to="/admin/users/teacher_requests"
                icon={<DisplayIcon i={11} />}
                component={Link}
                {...a11yProps(11)}
              />
              <Tab
                label="Usuários"
                to="/admin/usersList"
                icon={<DisplayIcon i={12} />}
                component={Link}
                {...a11yProps(12)}
              />
              <Tab
                label="Usuários bloqueados"
                to="/admin/BlockedUsers"
                icon={<DisplayIcon i={13} />}
                component={Link}
                {...a11yProps(13)}
              />
              <Tab
                label="Denúncias"
                to="/admin/complaints"
                icon={<DisplayIcon i={14} />}
                component={Link}
                {...a11yProps(14)}
              />
              <Tab
                label="Enviar email"
                to="/admin/sendEmail/:email"
                icon={<DisplayIcon i={15} />}
                component={Link}
                {...a11yProps(15)}
              />
            </Tabs>
          </AppBar>
          <div style={{ padding: "2em" }}>
            <Route path="/admin/home" exact={true} component={Inframe} />
            <Route path="/admin/intitutions" component={Institution} />
            <Route path="/admin/institution/:id" component={InstitutionCard} />
            <Route
              path="/admin/institutionEdit/:id"
              component={InstitutionsInput}
            />
            <Route
              path="/admin/InstitutionCreate"
              component={CreateInstitution}
            />
            <Route path="/admin/noteVars" component={NoteVariables} />
            <Route path="/admin/noteVar/:id" component={NoteVarCard} />
            <Route path="/admin/noteVarEdit/:id" component={NoteVarInputs} />
            <Route path="/admin/languages" component={Languages} />
            <Route path="/admin/languageEdit/:id" component={EditLanguage} />
            <Route path="/admin/languageCreate" component={CreateLanguage} />
            <Route
              path="/admin/CommunityQuestions"
              component={CommunityQuestions}
            />
            <Route
              path="/admin/CommunityQuestion/:id"
              component={CommunityCard}
            />
            <Route path="/admin/Collections" component={Collections} />
            <Route path="/admin/Collection/:id" component={CollectionCard} />
            <Route
              path="/admin/EditCollection/:id"
              component={EditCollection}
            />
            <Route path="/admin/Ratings" component={Ratings} />
            <Route path="/admin/Rating/:id" component={RatingCard} />
            <Route path="/admin/EditRating/:id" component={EditRating} />
            <Route path="/admin/CreateRating" component={CreateRating} />
            <Route path="/admin/Questions" component={Questions} />
            <Route path="/admin/CreateQuestion" component={CreateQuestions} />
            <Route path="/admin/activities" component={Activity} />
            <Route path="/admin/activity/:id" component={ActivityCard} />
            <Route
              path="/admin/learningObjects"
              component={EducationalObject}
            />
            <Route
              path="/admin/learningObject/:id"
              component={EducationalObjectCard}
            />
            <Route
              path="/admin/learningObjectEdit/:id"
              component={EducationalObjectEdit}
            />
            <Route path="/admin/complaints" component={Complaints} />
            <Route path="/admin/complaint/:id" component={ComplaintCard} />
            <Route
              path="/admin/users/teacher_requests"
              component={AproveTeacher}
            />
            <Route path="/admin/usersList" component={UserList} />
            <Route path="/admin/user/:id" component={UserCard} />
            <Route path="/admin/EditUser/:id" component={EditUser} />
            <Route path="/admin/permissions" component={UserPermissions} />
            <Route path="/admin/EditPermissions/:id" component={EditRole} />
            <Route path="/admin/CreateRole" component={CreateRole} />
            <Route path="/admin/BlockedUsers" component={BlockedUser} />
            <Route path="/admin/sendEmail/:email" component={SendEmail} />
          </div>
        </div>
      </Switch>
      {!hideFooter && (
        <div>
          <EcFooter />
          <GNUAGPLfooter />
        </div>
      )}
    </BrowserRouter>
  );
}