From c0c826b443c0c349161f959bf3710c8557eff0a4 Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Tue, 24 Sep 2024 10:00:15 +0900 Subject: [PATCH] [Rename] is_loading to is_pending. --- .../components/dropdown_menu/DropdownMenu.jsx | 2 +- .../dropdown_menu/DropdownMenu.module.scss | 2 +- .../setting_box/components/switchbox/Switchbox.jsx | 6 +++--- .../components/switchbox/Switchbox.module.scss | 2 +- .../volume_check_button/VolumeCheckButton.jsx | 2 +- .../VolumeCheckButton.module.scss | 2 +- .../main_function_switch/MainFunctionSwitch.jsx | 2 +- .../MainFunctionSwitch.module.scss | 12 ++++++------ src-ui/utils/mixins.scss | 2 +- 9 files changed, 16 insertions(+), 16 deletions(-) diff --git a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx index f1c80973..312363e2 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx @@ -29,7 +29,7 @@ export const DropdownMenu = (props) => { }); const dropdown_toggle_button_class_name = clsx(styles["dropdown_toggle_button"], { - [styles.is_loading]: (props.state === "pending") ? true : false, + [styles.is_pending]: (props.state === "pending") ? true : false, [styles.is_disabled]: props.is_disabled, }); diff --git a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.module.scss b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.module.scss index 1a5c88af..2dc94d7c 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.module.scss +++ b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.module.scss @@ -17,7 +17,7 @@ &:active { background-color: var(--dark_975_color); } - &.is_loading { + &.is_pending { pointer-events: none; } &.is_disabled { diff --git a/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.jsx b/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.jsx index 8217b5eb..ba19dfd9 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.jsx @@ -6,11 +6,11 @@ export const Switchbox = (props) => { const [is_hovered, setIsHovered] = useState(false); const [is_mouse_down, setIsMouseDown] = useState(false); - const is_loading = (props.variable.state === "pending"); + const is_pending = (props.variable.state === "pending"); const getClassNames = (base_class) => clsx(base_class, { [styles.is_active]: (props.variable.data === true), - [styles.is_loading]: is_loading, + [styles.is_pending]: is_pending, [styles.is_hovered]: is_hovered, [styles.is_mouse_down]: is_mouse_down, }); @@ -36,7 +36,7 @@ export const Switchbox = (props) => { >
- {is_loading && } + {is_pending && }
diff --git a/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.module.scss b/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.module.scss index 701f7371..8f76c0b6 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.module.scss +++ b/src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.module.scss @@ -16,7 +16,7 @@ padding: 2rem; height: 100%; flex-shrink: 0; - &.is_loading { + &.is_pending { pointer-events: none; } } diff --git a/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.jsx b/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.jsx index 19ffd483..e26d1e57 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.jsx @@ -5,7 +5,7 @@ import clsx from "clsx"; export const VolumeCheckButton = React.memo((props) => { const getClassNames = (baseClass) => clsx(baseClass, { [styles.is_active]: (props.isChecking?.data === true), - [styles.is_loading]: (props.isChecking.state === "pending"), + [styles.is_pending]: (props.isChecking.state === "pending"), }); const toggleFunction = () => { diff --git a/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.module.scss b/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.module.scss index 622323fb..302ab71e 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.module.scss +++ b/src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.module.scss @@ -17,7 +17,7 @@ background-color: var(--primary_550_color); } } - &.is_loading { + &.is_pending { background-color: var(--dark_850_color); pointer-events: none; .button_svg, .button_text { diff --git a/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.jsx b/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.jsx index f1dec68c..45eae936 100644 --- a/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.jsx +++ b/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.jsx @@ -79,7 +79,7 @@ export const SwitchContainer = ({ switchLabel, switch_id, children, currentState const getClassNames = (baseClass) => clsx(baseClass, { [styles.is_compact_mode]: currentIsMainPageCompactMode.data, [styles.is_active]: (currentState.data === true), - [styles.is_loading]: (currentState.state === "pending"), + [styles.is_pending]: (currentState.state === "pending"), [styles.is_hovered]: is_hovered, [styles.is_mouse_down]: is_mouse_down, }); diff --git a/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.module.scss b/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.module.scss index bb0b65f2..dd0df0d8 100644 --- a/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.module.scss +++ b/src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.module.scss @@ -23,7 +23,7 @@ &.is_compact_mode { padding: 1.5rem; } - &.is_loading { + &.is_pending { pointer-events: none; } } @@ -36,23 +36,23 @@ } $basic_label_color: var(--dark_basic_text_color); -$loading_label_color: var(--dark_500_color); +$pending_label_color: var(--dark_500_color); .switch_label { font-size: 1.4rem; color: $basic_label_color; &.is_compact_mode { display: none; } - &.is_loading { - color: $loading_label_color; + &.is_pending { + color: $pending_label_color; } } .switch_svg { width: 1.8rem; color: $basic_label_color; - &.is_loading { - color: $loading_label_color; + &.is_pending { + color: $pending_label_color; } &:not(.is_compact_mode) { width: 1.6rem; diff --git a/src-ui/utils/mixins.scss b/src-ui/utils/mixins.scss index 72420f7f..4e563960 100644 --- a/src-ui/utils/mixins.scss +++ b/src-ui/utils/mixins.scss @@ -76,7 +76,7 @@ $toggle_control_size: $toggle_height - calc($toggle_gutter * 2); background: $toggle_control_color; transition: left $toggle_control_speed $toggle_control_ease; } - &.is_loading:after{ + &.is_pending:after{ background-color: var(--dark_600_color); } &.is_hovered {