Refresh menu, první část

client/src/components/Header.tsx

@@ -7,7 +7,8 @@ import FeaturesVotingModal from "./modals/FeaturesVotingModal";
 import PizzaCalculatorModal from "./modals/PizzaCalculatorModal";
 import { useNavigate } from "react-router";
 import { STATS_URL } from "../AppRoutes";
-import { FeatureRequest, getVotes, updateVote } from "../../../types";
+import { FeatureRequest, getVotes, refreshMenu, Restaurant, updateVote } from "../../../types";
+import RefreshMenuModal from "./modals/RefreshMenuModal";
 
 export default function Header() {
     const auth = useAuth();
@@ -16,6 +17,7 @@ export default function Header() {
     const [settingsModalOpen, setSettingsModalOpen] = useState<boolean>(false);
     const [votingModalOpen, setVotingModalOpen] = useState<boolean>(false);
     const [pizzaModalOpen, setPizzaModalOpen] = useState<boolean>(false);
+    const [refreshModalOpen, setRefreshModalOpen] = useState<boolean>(false);
     const [featureVotes, setFeatureVotes] = useState<FeatureRequest[] | undefined>([]);
 
     useEffect(() => {
@@ -38,6 +40,10 @@ export default function Header() {
         setPizzaModalOpen(false);
     }
 
+    const closeRefreshModal = () => {
+        setRefreshModalOpen(false);
+    }
+
     const isValidInteger = (str: string) => {
         str = str.trim();
         if (!str) {
@@ -107,6 +113,12 @@ export default function Header() {
         setFeatureVotes(votes);
     }
 
+    const handleRefreshMenu = async (restaurants: Restaurant[]) => {
+        if (restaurants.length > 0) {
+            await refreshMenu({ body: restaurants });
+        }
+    }
+
     return <Navbar variant='dark' expand="lg">
         <Navbar.Brand href="/">Luncher</Navbar.Brand>
         <Navbar.Toggle aria-controls="basic-navbar-nav" />
@@ -117,6 +129,7 @@ export default function Header() {
                     <NavDropdown.Item onClick={() => setVotingModalOpen(true)}>Hlasovat o nových funkcích</NavDropdown.Item>
                     <NavDropdown.Item onClick={() => setPizzaModalOpen(true)}>Pizza kalkulačka</NavDropdown.Item>
                     <NavDropdown.Item onClick={() => navigate(STATS_URL)}>Statistiky</NavDropdown.Item>
+                    <NavDropdown.Item onClick={() => setRefreshModalOpen(true)}>Přenačíst menu</NavDropdown.Item>
                     <NavDropdown.Divider />
                     <NavDropdown.Item onClick={auth?.logout}>Odhlásit se</NavDropdown.Item>
                 </NavDropdown>
@@ -125,5 +138,6 @@ export default function Header() {
         <SettingsModal isOpen={settingsModalOpen} onClose={closeSettingsModal} onSave={saveSettings} />
         <FeaturesVotingModal isOpen={votingModalOpen} onClose={closeVotingModal} onChange={saveFeatureVote} initialValues={featureVotes} />
         <PizzaCalculatorModal isOpen={pizzaModalOpen} onClose={closePizzaModal} />
+        <RefreshMenuModal isOpen={refreshModalOpen} onClose={closeRefreshModal} onSubmit={handleRefreshMenu} />
     </Navbar>
 }

client/src/components/modals/RefreshMenuModal.tsx

@@ -0,0 +1,53 @@
+import { Modal, Button, Form } from "react-bootstrap"
+import { Restaurant } from "../../../../types";
+import { getRestaurantName } from "../../enums";
+import { useState } from "react";
+
+type Props = {
+    isOpen: boolean,
+    onClose: () => void,
+    onSubmit: (restaurants: Restaurant[]) => void,
+}
+
+/** Modální dialog pro přenačtení menu jednotlivých podniků. */
+export default function RefreshMenuModal({ isOpen, onClose, onSubmit }: Readonly<Props>) {
+
+    const [restaurants, setRestaurants] = useState<Restaurant[]>([]);
+
+    const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        if (e.currentTarget.checked) {
+            setRestaurants([...restaurants, e.currentTarget.value as Restaurant]);
+        } else {
+            setRestaurants(restaurants.filter(restaurant => restaurant !== e.currentTarget.value as Restaurant));
+        }
+    }
+
+    return <Modal show={isOpen} onHide={onClose} size="lg">
+        <Modal.Header closeButton>
+            <Modal.Title>
+                Vyberte podniky k přenačtení menu
+                <p style={{ fontSize: '12px' }}>Menu lze přenačíst nejdříve 15 minut od poslední aktualizace</p>
+            </Modal.Title>
+        </Modal.Header>
+        <Modal.Body>
+            {(Object.keys(Restaurant) as Array<keyof typeof Restaurant>).map(key => {
+                return <Form.Check
+                    key={key}
+                    type='checkbox'
+                    id={key}
+                    label={getRestaurantName(key as Restaurant)}
+                    onChange={handleChange}
+                    value={key}
+                />
+            })}
+        </Modal.Body>
+        <Modal.Footer>
+            <Button variant="primary" onClick={() => onSubmit(restaurants)} disabled={restaurants.length === 0}>
+                Přenačíst
+            </Button>
+            <Button variant="secondary" onClick={onClose}>
+                Zrušit
+            </Button>
+        </Modal.Footer>
+    </Modal>
+}