diff --git a/README.md b/README.md index 1324338..e310c15 100644 --- a/README.md +++ b/README.md @@ -7,6 +7,7 @@ Server je v adresáři /server, client v adresáři /client obojí lze spustit p ### `yarn start` ## TODO +- Minimálně v klientovi nefunguje správně eslint - neřve, když chybí závislosti v useEffect - Popsat Food API, nginx - Popsat spuštění pro vývoj - Vyndat URL na Food API do .env diff --git a/client/src/App.tsx b/client/src/App.tsx index f4f11cf..dbfd5c6 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,4 +1,4 @@ -import React, { useContext, useEffect, useState } from 'react'; +import React, { useCallback, useContext, useEffect, useRef, useState } from 'react'; import 'bootstrap/dist/css/bootstrap.min.css'; import { EVENT_DISCONNECT, EVENT_MESSAGE, SocketContext } from './context/socket'; import { getData, getFood, updateChoice } from './Api'; @@ -18,6 +18,7 @@ function App() { const [food, setFood] = useState<any>(); // const [pizzy, setPizzy] = useState(); const socket = useContext(SocketContext); + const choiceRef = useRef<HTMLSelectElement>(null); // Prvotní načtení aktuálního stavu useEffect(() => { @@ -55,6 +56,20 @@ function App() { } }, [socket]); + useEffect(() => { + if (!auth || !auth.login) { + return + } + // TODO tohle občas náhodně nezafunguje, nutno přepsat, viz https://medium.com/@teh_builder/ref-objects-inside-useeffect-hooks-eb7c15198780 + if (data?.choices && choiceRef.current) { + for (let entry of Object.entries(data.choices)) { + if (entry[1].includes(auth.login)) { + choiceRef.current.value = Object.values(Locations)[entry[0]] + } + } + } + }, [auth?.login, data?.choices, choiceRef?.current]) + const changeChoice = async (event: React.ChangeEvent<HTMLSelectElement>) => { const index = Object.values(Locations).indexOf(event.target.value as unknown as Locations); if (auth?.login) { @@ -107,7 +122,7 @@ function App() { <div className='content-wrapper'> <div className='content'> <p>Jak to dnes vidíš s obědem?</p> - <Form.Select onChange={changeChoice}> + <Form.Select ref={choiceRef} onChange={changeChoice}> <option></option> <option value={Locations.SLADOVNICKA}>Sladovnická</option> <option value={Locations.UMOTLIKU}>U Motlíků</option>