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

Move to Appearance settings.

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

@@ -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();

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

@@ -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}

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

@@ -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>
     );