some css fix and websocket fix for item update

src/App.jsx

@@ -8,6 +8,8 @@ import { API_BASE } from './config.js'
 
 import Login from './components/login.jsx'
 import MainApp from './components/MainApp.jsx'
+import AdminWidget from './components/widget/adminWidget.jsx'
+
 
 export const ClientContext = createContext(null);
 
@@ -22,9 +24,8 @@ export default function App() {
   const [updateCurrentPassword, setUpdateCurrentPassword] = useState("");
   const [updateNewPassword, setUpdateNewPassword] = useState("");
 
-  const accessToken = localStorage.getItem("access_tokens");
-  const tokens = JSON.parse(accessToken)
-  const accessTokenSingle = tokens[0];
+
+  const [logMenuOpen, setLogMenuOpen] = useState(false)
 
 
   useEffect(() => {
@@ -60,6 +61,7 @@ async function checkAuth() {
   }
 }
 
+
 async function logoutUser() {
 
   try {
@@ -87,6 +89,7 @@ async function logoutUser() {
 }
 
 async function logoutAllSessions() {
+if (!accessTokenSingle) return;
 
   try {
      const res = await fetch(`${API_BASE}/auth/logout_all_devices`, {
@@ -113,10 +116,68 @@ async function logoutAllSessions() {
   }
 }
 
+function RegisterUser() {
+
+  let [username, setUserName] = useState("");
+  let [password, setPassword] = useState("");
+  let [displayName, setDisplayName] = useState("");
+
+  let hotel_ids = [1];
+
+  function registerUser(username, password, hotel_ids, displayname) {
+
+  const payload = {
+    username,
+    password,
+    hotel_ids,
+    displayname
+  } 
+
+  console.log("Reg")
+
+  const res = fetch(`${API_BASE}/auth/register`, {
+      method: "PUT",
+      headers: {"Content-Type": "application/json"},
+      body: JSON.stringify(payload),
+    }
+  )
+ 
+}
+
+  return(
+    <div className="CreateUserDiv">
+                <input 
+                value={username}
+                onChange={e => setUserName(e.target.value)}
+                placeholder="NomDeCompte"
+                type="text" />
+
+                <input 
+                value={password}
+                onChange={e => setPassword(e.target.value)}
+                placeholder="Mot de Passe"
+                type="text" />
+
+                <input 
+                value={displayName}
+                onChange={e => setDisplayName(e.target.value)}
+                placeholder="Nome afficher"
+                type="text" />
+                
+                <button
+                    onClick={() =>
+                        registerUser(username, password, hotel_ids, displayName)
+                    }
+                >
+                    Créer l'utilisateur
+                </button>
+          </div>
+  );
+
+}
 
 
-
-function updatePassword(e) {
+async function updatePassword(e) {
   e.preventDefault();
 
   //try
@@ -126,7 +187,7 @@ function updatePassword(e) {
     newpassword : updateNewPassword
   }
 
-  const res = fetch(`${API_BASE}/auth/update_password`, {
+  const res = await fetch(`${API_BASE}/auth/update_password`, {
           method: "PUT",
           headers: {
             "Content-Type": "application/json",
@@ -146,33 +207,46 @@ function updatePassword(e) {
 
 return (
   <>
-    <button onClick={logoutUser}>disconnect</button>
-    <button onClick={logoutAllSessions}>disconnect all session</button>
+          <button className="user-btn" onClick={() => setLogMenuOpen(o => !o)}>
+      ⚙️
+      </button>
 
-    <form onSubmit={updatePassword}>
-      <input
-        type="text"
-        placeholder="Username"
-        value={updateUsername}
-        onChange={(e) => setUpdateUsername(e.target.value)}
-      />
+    {logMenuOpen && (
+    <div className='log-menu'>  
+      <button onClick={logoutUser}>disconnect</button>
+      <button onClick={logoutAllSessions}>disconnect all session</button>
 
-      <input
-        type="text"
-        placeholder="MDP actuel"
-        value={updateCurrentPassword}
-        onChange={(e) => setUpdateCurrentPassword(e.target.value)}
-      />
+      <form onSubmit={updatePassword}>
+        <h1>Update Password</h1>
+        <input
+          type="text"
+          placeholder="Username"
+          value={updateUsername}
+          onChange={(e) => setUpdateUsername(e.target.value)}
+        />
 
-      <input
-        type="text"
-        placeholder="Nouveau MDP"
-        value={updateNewPassword}
-        onChange={(e) => setUpdateNewPassword(e.target.value)}
-      />
+        <input
+          type="text"
+          placeholder="MDP actuel"
+          value={updateCurrentPassword}
+          onChange={(e) => setUpdateCurrentPassword(e.target.value)}
+        />
 
-      <button type="submit">Uppdate</button>
-    </form>
+        <input
+          type="text"
+          placeholder="Nouveau MDP"
+          value={updateNewPassword}
+          onChange={(e) => setUpdateNewPassword(e.target.value)}
+        />
+        <button type="submit">Uppdate</button>
+      </form>
+      <RegisterUser/>
+
+      
+
+    </div>
+    )}
+    
 
     {loggedIn ? (
       <MainApp resClientId={clientId} />