Migrace klienta na OpenAPI

client/src/App.tsx

@@ -1,7 +1,6 @@
 import React, { useContext, useEffect, useMemo, useRef, useState, useCallback } from 'react';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import { EVENT_DISCONNECT, EVENT_MESSAGE, SocketContext } from './context/socket';
-import { addPizza, createPizzaDay, deletePizzaDay, finishDelivery, finishOrder, lockPizzaDay, removePizza, unlockPizzaDay, updatePizzaDayNote } from './api/PizzaDayApi';
 import { useAuth } from './context/auth';
 import Login from './Login';
 import { Alert, Button, Col, Form, Row, Table } from 'react-bootstrap';
@@ -16,15 +15,13 @@ import { useSettings } from './context/settings';
 import Footer from './components/Footer';
 import { faChainBroken, faChevronLeft, faChevronRight, faGear, faSatelliteDish, faSearch } from '@fortawesome/free-solid-svg-icons';
 import Loader from './components/Loader';
-import { getData, errorHandler, getQrUrl } from './api/Api';
-import { addChoice, removeChoices, removeChoice, changeDepartureTime, jdemeObed, updateNote } from './api/FoodApi';
 import { getHumanDateTime, isInTheFuture } from './Utils';
 import NoteModal from './components/modals/NoteModal';
 import { useEasterEgg } from './context/eggs';
-import { getImage } from './api/EasterEggApi';
 import { Link } from 'react-router';
 import { STATS_URL } from './AppRoutes';
-import { ClientData, Food, PizzaOrder, DepartureTime, PizzaDayState, Restaurant, RestaurantDayMenu, RestaurantDayMenuMap, LunchChoice, UserLunchChoice, PizzaVariant } from '../../types';
+import { ClientData, Food, PizzaOrder, DepartureTime, PizzaDayState, Restaurant, RestaurantDayMenu, RestaurantDayMenuMap, LunchChoice, UserLunchChoice, PizzaVariant, getData, getEasterEggImage, addPizza, removePizza, updatePizzaDayNote, createPizzaDay, deletePizzaDay, lockPizzaDay, unlockPizzaDay, finishOrder, finishDelivery, addChoice, jdemeObed, removeChoices, removeChoice, updateNote, changeDepartureTime } from '../../types';
+import { getLunchChoiceName } from './enums';
 
 const EVENT_CONNECT = "connect"
 
