feat: had to take a few lines to make sure the url and context was watched dynamically.

src/modules/chatbot/components/conversation-box.vue

@@ -10,21 +10,6 @@ import { chatbotService } from "../services/messageService";
 import { pageContexts } from "src/page-contexts";
 import type { contextObject } from "src/page-contexts/pages/types/context-object";
 
-const isSessionReady = ref(false);
-
-// Block to receive user from child
-const userEmail = ref('')
-const userRole = ref('')
-
-const HandleEmail = (email: string) => {
-  userEmail.value = email;
-}
-
-const HandleRole = (role: string) => {
-  userRole.value = role;
-}
-
-
 // Block to enable editing the width of the drawer
 const drawerWidth = ref(370);
 let dragging = false
@@ -32,38 +17,32 @@ const startDrag = (e: MouseEvent) => {
   dragging = true
   e.preventDefault()
 }
-
 const onDrag = (e: MouseEvent) => {
   if (!dragging) return
   // calculate new width
   const newWidth = window.innerWidth - e.clientX
   drawerWidth.value = Math.max(350, Math.min(1000, newWidth)) // min/max width
 }
-
 const stopDrag = () => {
   dragging = false
 }
 window.addEventListener('mousemove', onDrag)
 window.addEventListener('mouseup', stopDrag)
 
+
 // Block to handle the incomming and sending of the messages from the user and the ai
 const text = ref('');
 const { messages } = useChatStore();
 const { sendMessage } = useChatApi();
-
 const chatStore = useChatStore();
 onMounted(() => {
   chatStore.showInstructionsOnce();
 })
 
+const isSessionReady = ref(false);
 const handleSend = async () => {
   const userMessage = text.value.trim();
-  if (!userMessage)
 
-    if (!isSessionReady.value) {
-      console.warn("Session not ready yet. Please wait...");
-      return;
-    }
 
   text.value = '';
   messages.push({
@@ -105,6 +84,19 @@ const handleSend = async () => {
 };
 
 
+
+// Block to receive user from child
+const userEmail = ref('')
+const userRole = ref('')
+
+const HandleEmail = (email: string) => {
+  userEmail.value = email;
+}
+
+const HandleRole = (role: string) => {
+  userRole.value = role;
+}
+
 // Block to handle sending the url to n8n
 const route = useRoute()
 const sendPageContext = chatbotService.sendPageContext;
@@ -113,11 +105,9 @@ const currentContext = computed(() =>
   pageContexts.find(ctx => ctx.path === route.fullPath.replace('/', ''))
 )
 
-
-
+// Function that sends the page context to n8n
 watch([currentContext, userEmail, userRole], async ([ctx, email, role]) => {
   if (!ctx || !email || !role) return;
-  if (isSessionReady.value) return;
 
   const contextPayload: contextObject = {
     name: ctx.name,
@@ -139,12 +129,12 @@ watch([currentContext, userEmail, userRole], async ([ctx, email, role]) => {
 );
 
 
-const custId = ref('')
-const handleCustomerId = async () => {
-  const cId = custId.value;
-  custId.value = '';
-  await chatbotService.retrieveCustomerDiagnostics(cId);
-}
+// const custId = ref('')
+// const handleCustomerId = async () => {
+//   const cId = custId.value;
+//   custId.value = '';
+//   await chatbotService.retrieveCustomerDiagnostics(cId);
+// }
 
 
 
@@ -173,7 +163,10 @@ const handleCustomerId = async () => {
     </div>
 
     <div class="line-separator"></div>
-    <q-form class="chat-footer row">
+    <q-form
+      submit="handleSend"
+      class="chat-footer row"
+    >
       <q-input
         v-model="text"
         :label="$t('chatbot.chat_placeholder')"
@@ -182,14 +175,14 @@ const handleCustomerId = async () => {
         style="margin-left: 8px;"
         @keyup.enter="handleSend"
       />
-      <q-input
+      <!-- <q-input
         v-model="custId"
         :label="'Customer Id'"
         :autogrow="false"
         class="col"
         style="margin-left: 8px;"
         @keyup.enter="handleCustomerId"
-      />
+      /> -->
     </q-form>
     <div
       class="drag-handle"

src/modules/chatbot/services/messageService.ts

@@ -11,6 +11,7 @@ export const chatbotService = {
 
   // Function to send context to backend
   sendPageContext: async (context: contextObject): Promise<string> => {
+    console.log(context.path, " ", context.features);
     const response = await api.post("/chat/context", context);
     return response.data;
   },
@@ -26,7 +27,6 @@ export const chatbotService = {
   },
 
   retrieveCustomerDiagnostics: async (id: string): Promise<string> => {
-    console.log("Frontend Service id retreived");
     const response = await api.get(`/chat/customer/${id}`);
     return response.data;
   },