every_holiday/VRCT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Update] Resend Message Button: To be store-able the status.

Browse Source 
Move to Appearance settings.
This commit is contained in:
Sakamoto Shiina
2025-06-15 17:49:42 +09:00
parent d454c9b13a
commit 3f38bfbba8
17 changed files with 90 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx
View File

@@ -14,6 +14,7 @@ import {
useUiScaling,
useMessageLogUiScaling,
useSendMessageButtonType,
useShowResendButton,
useSelectedFontFamily,
useTransparency,
} from "@logics_configs";
@@ -22,6 +23,7 @@ import {
SliderContainer,
DropdownMenuContainer,
RadioButtonContainer,
CheckboxContainer,
} from "../_templates/Templates";
export const Appearance = () => {
@@ -31,6 +33,7 @@ export const Appearance = () => {
<UiScalingContainer />
<MessageLogUiScalingContainer />
<SendMessageButtonTypeContainer />
<ShowResendButtonContainer />
<FontFamilyContainer />
<TransparencyContainer />
</>
@@ -160,6 +163,20 @@ const SendMessageButtonTypeContainer = () => {
);
};
const ShowResendButtonContainer = () => {
const { t } = useTranslation();
const { currentShowResendButton, toggleShowResendButton } = useShowResendButton();
return (
<CheckboxContainer
label={t("config_page.appearance.show_resend_button.label")}
desc={t("config_page.appearance.show_resend_button.desc")}
variable={currentShowResendButton}
toggleFunction={toggleShowResendButton}
/>
);
};
const FontFamilyContainer = () => {
const { t } = useTranslation();
const { currentSelectedFontFamily, setSelectedFontFamily } = useSelectedFontFamily();

6
src-ui/app/main_page/main_section/message_container/log_box/message_container/MessageContainer.jsx
View File

@@ -4,7 +4,7 @@ import clsx from "clsx";
import styles from "./MessageContainer.module.scss";
import { MessageSubMenuContainer } from "./message_sub_menu_container/MessageSubMenuContainer";
import { useMessage } from "@logics_common";
import { useIsVisibleResendButton } from "@logics_main";
import { useShowResendButton } from "@logics_configs";
export const MessageContainer = ({ messages, status, category, created_at }) => {
const { t } = useTranslation();
@@ -12,7 +12,7 @@ export const MessageContainer = ({ messages, status, category, created_at }) =>
sendMessage,
updateMessageInputValue,
} = useMessage();
const { currentIsVisibleResendButton } = useIsVisibleResendButton();
const { currentShowResendButton } = useShowResendButton();
const [is_hovered, setIsHovered] = useState(false);
const [is_locked, setIsLocked] = useState(false);
@@ -77,7 +77,7 @@ export const MessageContainer = ({ messages, status, category, created_at }) =>
)}
</div>
</div>
{currentIsVisibleResendButton.data && is_sent_message && is_hovered ? (
{currentShowResendButton.data && is_sent_message && is_hovered ? (
<MessageSubMenuContainer
setIsHovered={lockHoverState}
resendFunction={resendFunction}

17
src-ui/app/main_page/main_section/message_container/message_log_settings_container/MessageLogSettingsContainer.jsx
View File

@@ -3,9 +3,7 @@ import styles from "./MessageLogSettingsContainer.module.scss";
import clsx from "clsx";
import { useTranslation } from "react-i18next";
import { useIsVisibleResendButton } from "@logics_main";
import { MessageLogUiScalingContainer } from "@setting_box";
import { Checkbox } from "@common_components";
import ConfigSvg from "@images/configuration.svg?react";
export const MessageLogSettingsContainer = (props) => {
@@ -13,18 +11,12 @@ export const MessageLogSettingsContainer = (props) => {
const [is_opened, setIsOpened] = useState(false);
const [is_hovered, setIsHovered] = useState(false);
const { currentIsVisibleResendButton, toggleIsVisibleResendButton } = useIsVisibleResendButton();
const container_class_name = clsx(styles.container, {
[styles.to_visible_toggle_bar]: props.to_visible_toggle_bar,
[styles.is_hovered]: is_hovered,
[styles.is_opened]: is_opened
});
const toggleVisibleResendButton = () => {
toggleIsVisibleResendButton();
};
return (
<div className={container_class_name}
onMouseOver={() => setIsHovered(true)}
@@ -38,15 +30,6 @@ export const MessageLogSettingsContainer = (props) => {
</div>
<MessageLogUiScalingContainer />
<div className={styles.others_wrapper}>
<div className={styles.resend_checkbox_toggle} onClick={toggleVisibleResendButton}>
<p className={styles.resend_checkbox_label}>{t("main_page.message_log.show_resend_button")}</p>
<Checkbox
id="visible_resend_button"
variable={currentIsVisibleResendButton}
size="2rem"
padding="0"
/>
</div>
</div>
</div>
);

28
src-ui/logics/configs/appearance/useShowResendButton.js Normal file
View File

@@ -0,0 +1,28 @@
import { useStore_ShowResendButton } from "@store";
import { useStdoutToPython } from "@useStdoutToPython";
export const useShowResendButton = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentShowResendButton, updateShowResendButton, pendingShowResendButton } = useStore_ShowResendButton();
const getShowResendButton = () => {
pendingShowResendButton();
asyncStdoutToPython("/get/data/show_resend_button");
};
const toggleShowResendButton = () => {
pendingShowResendButton();
if (currentShowResendButton.data) {
asyncStdoutToPython("/set/disable/show_resend_button");
} else {
asyncStdoutToPython("/set/enable/show_resend_button");
}
};
return {
currentShowResendButton,
getShowResendButton,
updateShowResendButton,
toggleShowResendButton,
};
};

1
src-ui/logics/configs/index.js
View File

@@ -4,6 +4,7 @@ export { useMessageLogUiScaling } from "./appearance/useMessageLogUiScaling";
export { useSelectedFontFamily } from "./appearance/useSelectedFontFamily";
export { useTransparency } from "./appearance/useTransparency";
export { useSendMessageButtonType } from "./others/useSendMessageButtonType";
export { useShowResendButton } from "./appearance/useShowResendButton";
export { useUiLanguage } from "./appearance/useUiLanguage";
export { useUiScaling } from "./appearance/useUiScaling";

1
src-ui/logics/main/index.js
View File

@@ -1,4 +1,3 @@
export { useIsVisibleResendButton } from "./useIsVisibleResendButton";
export { useIsMainPageCompactMode } from "./useIsMainPageCompactMode";
export { useLanguageSettings } from "./useLanguageSettings";
export { useMainFunction } from "./useMainFunction";

15
src-ui/logics/main/useIsVisibleResendButton.js
View File

@@ -1,15 +0,0 @@
import { useStore_IsVisibleResendButton } from "@store";
export const useIsVisibleResendButton = () => {
const { currentIsVisibleResendButton, updateIsVisibleResendButton } = useStore_IsVisibleResendButton();
const toggleIsVisibleResendButton = () => {
updateIsVisibleResendButton(!currentIsVisibleResendButton.data);
};
return {
currentIsVisibleResendButton,
toggleIsVisibleResendButton,
updateIsVisibleResendButton,
};
};

4
src-ui/logics/useReceiveRoutes.js
View File

@@ -149,6 +149,10 @@ export const ROUTE_META_LIST = [
{ endpoint: "/get/data/send_message_button_type", ns: configs, hook_name: "useSendMessageButtonType", method_name: "updateSendMessageButtonType" },
{ endpoint: "/set/data/send_message_button_type", ns: configs, hook_name: "useSendMessageButtonType", method_name: "updateSendMessageButtonType" },
{ endpoint: "/get/data/show_resend_button", ns: configs, hook_name: "useShowResendButton", method_name: "updateShowResendButton" },
{ endpoint: "/set/enable/show_resend_button", ns: configs, hook_name: "useShowResendButton", method_name: "updateShowResendButton" },
{ endpoint: "/set/disable/show_resend_button", ns: configs, hook_name: "useShowResendButton", method_name: "updateShowResendButton" },
{ endpoint: "/get/data/font_family", ns: configs, hook_name: "useSelectedFontFamily", method_name: "updateSelectedFontFamily" },
{ endpoint: "/set/data/font_family", ns: configs, hook_name: "useSelectedFontFamily", method_name: "updateSelectedFontFamily" },

2
src-ui/store.js
View File

@@ -172,7 +172,6 @@ export const { atomInstance: Atom_MessageLogs, useHook: useStore_MessageLogs } =
// export const { atomInstance: Atom_MessageLogs, useHook: useStore_MessageLogs } = createAtomWithHook(generateTestConversationData(20), "MessageLogs"); // For testing
export const { atomInstance: Atom_MessageInputBoxRatio, useHook: useStore_MessageInputBoxRatio } = createAtomWithHook(20, "MessageInputBoxRatio");
export const { atomInstance: Atom_MessageInputValue, useHook: useStore_MessageInputValue } = createAtomWithHook("", "MessageInputValue");
export const { atomInstance: Atom_IsVisibleResendButton, useHook: useStore_IsVisibleResendButton } = createAtomWithHook(false, "IsVisibleResendButton", {is_state_ok: true});
@@ -213,6 +212,7 @@ export const { atomInstance: Atom_UiLanguage, useHook: useStore_UiLanguage } = c
export const { atomInstance: Atom_UiScaling, useHook: useStore_UiScaling } = createAtomWithHook(100, "UiScaling");
export const { atomInstance: Atom_MessageLogUiScaling, useHook: useStore_MessageLogUiScaling } = createAtomWithHook(100, "MessageLogUiScaling");
export const { atomInstance: Atom_SendMessageButtonType, useHook: useStore_SendMessageButtonType } = createAtomWithHook("show", "SendMessageButtonType");
export const { atomInstance: Atom_ShowResendButton, useHook: useStore_ShowResendButton } = createAtomWithHook(false, "ShowResendButton");
export const { atomInstance: Atom_SelectedFontFamily, useHook: useStore_SelectedFontFamily } = createAtomWithHook("Yu Gothic UI", "SelectedFontFamily");
export const { atomInstance: Atom_SelectableFontFamilyList, useHook: useStore_SelectableFontFamilyList } = createAtomWithHook({}, "SelectableFontFamilyList");
export const { atomInstance: Atom_Transparency, useHook: useStore_Transparency } = createAtomWithHook(100, "Transparency");