From 608dbd5e030eced5f02cb22cf5eed826024e3873 Mon Sep 17 00:00:00 2001
From: Martin Berka <martin.berka@radbuza.net>
Date: Fri, 2 Jun 2023 23:07:15 +0200
Subject: [PATCH] =?UTF-8?q?P=C5=99edvypln=C4=9Bn=C3=AD=20posledn=C4=9B=20z?=
 =?UTF-8?q?volen=C3=A9=20hodnoty?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md          |  1 +
 client/src/App.tsx | 19 +++++++++++++++++--
 2 files changed, 18 insertions(+), 2 deletions(-)

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>