diff --git a/src/frontend/src/controllers/API/index.ts b/src/frontend/src/controllers/API/index.ts index 5ca100d555d9..e25cc98c6538 100644 --- a/src/frontend/src/controllers/API/index.ts +++ b/src/frontend/src/controllers/API/index.ts @@ -1070,14 +1070,3 @@ export async function getTransactionTable( const columns = extractColumnsFromRows(rows.data, mode); return { rows: rows.data, columns }; } - -export async function deleteMessagesFn(ids: string[]) { - try { - return await api.delete(`${BASE_URL_API}monitor/messages`, { - data: ids, - }); - } catch (error) { - console.error("Error deleting flows:", error); - throw error; - } -} diff --git a/src/frontend/src/controllers/API/queries/messages/use-delete-messages.ts b/src/frontend/src/controllers/API/queries/messages/use-delete-messages.ts index e69de29bb2d1..bdff094cffb7 100644 --- a/src/frontend/src/controllers/API/queries/messages/use-delete-messages.ts +++ b/src/frontend/src/controllers/API/queries/messages/use-delete-messages.ts @@ -0,0 +1,31 @@ +import { useMutationFunctionType } from "@/types/api"; +import { UseMutationResult } from "@tanstack/react-query"; +import { api } from "../../api"; +import { getURL } from "../../helpers/constants"; +import { UseRequestProcessor } from "../../services/request-processor"; + +interface DeleteMessagesParams { + ids: string[]; +} + +export const useDeleteMessages: useMutationFunctionType< + DeleteMessagesParams +> = (options?) => { + const { mutate } = UseRequestProcessor(); + + const deleteMessage = async ({ ids }: DeleteMessagesParams): Promise => { + const response = await api.delete(`${getURL("MESSAGES")}`, { + data: ids, + }); + + return response.data; + }; + + const mutation: UseMutationResult< + DeleteMessagesParams, + any, + DeleteMessagesParams + > = mutate(["useDeleteMessages"], deleteMessage, options); + + return mutation; +}; diff --git a/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx b/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx deleted file mode 100644 index 17b44fd2b6a4..000000000000 --- a/src/frontend/src/modals/IOModal/components/SessionView/hooks/index.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { deleteMessagesFn } from "../../../../../controllers/API"; -import { useMessagesStore } from "../../../../../stores/messagesStore"; - -const useRemoveSession = (setSuccessData, setErrorData) => { - const deleteSession = useMessagesStore((state) => state.deleteSession); - const messages = useMessagesStore((state) => state.messages); - - const handleRemoveSession = async (session_id: string) => { - try { - await deleteMessagesFn( - messages - .filter((msg) => msg.session_id === session_id) - .map((msg) => msg.id), - ); - deleteSession(session_id); - setSuccessData({ - title: "Session deleted successfully.", - }); - } catch (error) { - setErrorData({ - title: "Error deleting Session.", - }); - } - }; - - return { handleRemoveSession }; -}; - -export default useRemoveSession; diff --git a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx index fc4710431899..514d4de777be 100644 --- a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx +++ b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx @@ -1,5 +1,6 @@ import Loading from "@/components/ui/loading"; import { + useDeleteMessages, useGetMessagesQuery, useUpdateMessage, } from "@/controllers/API/queries/messages"; @@ -12,7 +13,6 @@ import { import cloneDeep from "lodash/cloneDeep"; import { useMemo, useState } from "react"; import TableComponent from "../../../../components/tableComponent"; -import useRemoveMessages from "../../../../pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages"; import useAlertStore from "../../../../stores/alertStore"; import { useMessagesStore } from "../../../../stores/messagesStore"; import { messagesSorter } from "../../../../utils/utils"; @@ -29,19 +29,27 @@ export default function SessionView({ const setErrorData = useAlertStore((state) => state.setErrorData); const setSuccessData = useAlertStore((state) => state.setSuccessData); const updateMessage = useMessagesStore((state) => state.updateMessage); - + const deleteMessagesStore = useMessagesStore((state) => state.removeMessages); const isFetching = useIsFetching({ queryKey: ["useGetMessagesQuery"], exact: false, }); const [selectedRows, setSelectedRows] = useState([]); - const { handleRemoveMessages } = useRemoveMessages( - setSelectedRows, - setSuccessData, - setErrorData, - selectedRows, - ); + const { mutate: deleteMessages } = useDeleteMessages({ + onSuccess: () => { + deleteMessagesStore(selectedRows); + setSelectedRows([]); + setSuccessData({ + title: "Messages deleted successfully.", + }); + }, + onError: () => { + setErrorData({ + title: "Error deleting messages.", + }); + }, + }); const { mutate: updateMessageMutation } = useUpdateMessage(); @@ -81,6 +89,10 @@ export default function SessionView({ return filteredMessages; }, [session, id, messages]); + function handleRemoveMessages() { + deleteMessages({ ids: selectedRows }); + } + return isFetching > 0 ? (
diff --git a/src/frontend/src/modals/IOModal/index.tsx b/src/frontend/src/modals/IOModal/index.tsx index 391b59f7dbc6..4998fe8efb82 100644 --- a/src/frontend/src/modals/IOModal/index.tsx +++ b/src/frontend/src/modals/IOModal/index.tsx @@ -1,4 +1,7 @@ -import { useGetMessagesQuery } from "@/controllers/API/queries/messages"; +import { + useDeleteMessages, + useGetMessagesQuery, +} from "@/controllers/API/queries/messages"; import { useQueryClient } from "@tanstack/react-query"; import { useEffect, useState } from "react"; import AccordionComponent from "../../components/accordionComponent"; @@ -24,7 +27,6 @@ import { cn } from "../../utils/utils"; import BaseModal from "../baseModal"; import IOFieldView from "./components/IOFieldView"; import SessionView from "./components/SessionView"; -import useRemoveSession from "./components/SessionView/hooks"; import ChatView from "./components/chatView"; export default function IOModal({ @@ -57,6 +59,32 @@ export default function IOModal({ ); const setErrorData = useAlertStore((state) => state.setErrorData); const setSuccessData = useAlertStore((state) => state.setSuccessData); + const deleteSession = useMessagesStore((state) => state.deleteSession); + + const { mutate: deleteSessionFunction } = useDeleteMessages(); + + function handleDeleteSession(session_id: string) { + deleteSessionFunction( + { + ids: messages + .filter((msg) => msg.session_id === session_id) + .map((msg) => msg.id), + }, + { + onSuccess: () => { + setSuccessData({ + title: "Session deleted successfully.", + }); + deleteSession(session_id); + }, + onError: () => { + setErrorData({ + title: "Error deleting Session.", + }); + }, + }, + ); + } function startView() { if (!chatInput && !chatOutput) { @@ -126,11 +154,6 @@ export default function IOModal({ } } - const { handleRemoveSession } = useRemoveSession( - setSuccessData, - setErrorData, - ); - useEffect(() => { setSelectedTab(inputs.length > 0 ? 1 : outputs.length > 0 ? 2 : 0); }, [allNodes.length]); @@ -371,7 +394,7 @@ export default function IOModal({ onClick={(e) => { e.preventDefault(); e.stopPropagation(); - handleRemoveSession(session); + handleDeleteSession(session); if (selectedViewField?.id === session) setSelectedViewField(undefined); }} diff --git a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx b/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx deleted file mode 100644 index 36cb24531546..000000000000 --- a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-remove-messages.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { deleteMessagesFn } from "../../../../../controllers/API"; -import { useMessagesStore } from "../../../../../stores/messagesStore"; - -const useRemoveMessages = ( - setSelectedRows: (data: string[]) => void, - setSuccessData: (data: { title: string }) => void, - setErrorData: (data: { title: string }) => void, - selectedRows: string[], -) => { - const deleteMessages = useMessagesStore((state) => state.removeMessages); - - const handleRemoveMessages = async () => { - try { - await deleteMessagesFn(selectedRows); - deleteMessages(selectedRows); - setSelectedRows([]); - setSuccessData({ - title: "Messages deleted successfully.", - }); - } catch (error) { - setErrorData({ - title: "Error deleting messages.", - }); - } - }; - - return { handleRemoveMessages }; -}; - -export default useRemoveMessages;