From b7223063c7ecb61a223ce93e5db78c13d3146724 Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Tue, 16 Jul 2024 12:44:04 -0300 Subject: [PATCH] refactor: update edit messages text on Session view compoenent (#2715) * feat: Add useUpdateMessages hook for updating messages * refactor: Update useUpdateMessages hook to use singular naming convention * refactor: update on session view * [autofix.ci] apply automated fixes * refactor: delete unused function --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> --- src/frontend/src/controllers/API/index.ts | 7 ---- .../queries/messages/use-update-messages.ts | 32 ++++++++++++++++++ .../IOModal/components/SessionView/index.tsx | 27 +++++++++++---- .../messagesPage/hooks/use-updateMessage.tsx | 33 ------------------- 4 files changed, 53 insertions(+), 46 deletions(-) delete mode 100644 src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-updateMessage.tsx diff --git a/src/frontend/src/controllers/API/index.ts b/src/frontend/src/controllers/API/index.ts index b1b0354a5..5ca100d55 100644 --- a/src/frontend/src/controllers/API/index.ts +++ b/src/frontend/src/controllers/API/index.ts @@ -1081,10 +1081,3 @@ export async function deleteMessagesFn(ids: string[]) { throw error; } } - -export async function updateMessageApi(data: Message) { - if (data.files && typeof data.files === "string") { - data.files = JSON.parse(data.files); - } - return await api.put(`${BASE_URL_API}monitor/messages/${data.id}`, data); -} diff --git a/src/frontend/src/controllers/API/queries/messages/use-update-messages.ts b/src/frontend/src/controllers/API/queries/messages/use-update-messages.ts index e69de29bb..0ad5edb84 100644 --- a/src/frontend/src/controllers/API/queries/messages/use-update-messages.ts +++ b/src/frontend/src/controllers/API/queries/messages/use-update-messages.ts @@ -0,0 +1,32 @@ +import { useMutationFunctionType } from "@/types/api"; +import { Message } from "@/types/messages"; +import { UseMutationResult } from "@tanstack/react-query"; +import { api } from "../../api"; +import { getURL } from "../../helpers/constants"; +import { UseRequestProcessor } from "../../services/request-processor"; + +interface UpdateMessageParams { + message: Message; +} + +export const useUpdateMessage: useMutationFunctionType = ( + options?, +) => { + const { mutate } = UseRequestProcessor(); + + const updateMessageApi = async (data: Message) => { + if (data.files && typeof data.files === "string") { + data.files = JSON.parse(data.files); + } + const result = await api.put(`${getURL("MESSAGES")}/${data.id}`, data); + return result.data; + }; + + const mutation: UseMutationResult< + UpdateMessageParams, + any, + UpdateMessageParams + > = mutate(["useUpdateMessages"], updateMessageApi, options); + + return mutation; +}; diff --git a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx index 934320f8b..fc4710431 100644 --- a/src/frontend/src/modals/IOModal/components/SessionView/index.tsx +++ b/src/frontend/src/modals/IOModal/components/SessionView/index.tsx @@ -1,5 +1,8 @@ import Loading from "@/components/ui/loading"; -import { useGetMessagesQuery } from "@/controllers/API/queries/messages"; +import { + useGetMessagesQuery, + useUpdateMessage, +} from "@/controllers/API/queries/messages"; import { useIsFetching } from "@tanstack/react-query"; import { CellEditRequestEvent, @@ -10,7 +13,6 @@ 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 useUpdateMessage from "../../../../pages/SettingsPage/pages/messagesPage/hooks/use-updateMessage"; import useAlertStore from "../../../../stores/alertStore"; import { useMessagesStore } from "../../../../stores/messagesStore"; import { messagesSorter } from "../../../../utils/utils"; @@ -26,6 +28,7 @@ export default function SessionView({ const messages = useMessagesStore((state) => state.messages); const setErrorData = useAlertStore((state) => state.setErrorData); const setSuccessData = useAlertStore((state) => state.setSuccessData); + const updateMessage = useMessagesStore((state) => state.updateMessage); const isFetching = useIsFetching({ queryKey: ["useGetMessagesQuery"], @@ -40,7 +43,7 @@ export default function SessionView({ selectedRows, ); - const { handleUpdate } = useUpdateMessage(setSuccessData, setErrorData); + const { mutate: updateMessageMutation } = useUpdateMessage(); function handleUpdateMessage(event: NewValueParams) { const newValue = event.newValue; @@ -50,9 +53,21 @@ export default function SessionView({ ...row, [field]: newValue, }; - handleUpdate(data).catch((error) => { - event.data[field] = event.oldValue; - event.api.refreshCells(); + updateMessageMutation(data, { + onSuccess: () => { + updateMessage(data); + // Set success message + setSuccessData({ + title: "Messages updated successfully.", + }); + }, + onError: () => { + setErrorData({ + title: "Error updating messages.", + }); + event.data[field] = event.oldValue; + event.api.refreshCells(); + }, }); } diff --git a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-updateMessage.tsx b/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-updateMessage.tsx deleted file mode 100644 index dc2840b79..000000000 --- a/src/frontend/src/pages/SettingsPage/pages/messagesPage/hooks/use-updateMessage.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import { updateMessageApi } from "../../../../../controllers/API"; -import { useMessagesStore } from "../../../../../stores/messagesStore"; -import { Message } from "../../../../../types/messages"; - -const useUpdateMessage = ( - setSuccessData: (data: { title: string; list?: string[] }) => void, - setErrorData: (data: { title: string; list?: string[] }) => void, -) => { - const updateMessage = useMessagesStore((state) => state.updateMessage); - - const handleUpdate = async (data: Message) => { - try { - await updateMessageApi(data); - - updateMessage(data); - - // Set success message - setSuccessData({ - title: "Messages updated successfully.", - }); - } catch (error) { - // Set error message - setErrorData({ - title: "Error updating messages.", - }); - return Promise.reject(error); - } - }; - - return { handleUpdate }; -}; - -export default useUpdateMessage;