🐛 (chat.py): add check for message.text being a string to prevent errors

♻️ (index.ts): refactor variable names for clarity and add debug logging
♻️ (IOModal/index.tsx): reformat code for better readability and consistency
✨ (IOModal/index.tsx): add excluded fields parameter to getMessagesTable calls

src/backend/base/langflow/base/io/chat.py

@@ -79,6 +79,6 @@ class ChatComponent(CustomComponent):
                 text=input_value, sender=sender, sender_name=sender_name, files=files, session_id=session_id
             )
         self.status = message
-        if session_id and isinstance(message, Message):
+        if session_id and isinstance(message, Message) and isinstance(message.text, str):
             self.store_message(message)
         return message

src/frontend/src/controllers/API/index.ts

@@ -63,7 +63,7 @@ export async function sendAll(data: sendAllProps) {
 }
 
 export async function postValidateCode(
-  code: string
+  code: string,
 ): Promise<AxiosResponse<errorsTypeAPI>> {
   return await api.post(`${BASE_URL_API}validate/code`, { code });
 }
@@ -78,7 +78,7 @@ export async function postValidateCode(
 export async function postValidatePrompt(
   name: string,
   template: string,
-  frontend_node: APIClassType
+  frontend_node: APIClassType,
 ): Promise<AxiosResponse<PromptTypeAPI>> {
   return api.post(`${BASE_URL_API}validate/prompt`, {
     name,
@@ -151,7 +151,7 @@ export async function saveFlowToDatabase(newFlow: {
  * @throws Will throw an error if the update fails.
  */
 export async function updateFlowInDatabase(
-  updatedFlow: FlowType
+  updatedFlow: FlowType,
 ): Promise<FlowType> {
   try {
     const response = await api.patch(`${BASE_URL_API}flows/${updatedFlow.id}`, {
@@ -329,7 +329,7 @@ export async function getHealth() {
  *
  */
 export async function getBuildStatus(
-  flowId: string
+  flowId: string,
 ): Promise<AxiosResponse<BuildStatusTypeAPI>> {
   return await api.get(`${BASE_URL_API}build/${flowId}/status`);
 }
@@ -342,7 +342,7 @@ export async function getBuildStatus(
  *
  */
 export async function postBuildInit(
-  flow: FlowType
+  flow: FlowType,
 ): Promise<AxiosResponse<InitTypeAPI>> {
   return await api.post(`${BASE_URL_API}build/init/${flow.id}`, flow);
 }
@@ -358,7 +358,7 @@ export async function postBuildInit(
  */
 export async function uploadFile(
   file: File,
-  id: string
+  id: string,
 ): Promise<AxiosResponse<UploadFileTypeAPI>> {
   const formData = new FormData();
   formData.append("file", file);
@@ -380,7 +380,7 @@ export async function getProfilePictures(): Promise<ProfilePicturesTypeAPI | nul
 
 export async function postCustomComponent(
   code: string,
-  apiClass: APIClassType
+  apiClass: APIClassType,
 ): Promise<AxiosResponse<APIClassType>> {
   // let template = apiClass.template;
   return await api.post(`${BASE_URL_API}custom_component`, {
@@ -393,7 +393,7 @@ export async function postCustomComponentUpdate(
   code: string,
   template: APITemplateType,
   field: string,
-  field_value: any
+  field_value: any,
 ): Promise<AxiosResponse<APIClassType>> {
   return await api.post(`${BASE_URL_API}custom_component/update`, {
     code,
@@ -415,7 +415,7 @@ export async function onLogin(user: LoginType) {
         headers: {
           "Content-Type": "application/x-www-form-urlencoded",
         },
-      }
+      },
     );
 
     if (response.status === 200) {
@@ -477,11 +477,11 @@ export async function addUser(user: UserInputType): Promise<Array<Users>> {
 
 export async function getUsersPage(
   skip: number,
-  limit: number
+  limit: number,
 ): Promise<Array<Users>> {
   try {
     const res = await api.get(
-      `${BASE_URL_API}users/?skip=${skip}&limit=${limit}`
+      `${BASE_URL_API}users/?skip=${skip}&limit=${limit}`,
     );
     if (res.status === 200) {
       return res.data;
@@ -518,7 +518,7 @@ export async function resetPassword(user_id: string, user: resetPasswordType) {
   try {
     const res = await api.patch(
       `${BASE_URL_API}users/${user_id}/reset-password`,
-      user
+      user,
     );
     if (res.status === 200) {
       return res.data;
@@ -592,7 +592,7 @@ export async function saveFlowStore(
     last_tested_version?: string;
   },
   tags: string[],
-  publicFlow = false
+  publicFlow = false,
 ): Promise<FlowType> {
   try {
     const response = await api.post(`${BASE_URL_API}store/components/`, {
@@ -721,7 +721,7 @@ export async function postStoreComponents(component: Component) {
 export async function getComponent(component_id: string) {
   try {
     const res = await api.get(
-      `${BASE_URL_API}store/components/${component_id}`
+      `${BASE_URL_API}store/components/${component_id}`,
     );
     if (res.status === 200) {
       return res.data;
@@ -736,7 +736,7 @@ export async function searchComponent(
   page?: number | null,
   limit?: number | null,
   status?: string | null,
-  tags?: string[]
+  tags?: string[],
 ): Promise<StoreComponentResponse | undefined> {
   try {
     let url = `${BASE_URL_API}store/components/`;
@@ -848,7 +848,7 @@ export async function updateFlowStore(
   },
   tags: string[],
   publicFlow = false,
-  id: string
+  id: string,
 ): Promise<FlowType> {
   try {
     const response = await api.patch(`${BASE_URL_API}store/components/${id}`, {
@@ -932,7 +932,7 @@ export async function deleteGlobalVariable(id: string) {
 export async function updateGlobalVariable(
   name: string,
   value: string,
-  id: string
+  id: string,
 ) {
   try {
     const response = api.patch(`${BASE_URL_API}variables/${id}`, {
@@ -951,7 +951,7 @@ export async function getVerticesOrder(
   startNodeId?: string | null,
   stopNodeId?: string | null,
   nodes?: Node[],
-  Edges?: Edge[]
+  Edges?: Edge[],
 ): Promise<AxiosResponse<VerticesOrderTypeAPI>> {
   // nodeId is optional and is a query parameter
   // if nodeId is not provided, the API will return all vertices
@@ -971,7 +971,7 @@ export async function getVerticesOrder(
   return await api.post(
     `${BASE_URL_API}build/${flowId}/vertices`,
     data,
-    config
+    config,
   );
 }
 
@@ -979,7 +979,7 @@ export async function postBuildVertex(
   flowId: string,
   vertexId: string,
   input_value: string,
-  files?: string[]
+  files?: string[],
 ): Promise<AxiosResponse<VertexBuildTypeAPI>> {
   // input_value is optional and is a query parameter
   let data = {};
@@ -991,7 +991,7 @@ export async function postBuildVertex(
   }
   return await api.post(
     `${BASE_URL_API}build/${flowId}/vertices/${vertexId}`,
-    data
+    data,
   );
 }
 
@@ -1015,7 +1015,7 @@ export async function getFlowPool({
 }
 
 export async function deleteFlowPool(
-  flowId: string
+  flowId: string,
 ): Promise<AxiosResponse<any>> {
   const config = {};
   config["params"] = { flow_id: flowId };
@@ -1029,7 +1029,7 @@ export async function deleteFlowPool(
  * @returns A promise that resolves to an array of AxiosResponse objects representing the delete responses.
  */
 export async function multipleDeleteFlowsComponents(
-  flowIds: string[]
+  flowIds: string[],
 ): Promise<AxiosResponse<any>[]> {
   const batches: string[][] = [];
 
@@ -1052,7 +1052,7 @@ export async function multipleDeleteFlowsComponents(
 
   // Execute all delete requests
   const responses: Promise<AxiosResponse<any>>[] = batches.map((batch) =>
-    deleteBatch(batch)
+    deleteBatch(batch),
   );
 
   // Return the responses after all requests are completed
@@ -1062,7 +1062,7 @@ export async function multipleDeleteFlowsComponents(
 export async function getTransactionTable(
   id: string,
   mode: "intersection" | "union",
-  params = {}
+  params = {},
 ): Promise<{ rows: Array<object>; columns: Array<ColDef | ColGroupDef> }> {
   const config = {};
   config["params"] = { flow_id: id };
@@ -1078,7 +1078,7 @@ export async function getMessagesTable(
   mode: "intersection" | "union",
   id?: string,
   excludedFields?: string[],
-  params = {}
+  params = {},
 ): Promise<{ rows: Array<Message>; columns: Array<ColDef | ColGroupDef> }> {
   const config = {};
   if (id) {
@@ -1088,12 +1088,17 @@ export async function getMessagesTable(
     config["params"] = { ...config["params"], ...params };
   }
   const rows = await api.get(`${BASE_URL_API}monitor/messages`, config);
-  const columns = extractColumnsFromRows(rows.data, mode, excludedFields);
+
+  const rowsOrganized = rows.data;
+
+  console.log(rowsOrganized);
+
+  const columns = extractColumnsFromRows(rowsOrganized, mode, excludedFields);
   const sessions = new Set<string>();
-  rows.data.forEach((row) => {
+  rowsOrganized.forEach((row) => {
     sessions.add(row.session_id);
   });
-  return { rows: rows.data, columns };
+  return { rows: rowsOrganized, columns };
 }
 
 export async function deleteMessagesFn(ids: number[]) {

src/frontend/src/modals/IOModal/index.tsx

@@ -112,7 +112,10 @@ export default function IOModal({
         setLockChat(false);
       });
     }
-    const { rows, columns } = await getMessagesTable("union", currentFlow!.id);
+    const { rows, columns } = await getMessagesTable("union", currentFlow!.id, [
+      "index",
+      "flow_id",
+    ]);
     setMessages(rows);
     setColumns(columns);
     setLockChat(false);
@@ -148,10 +151,12 @@ export default function IOModal({
   useEffect(() => {
     setSelectedViewField(startView());
     if (haveChat) {
-      getMessagesTable("union", currentFlow!.id).then(({ rows, columns }) => {
-        setMessages(rows);
-        setColumns(columns);
-      });
+      getMessagesTable("union", currentFlow!.id, ["index", "flow_id"]).then(
+        ({ rows, columns }) => {
+          setMessages(rows);
+          setColumns(columns);
+        },
+      );
     }
   }, [open]);