ADMIN get all hotel, add hotel for user

src/components/HotelContext.jsx

@@ -262,8 +262,6 @@ export function HotelProvider({ accessToken, children, resClientId}) {
 
   // --- WS DISPATCH MESSAGE ----
 
-
-
   function handleWsMessage(msg) {
     console.log("websocket message is :" + msg.event_type, typeof msg.event_type);
   switch (msg.event_type) {
@@ -290,9 +288,6 @@ export function HotelProvider({ accessToken, children, resClientId}) {
   }
 }
 
-
-
-
  // --- ADMIN PORTAL ----
 
  function registerUser(username,password,hotel_ids, displayname) {
@@ -307,14 +302,46 @@ export function HotelProvider({ accessToken, children, resClientId}) {
   console.log("Reg")
 
   const res = fetch(`${API_BASE}/auth/register`, {
-    method: "PUT",
+      method: "PUT",
-    headers: {"Content-Type": "application/json"},
+      headers: {"Content-Type": "application/json"},
-    body: JSON.stringify(payload),
+      body: JSON.stringify(payload),
-  }
+    }
   )
  
  }
 
+async function getHotelList() {
+  
+    const res = await fetch(`${API_BASE}/auth/get_hotels`,
+      {
+        method: "GET",
+        headers: {"Content-Type": "application/json"},
+      }
+    )
+
+    const result = await res.json();
+    console.log("all result " + result);
+    return result;
+
+}
+
+async function addHotelUser(user_id,hotel_ids) {
+
+  const payload = {
+    user_id: parseInt(user_id),
+    hotel_ids,
+  } 
+
+  const res = await fetch(`${API_BASE}/auth/add_hotel_user`,
+    {
+      method: "PUT",
+      headers: {"Content-Type": "application/json"},
+      body: JSON.stringify(payload),
+
+    }
+  )
+
+}
 
 
 
@@ -336,7 +363,7 @@ export function HotelProvider({ accessToken, children, resClientId}) {
       setConversations(convData);
       setUsers(usersData);
 
-      
+      //getHotelList();
 
     }
     
@@ -352,38 +379,38 @@ export function HotelProvider({ accessToken, children, resClientId}) {
   preloadMessages(conversations);
 }, [conversations]);
 
-    useEffect(() => {
+  useEffect(() => {
-  //if (!accessTokenSingle || !clientId) return;
+    //if (!accessTokenSingle || !clientId) return;
 
-  const ws = new WebSocket(
+    const ws = new WebSocket(
-    `http://localhost:7080/auth/ws/${accessTokenSingle}`
+      `http://localhost:7080/auth/ws/${accessTokenSingle}`
-  );
+    );
 
-  wsRef.current = ws;
+    wsRef.current = ws;
 
-  ws.onopen = () => {
+    ws.onopen = () => {
-    console.log("WS connected");
+      console.log("WS connected");
-  };
+    };
 
-  ws.onmessage = (event) => {
+    ws.onmessage = (event) => {
-    const msg = JSON.parse(event.data);
+      const msg = JSON.parse(event.data);
-    console.log("WS :", msg);
+      console.log("WS :", msg);
 
-    handleWsMessage(msg);
+      handleWsMessage(msg);
-  };
+    };
 
-  ws.onerror = (err) => {
+    ws.onerror = (err) => {
-    console.error("WS error", err);
+      console.error("WS error", err);
-  };
+    };
 
-  ws.onclose = () => {
+    ws.onclose = () => {
-    console.log("WS disconnected");
+      console.log("WS disconnected");
-  };
+    };
 
-  return () => {
+    return () => {
-    ws.close();
+      ws.close();
-  };
+    };
-}, [accessTokenSingle]);
+  }, [accessTokenSingle]);
 
 
 
@@ -403,7 +430,9 @@ export function HotelProvider({ accessToken, children, resClientId}) {
         addUserToConv, createConversation,
         fetchHotelInventory, updateItemAmount, createItem,
         
-        registerUser
+        registerUser,
+        getHotelList, addHotelUser,
+
       }}
     >
       {children}

src/components/widget/adminWidget.jsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 import { useHotel } from "../HotelContext";
 
