From 79b7312896aa5153ac67e26946aa3bacaee9045e Mon Sep 17 00:00:00 2001 From: Dennis Brentjes Date: Sun, 5 Jun 2022 16:48:26 +0200 Subject: [PATCH] Fixes some React warnings. --- frontend/src/App.js | 10 +++++----- frontend/src/components/AdminPanel.jsx | 8 ++++---- frontend/src/components/Gamenight.jsx | 10 +++++----- frontend/src/components/Gamenights.jsx | 2 +- 4 files changed, 15 insertions(+), 15 deletions(-) diff --git a/frontend/src/App.js b/frontend/src/App.js index fca69ae..6384dff 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -1,5 +1,5 @@ import './App.css'; -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import MenuBar from './components/MenuBar'; import Login from './components/Login'; import Gamenights from './components/Gamenights'; @@ -68,20 +68,20 @@ function App() { setFlashData(data); }; - const refetchGamenights = () => { + const refetchGamenights = useCallback(() => { unpack_api_result(get_gamenights(user.jwt), setFlashData) .then(result => { if (result !== undefined) { setGamenights(result.gamenights); } }); - }; + }, [user]); useEffect(() => { if (appState === 'LoggedIn') { refetchGamenights() } - }, [appState]) + }, [appState, refetchGamenights]) useEffect(() => { if (appState === 'LoggedIn') { @@ -92,7 +92,7 @@ function App() { } }); } - }, [appState]) + }, [appState, user]) useEffect(() => { setUser(JSON.parse(localStorage.getItem(localStorageUserKey))); diff --git a/frontend/src/components/AdminPanel.jsx b/frontend/src/components/AdminPanel.jsx index 69b9a8e..750a37d 100644 --- a/frontend/src/components/AdminPanel.jsx +++ b/frontend/src/components/AdminPanel.jsx @@ -1,4 +1,4 @@ -import {useState, useEffect} from 'react'; +import {useState, useEffect, useCallback} from 'react'; import Checkbox from '@mui/material/Checkbox'; import Table from '@mui/material/Table'; import TableBody from '@mui/material/TableBody'; @@ -35,7 +35,7 @@ function AdminPanel(props) { setPage(0); }; - const refetchTokens = () => { + const refetchTokens = useCallback(() => { if(props.user !== null) { unpack_api_result(get_registration_tokens(props.user.jwt), props.setFlash) .then(result => { @@ -44,7 +44,7 @@ function AdminPanel(props) { } }); } - } + }, [props.setFlash, props.user]); const deleteToken = (id) => { if(props.user !== null) { @@ -75,7 +75,7 @@ function AdminPanel(props) { useEffect(() => { refetchTokens() - }, []) + }, [refetchTokens]) let columns = [ { diff --git a/frontend/src/components/Gamenight.jsx b/frontend/src/components/Gamenight.jsx index 9b037a3..7b54e65 100644 --- a/frontend/src/components/Gamenight.jsx +++ b/frontend/src/components/Gamenight.jsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import List from '@mui/material/List'; import ListItem from '@mui/material/ListItem'; import ListItemText from '@mui/material/ListItemText'; @@ -13,10 +13,10 @@ import {unpack_api_result, get_gamenight, patch_gamenight} from '../api/Api'; function Gamenight(props) { - const [dense, setDense] = useState(true); + const dense = true; const [gamenight, setGamenight] = useState(null); - const fetchGamenight = () => { + const fetchGamenight = useCallback(() => { if (props.user !== null) { unpack_api_result(get_gamenight(props.gamenightId, props.user.jwt), props.setFlash) .then(result => { @@ -25,9 +25,9 @@ function Gamenight(props) { } }); } - } + }, [props.gamenightId, props.user, props.setFlash]); - useEffect(fetchGamenight, []); + useEffect(fetchGamenight, [fetchGamenight]); let games = gamenight?.game_list.map(g => ( diff --git a/frontend/src/components/Gamenights.jsx b/frontend/src/components/Gamenights.jsx index a8c22c9..206b107 100644 --- a/frontend/src/components/Gamenights.jsx +++ b/frontend/src/components/Gamenights.jsx @@ -12,7 +12,7 @@ import AddGameNight from './AddGameNight'; import {delete_gamenight, unpack_api_result} from '../api/Api'; function Gamenights(props) { - const [dense, setDense] = React.useState(false); + const dense = true; const DeleteGamenight = (game_id) => { if (props.user !== null) {