add user to conv fix & conv create impl

src/components/HotelContext.jsx

@@ -63,6 +63,23 @@ export function HotelProvider({ accessToken, children, resClientId}) {
     return users;
   }
 
+  async function createConversation(name) {
+    
+    const payload = {
+      name
+    };
+
+    const res = await fetch(`${API_BASE}/chat/create_conversation`, {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${accessTokenSingle}`,
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(payload),
+    });
+  
+  }
+
   async function fetchConversations() {
     const res = await fetch(`${API_BASE}/chat/get_conv`, {
       method: "POST",
@@ -101,7 +118,7 @@ export function HotelProvider({ accessToken, children, resClientId}) {
     //return res.json
   }
 
-async function fetchConvUsers({ conv_id }) {
+  async function fetchConvUsers({ conv_id }) {
 
     const payload = {
     conv_id,
@@ -124,7 +141,6 @@ async function fetchConvUsers({ conv_id }) {
     //return res.json
   }
 
-
   async function sendMessage({ conv_id, message }) {
     if (!conv_id) {    
       console.log("conv_id null at sendMessage")
@@ -206,6 +222,7 @@ async function fetchConvUsers({ conv_id }) {
         sendMessage,
         fetchHotelUsers,
         addUserToConv,
+        createConversation
       }}
     >
       {children}

src/components/widget/chatWidget.jsx

@@ -7,13 +7,16 @@ import { useRef } from "react";
 import "./chatWidget.css"
 
 export default function ChatWidget({convlist}) {
-    const { fetchMessages, sendMessage,
+    const { 
-            usersById, clientId, fetchConvUsers,
+            createConversation,
-            addUserToConv
+            fetchMessages, sendMessage,
+            usersById, clientId,
+            fetchConvUsers, addUserToConv
             } = useHotel();
 
     const [activeConvId, setActiveConvId] = useState(null);
     const [showAddUsers, setShowAddUsers] = useState(false);
+    const [showCreateConv, setShowCreateConv] = useState(false);
 
     const handleOpenConv = async (conv_id) => {
         setActiveConvId(conv_id);
@@ -40,7 +43,13 @@ return (
                     >
                         Add users
                     </button>
-                </div>
+                    <button
+                        onClick={() => setShowCreateConv(v => !v)}
+                    >
+                        Create Conv
+                    </button>
+            
+                    </div>
             </div>
 
             {showAddUsers && activeConvId && (
@@ -51,7 +60,7 @@ return (
                     onValidate={addUserToConv}
                     onClose={() => setShowAddUsers(false)}
                 />
-            )}
+            )}                
 
             {activeConvId && (
                 <MessagesBox
@@ -67,6 +76,13 @@ return (
                 onSend={sendMessage}
                 disabled={!activeConvId}
             />
+
+            {showCreateConv && (
+            <CreateConvMenu
+                onSend={createConversation}
+            />
+            )}
+
         </div>
     );
 }
@@ -159,7 +175,28 @@ function AddUsersMenu({ convId, usersById, fetchConvUsers, onValidate, onClose }
     );
 }
 
+function CreateConvMenu({onSend}) {
 
+    const [nametext, setNameText] = useState("");
+    const handleSend = () =>{
+        if (!nametext.trim()) return;
+
+        onSend(nametext);
+
+        setText("");
+    };
+
+    return (
+        <div className="createConvBox">
+            <input
+                value= {text}
+                onChange= {element => setText(element.target.value)}
+                placeholder="Ma Conversation"
+            />
+            <button onClick= {handleSend}>Send</button>
+        </div>
+    )
+}
 
 function ConvCard({id, title, onOpenConv}) {
     return(