@@ -7,58 +7,122 @@ export default function AdminWidget() {
 
     const [username, setUserName] = useState("");
     const [password, setPassword] = useState("");
+    
     const [hotel_ids, setHotelIds] = useState([]);
     const [display_name, setDisplayName] = useState("");
     
-    const {
+    const [allHotelsList, setAllHotelsList] = useState([]);
-        registerUser
+    const [addHotelSelected, setAddHotelSelected] = useState([])
-    } = useHotel()
+    const [addHotelUserId, setAddHotelUserId] = useState("0");
 
+    const { registerUser, getHotelList, addHotelUser} = useHotel();
 
     const createUser = (username, password, hotel_ids, display_name) => {
-
         registerUser(username, password, hotel_ids, display_name);
-
     }
+    //console.log(addHotelSelected);
+    
+    useEffect(() => {
+        
+        const loadHotels = async () => {
+            const hotels = await getHotelList();
+            setAllHotelsList(hotels);
+        }
+
+        loadHotels();
+        console.log("addhotel collected : " + allHotelsList)
+    }, [] );
+    
+    const toggleHotel = (id) => {
+    setAddHotelSelected(prev =>
+            prev.includes(id)
+            ? prev.filter(hotelId => hotelId !== id)
+            : [...prev, id]
+        );
+    };
+
+    function submit() {
+        
+        addHotelUser(addHotelSelected, addHotelUserId );
+        setAddHotelUserId("");
+    };
 
 
     return(
 
         <div className="adminWidget">
-            <input 
+            <div className="CreateUserDiv">
-            value={username}
+                <input 
-            onChange={e => setUserName(e.target.value)}
+                value={username}
-            placeholder="NomDeCompte"
+                onChange={e => setUserName(e.target.value)}
-            type="text" />
+                placeholder="NomDeCompte"
+                type="text" />
 
-            <input 
+                <input 
-            value={password}
+                value={password}
-            onChange={e => setPassword(e.target.value)}
+                onChange={e => setPassword(e.target.value)}
-            placeholder="Mot de Passe"
+                placeholder="Mot de Passe"
-            type="text" />
+                type="text" />
 
-            <input 
+                <input 
-            value={display_name}
+                value={display_name}
-            onChange={e => setDisplayName(e.target.value)}
+                onChange={e => setDisplayName(e.target.value)}
-            placeholder="Nome afficher"
+                placeholder="Nome afficher"
-            type="text" />
+                type="text" />
                 
-            <input 
+                <input 
-            value={hotel_ids}
+                value={hotel_ids}
-            onChange={e => setHotelIds(e.target.value.split(",").map(Number))}
+                onChange={e => setHotelIds(e.target.value.split(",").map(Number))}
-            placeholder="hotels"
+                placeholder="hotels"
-            type="text" />
+                type="text" />
+
+                <button
+                    onClick={() =>
+                        registerUser(username, password, hotel_ids, display_name)
+                    }
+                >
+                    Créer l'utilisateur
+                </button>
+            </div>
+
+            <div className="addHotelUser">
+                <div className="hotels">
+                    {allHotelsList.map(hotel => (
+                        <HotelCard
+                        key={hotel.id}
+                        id={hotel.id}
+                        hotel_name={hotel.hotel_name}
+                        checked={addHotelSelected.includes(hotel.id)}
+                        onToggle={toggleHotel}
+                        />                            
+                    ))}
+                </div>
+                <input type="text" 
+                    defaultValue={""}
+                    value={addHotelUserId}
+                    autoFocus
+                    onChange={e => setAddHotelUserId(e.target.value)}
+                    onKeyDown={e => e.key === "Enter" && submit() }
+                />    
+                <button onClick={() => addHotelUser(addHotelUserId ,addHotelSelected)}>send</button>
+
+            </div>
  
-            <button
-                onClick={() =>
-                    registerUser(username, password, hotel_ids, display_name)
-                }
-            >
-                Créer l'utilisateur
-            </button>
         </div>
-
     )
-
+}
-
+
+function HotelCard({ id, hotel_name, checked, onToggle }) {
+    return (
+        <div className="hotelCard">
+            <label>
+                <input
+                    type="checkbox"
+                    checked={checked}
+                    onChange={() => onToggle(id)}
+                />
+                <strong>{hotel_name}</strong> (id: {id})
+            </label>
+        </div>
+    );
 }

src/components/widget/roomWidget.jsx

@@ -20,6 +20,8 @@ export default function RoomWidget({ roomlist }) {
 
 function RoomCard({ number, status ,id}) {
   
+
+  //FIXME: this shouldn't use hotel context, instead : set the state once on load
   const { updateRoomStatus } = useHotel();
   const [editing, setEdtiting] = useState(false);
   const [value, SetValue] = useState(status);