Skip to content
Jump to bottom

Add useEffect for /api/get_queues and QueueSelector #112

Merged
merged 1 commit into from
Nov 3, 2020
Merged

Add useEffect for /api/get_queues and QueueSelector #112

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 12 additions & 1 deletion src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ function App() {
const [queues, setQueues] = useState([]);
const [items, setItems] = useState([]);
const [selectedQueues, setSelectedQueues] = useState([]);
const [queueCounts, setQueueCounts] = useState([]);

useEffect( _ => {
async function getQueues(){
Expand Down Expand Up @@ -45,6 +46,16 @@ function App() {
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,
Expand Down Expand Up @@ -85,7 +96,7 @@ function App() {

<Box className={classes.leftCol}>
<ItemTableAppBar title="webqueue2" setDarkMode={setDarkMode} />
<QueueSelector selectedQueues={selectedQueues} setSelectedQueues={setSelectedQueues} />
<QueueSelector queues={queueCounts} selectedQueues={selectedQueues} setSelectedQueues={setSelectedQueues} />
<ItemTable data={items} onRowClick={ _ => console.log("Clicked!") }/>
</Box>

Expand Down