[Perf/bugfix] Separate custom hooks and prevent re-render issues.

Config Page: Device Tab. threshold component. fix problem that the input component focused out when input something each time.
Set threshold data when started python.
This commit is contained in:
Sakamoto Shiina
2024-09-10 17:21:03 +09:00
parent 37989d5f7a
commit ac6b898a46
23 changed files with 514 additions and 443 deletions

View File

@@ -2,48 +2,50 @@ import {
useMessageLogsStatus,
} from "@store";
import { useStdoutToPython } from "./useStdoutToPython";
import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useMessage = () => {
const { currentMessageLogsStatus, addMessageLogsStatus, updateMessageLogsStatus } = useMessageLogsStatus();
const { asyncStdoutToPython } = useStdoutToPython();
const sendMessage = (message) => {
const uuid = crypto.randomUUID();
const send_message_object = {
id: uuid,
message: message,
};
asyncStdoutToPython("/controller/callback_messagebox_send", send_message_object);
addMessageLogsStatus({
id: uuid,
category: "sent",
status: "pending",
created_at: generateTimeData(),
messages: {
original: message,
translated: [],
},
});
};
const updateSentMessageLogById = (payload) => {
updateMessageLogsStatus(updateItemById(data.id, payload.translation));
};
const addSentMessageLog = (payload) => {
const message_object = generateMessageObject(payload, "sent");
addMessageLogsStatus(message_object);
};
const addReceivedMessageLog = (payload) => {
const message_object = generateMessageObject(payload, "received");
addMessageLogsStatus(message_object);
};
return {
sendMessage: (message) => {
const uuid = crypto.randomUUID();
const send_message_object = {
id: uuid,
message: message,
};
asyncStdoutToPython("/controller/callback_messagebox_send", send_message_object);
addMessageLogsStatus({
id: uuid,
category: "sent",
status: "pending",
created_at: generateTimeData(),
messages: {
original: message,
translated: [],
},
});
},
currentMessageLogsStatus: currentMessageLogsStatus,
updateSentMessageLog: (payload) => {
const data = payload.data;
updateMessageLogsStatus(updateItemById(data.id, data.translation));
},
addSentMessageLog: (payload) => {
const data = payload.data;
const message_object = generateMessageObject(data, "sent");
addMessageLogsStatus(message_object);
},
addReceivedMessageLog: (payload) => {
const data = payload.data;
const message_object = generateMessageObject(data, "received");
addMessageLogsStatus(message_object);
},
currentMessageLogsStatus,
sendMessage,
updateSentMessageLogById,
addSentMessageLog,
addReceivedMessageLog,
};
};