From d20a3b4b0b7e6aaa13f4041fcbfa1f99c705f526 Mon Sep 17 00:00:00 2001 From: Justin Campbell Date: Fri, 13 Nov 2020 15:24:48 -0500 Subject: [PATCH] Update app entrypoint for auth routing --- src/App.js | 136 ++++++----------------------------------------------- 1 file changed, 14 insertions(+), 122 deletions(-) diff --git a/src/App.js b/src/App.js index 6c08ecf..c410707 100644 --- a/src/App.js +++ b/src/App.js @@ -1,134 +1,26 @@ -import React, { useState, useEffect } from "react"; +import React, { useState } from "react"; import { ThemeProvider } from "@material-ui/core/styles"; -import { Box, makeStyles, Paper } from "@material-ui/core"; -import { Route } from "react-router-dom"; -import clsx from "clsx"; import webqueueTheme from "./theme"; -import ItemTableAppBar from "./components/ItemTableAppBar/"; -import ItemTable from "./components/ItemTable/"; -import ItemViewAppBar from "./components/ItemViewAppBar/"; -import ItemView from "./components/ItemView/"; -import QueueSelector from "./components/QueueSelector/"; +import { Switch, Route } from "react-router-dom"; +import PrivateRoute from "./components/PrivateRoute/"; +import AppView from "./components/AppView/"; +import LoginForm from "./components/LoginForm/"; function App() { const [darkMode, setDarkMode] = useState(false); - const [activeItem, setActiveItem] = useState({}); - const [sidebarOpen, setSidebarOpen] = useState(false); - const [queues, setQueues] = useState([]); - const [items, setItems] = useState([]); - const [selectedQueues, setSelectedQueues] = useState([]); - const [queueCounts, setQueueCounts] = useState([]); - - useEffect( _ => { - async function getQueues(){ - if (selectedQueues.length > 0){ - let queuesToLoad = ""; - - for (let selectedQueue of selectedQueues){ - queuesToLoad += `+${selectedQueue.name}`; - } - - const apiResponse = await fetch(`/api/${queuesToLoad}`); - const queueJson = await apiResponse.json(); - setQueues(queueJson); - } else { - setQueues([]) - } - } - getQueues(); - }, [selectedQueues]); - - useEffect( _ => { - let tempItems = []; - for (let queue of queues){ - tempItems = tempItems.concat(queue.items); - } - setItems(tempItems); - }, [queues]); - - useEffect( _ => { - async function getQueueCounts(){ - const apiResponse = await fetch(`/api/get_queues`); - const queueCountJson = await apiResponse.json(); - setQueueCounts(queueCountJson); - }; - getQueueCounts(); - return _ => setQueueCounts([]); - }, [selectedQueues]); const theme = webqueueTheme(darkMode); - const transitionWidth = theme.transitions.create(["width"], { - duration: theme.transitions.duration.enteringScreen, - easing: theme.transitions.easing.easeInOut - }); - const useStyles = makeStyles({ - "leftCol": { - overflow: "auto", - width: "100vw", - height: "100vh", - transition: transitionWidth, - }, - "rightCol": { - overflow: "auto", - width: "0", - height: "100vh", - transition: transitionWidth, - scrollbarWidth: 0, - }, - "rightColShift": { - overflowY: "auto", - width: "100vw", - flexShrink: "0", - transition: transitionWidth - }, - [theme.breakpoints.up("md")]: { - "rightColShift": { - width: "40vw", - } - }, - }); - const classes = useStyles(); - - return ( + return ( - - - - - - console.log("Clicked!") }/> - - - - {items.length === 0 ? null : - { - const item = items.find((item) => { - return item.queue === match.params.queue && item.number === Number(match.params.number); - }); - - if (item === undefined) { - return ( - - ); - } - - setActiveItem(item); - - return ( - <> - - - - ); - } - } - /> - } - - + + + + + + + + ); }