@@ -68,7 +65,8 @@ function App() {
     if (!auth?.login) {
       return
     }
-    getData().then(data => {
+    getData().then(response => {
+      const data = response.data
       if (data) {
         setData(data);
         setDayIndex(data.dayIndex);
@@ -85,9 +83,12 @@ function App() {
     if (!auth?.login) {
       return
     }
-    getData(dayIndex).then((data: ClientData) => {
+    getData({ query: { dayIndex: dayIndex } }).then(response => {
+      const data = response.data;
       setData(data);
-      setFood(data.menus);
+      if (data) {
+        setFood(data.menus);
+      }
     }).catch(e => {
       setFailure(true);
     })
@@ -142,10 +143,10 @@ function App() {
 
   useEffect(() => {
     if (choiceRef?.current?.value && choiceRef.current.value !== "") {
-      const locationKey = choiceRef.current.value as keyof typeof LunchChoice;
+      const locationKey = choiceRef.current.value as LunchChoice;
       const restaurantKey = Object.keys(Restaurant).indexOf(locationKey);
       if (restaurantKey > -1 && food) {
-        const restaurant = Object.keys(Restaurant)[restaurantKey] as keyof typeof Restaurant;
+        const restaurant = Object.keys(Restaurant)[restaurantKey] as Restaurant;
         setFoodChoiceList(food[restaurant]?.food);
         setClosed(food[restaurant]?.closed ?? false);
       } else {
@@ -177,9 +178,9 @@ function App() {
   // Stažení a nastavení easter egg obrázku
   useEffect(() => {
     if (auth?.login && easterEgg?.url && !eggImage) {
-      getImage(easterEgg.url).then(data => {
-        if (data) {
-          setEggImage(data);
+      getEasterEggImage({ path: { url: easterEgg.url } }).then(response => {
+        if (response.data) {
+          setEggImage(response.data);
           // Smazání obrázku z DOMu po animaci
           setTimeout(() => {
             if (eggRef?.current) {
@@ -191,18 +192,18 @@ function App() {
     }
   }, [auth?.login, easterEgg?.duration, easterEgg?.url, eggImage]);
 
-  const doAddClickFoodChoice = async (location: keyof typeof LunchChoice, foodIndex?: number) => {
+  const doAddClickFoodChoice = async (location: LunchChoice, foodIndex?: number) => {
     if (document.getSelection()?.type !== 'Range') { // pouze pokud se nejedná o výběr textu
       if (auth?.login) {
-        await errorHandler(() => addChoice(location, foodIndex, dayIndex));
+        await addChoice({ body: { locationKey: location, foodIndex, dayIndex } });
       }
     }
   }
 
   const doAddChoice = async (event: React.ChangeEvent<HTMLSelectElement>) => {
-    const locationKey = event.target.value as keyof typeof LunchChoice;
+    const locationKey = event.target.value as LunchChoice;
     if (auth?.login) {
-      await errorHandler(() => addChoice(locationKey, undefined, dayIndex));
+      await addChoice({ body: { locationKey, dayIndex } });
       if (foodChoiceRef.current?.value) {
         foodChoiceRef.current.value = "";
       }
@@ -217,16 +218,16 @@ function App() {
 
   const doAddFoodChoice = async (event: React.ChangeEvent<HTMLSelectElement>) => {
     if (event.target.value && foodChoiceList?.length && choiceRef.current?.value) {
-      const locationKey = choiceRef.current.value as keyof typeof LunchChoice;
+      const locationKey = choiceRef.current.value as LunchChoice;
       if (auth?.login) {
-        await errorHandler(() => addChoice(locationKey, Number(event.target.value), dayIndex));
+        await addChoice({ body: { locationKey, foodIndex: Number(event.target.value), dayIndex } });
       }
     }
   }
 
-  const doRemoveChoices = async (locationKey: keyof typeof LunchChoice) => {
+  const doRemoveChoices = async (locationKey: LunchChoice) => {
     if (auth?.login) {
-      await errorHandler(() => removeChoices(locationKey, dayIndex));
+      await removeChoices({ body: { locationKey, dayIndex } });
       // Vyresetujeme výběr, aby bylo jasné pro který případně vybíráme jídlo
       if (choiceRef?.current?.value) {
         choiceRef.current.value = "";
@@ -237,9 +238,9 @@ function App() {
     }
   }
 
-  const doRemoveFoodChoice = async (locationKey: keyof typeof LunchChoice, foodIndex: number) => {
+  const doRemoveFoodChoice = async (locationKey: LunchChoice, foodIndex: number) => {
     if (auth?.login) {
-      await errorHandler(() => removeChoice(locationKey, foodIndex, dayIndex));
+      await removeChoice({ body: { locationKey, foodIndex, dayIndex } });
       if (choiceRef?.current?.value) {
         choiceRef.current.value = "";
       }
@@ -251,7 +252,7 @@ function App() {
 
   const saveNote = async (note?: string) => {
     if (auth?.login) {
-      await errorHandler(() => updateNote(note, dayIndex));
+      await updateNote({ body: { note, dayIndex } });
       setNoteModalOpen(false);
     }
   }
@@ -281,12 +282,12 @@ function App() {
       const s = value.split('|');
       const pizzaIndex = Number.parseInt(s[0]);
       const pizzaSizeIndex = Number.parseInt(s[1]);
-      await addPizza(pizzaIndex, pizzaSizeIndex);
+      await addPizza({ body: { pizzaIndex, pizzaSizeIndex } });
     }
   }
 
   const handlePizzaDelete = async (pizzaOrder: PizzaVariant) => {
-    await removePizza(pizzaOrder);
+    await removePizza({ body: { pizzaOrder } });
   }
 
   const handlePizzaPoznamkaChange = async () => {
@@ -294,7 +295,7 @@ function App() {
       alert("Poznámka může mít maximálně 70 znaků");
       return;
     }
-    updatePizzaDayNote(pizzaPoznamkaRef.current?.value);
+    updatePizzaDayNote({ body: { note: pizzaPoznamkaRef.current?.value } });
   }
 
   // const addToCart = async () => {
@@ -323,7 +324,7 @@ function App() {
 
   const handleChangeDepartureTime = async (event: React.ChangeEvent<HTMLSelectElement>) => {
     if (foodChoiceList?.length && choiceRef.current?.value) {
-      await changeDepartureTime(event.target.value, dayIndex);
+      await changeDepartureTime({ body: { time: event.target.value as DepartureTime, dayIndex } });
     }
   }
 
@@ -341,7 +342,7 @@ function App() {
     }
   }
 
-  const renderFoodTable = (location: keyof typeof Restaurant, menu: RestaurantDayMenu) => {
+  const renderFoodTable = (location: Restaurant, menu: RestaurantDayMenu) => {
     let content;
     if (menu?.closed) {
       content = <h3>Zavřeno</h3>
@@ -363,7 +364,7 @@ function App() {
       content = <h3>Chyba načtení dat</h3>
     }
     return <Col md={12} lg={3} className='mt-3'>
-      <h3 style={{ cursor: 'pointer' }} onClick={() => doAddClickFoodChoice(location)}>{LunchChoice[location]}</h3>
+      <h3 style={{ cursor: 'pointer' }} onClick={() => doAddClickFoodChoice(location)}>{getLunchChoiceName(location)}</h3>
       {menu?.lastUpdate && <small>Poslední aktualizace: {getHumanDateTime(new Date(menu.lastUpdate))}</small>}
       {content}
     </Col>
@@ -439,10 +440,10 @@ function App() {
                   <option></option>
                   {Object.entries(LunchChoice)
                     .filter(entry => {
-                      const locationKey = entry[0] as keyof typeof Restaurant;
+                      const locationKey = entry[0] as Restaurant;
                       return !food[locationKey]?.closed;
                     })
-                    .map(entry => <option key={entry[0]} value={entry[0]}>{entry[1]}</option>)}
+                    .map(entry => <option key={entry[0]} value={entry[0]}>{getLunchChoiceName(entry[1])}</option>)}
                 </Form.Select>
                 <small>Je možné vybrat jen jednu možnost. Výběr jiné odstraní předchozí.</small>
                 {foodChoiceList && !closed && <>
@@ -466,8 +467,8 @@ function App() {
                 <Table bordered className='mt-5'>
                   <tbody>
                     {Object.keys(data.choices).map(key => {
-                      const locationKey = key as keyof typeof LunchChoice;
-                      const locationName = LunchChoice[locationKey];
+                      const locationKey = key as LunchChoice;
+                      const locationName = getLunchChoiceName(locationKey);
                       const loginObject = data.choices[locationKey];
                       if (!loginObject) {
                         return;
@@ -500,13 +501,13 @@ function App() {
                                         setNoteModalOpen(true);
                                       }} title='Upravit poznámku' className='action-icon' icon={faNoteSticky} />}
                                       {login === auth.login && canChangeChoice && <FontAwesomeIcon onClick={() => {
-                                        doRemoveChoices(key as keyof typeof LunchChoice);
+                                        doRemoveChoices(key as LunchChoice);
                                       }} title={`Odstranit volbu ${locationName}, včetně případných zvolených jídel`} className='action-icon' icon={faTrashCan} />}
                                     </td>
                                     {userChoices?.length && food ? <td>
                                       <ul>
                                         {userChoices?.map(foodIndex => {
-                                          const restaurantKey = key as keyof typeof Restaurant;
+                                          const restaurantKey = key as Restaurant;
                                           const foodName = food[restaurantKey]?.food?.[foodIndex].name;
                                           return <li key={foodIndex}>
                                             {foodName}
@@ -601,7 +602,7 @@ function App() {
                                 await lockPizzaDay();
                               }}>Vrátit do "uzamčeno"</Button>
                               <Button className='danger mb-3' style={{ marginLeft: '20px' }} title="Nastaví stav na 'Doručeno' - koncový stav." onClick={async () => {
-                                await finishDelivery(settings?.bankAccount, settings?.holderName);
+                                await finishDelivery({ body: { bankAccount: settings?.bankAccount, bankAccountHolder: settings?.holderName } });
                               }}>Doručeno</Button>
                             </div>
                           }
@@ -643,7 +644,7 @@ function App() {
                       data.pizzaDay.state === PizzaDayState.DELIVERED && myOrder?.hasQr ?
                         <div className='qr-code'>
                           <h3>QR platba</h3>
-                          <img src={getQrUrl(auth.login)} alt='QR kód' />
+                          <img src={`/api/qr?login=${auth.login}`} alt='QR kód' />
                         </div> : null
                     }
                   </div>