diff --git a/locales/en.yml b/locales/en.yml index 8215ce6a..f6a3194f 100644 --- a/locales/en.yml +++ b/locales/en.yml @@ -83,6 +83,8 @@ config_page: type_template_auto: "Automatic" type_template_low: "{{type_name}} (Lower accuracy, faster processing)" type_template_high: "{{type_name}} (Higher accuracy, slower processing)" + warning_labels: + unable_to_use_osc_query: "Due to the OSC IP Address settings, OSC data cannot be received, so this feature is currently unavailable." side_menu_labels: device: "Device" diff --git a/locales/ja.yml b/locales/ja.yml index 90117091..8748c969 100644 --- a/locales/ja.yml +++ b/locales/ja.yml @@ -83,6 +83,8 @@ config_page: type_template_auto: "自動" type_template_low: "{{type_name}} (精度が悪く、処理は早い)" type_template_high: "{{type_name}} (精度が良く、処理は遅い)" + warning_labels: + unable_to_use_osc_query: "OSC IP Address の設定によりOSCデータの受信ができないため、現在この機能は使用できません。" side_menu_labels: device: "デバイス" diff --git a/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.jsx b/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.jsx index ffcb9a89..99077bd0 100644 --- a/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.jsx +++ b/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.jsx @@ -1,5 +1,6 @@ import styles from "./LabelComponent.module.scss"; import { _OpenWebpageButton } from "../_atoms/_open_webpage_button/_OpenWebpageButton"; +import WarningSvg from "@images/warning.svg?react"; export const LabelComponent = (props) => { return ( @@ -9,6 +10,17 @@ export const LabelComponent = (props) => { ?

{props.desc}

: null } + {props.add_warnings && Array.isArray(props.add_warnings) && props.add_warnings.length > 0 && ( +
+ {props.add_warnings.map((w, i) => ( +
+ +

{w.label}

+
+ ))} +
+ )} + {props.webpage_url && <_OpenWebpageButton webpage_url={props.webpage_url} open_webpage_label={props.open_webpage_label} /> } ); diff --git a/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.module.scss b/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.module.scss index a2b6e999..7a266f1f 100644 --- a/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.module.scss +++ b/src-ui/views/app/config_page/setting_section/setting_box/_components/label_component/LabelComponent.module.scss @@ -2,7 +2,8 @@ display: flex; flex-direction: column; gap: 0.4rem; - // flex-shrink: 0; + max-width: 38rem; + overflow-wrap: break-word; } .label { @@ -16,6 +17,28 @@ font-size: 1.4rem; font-weight: 300; color: var(--dark_500_color); - max-width: 38rem; overflow-wrap: break-word; +} + +.warnings_section { + font-weight: 300; + color: var(--dark_500_color); +} + +.warning_item { + display: flex; + align-items: center; + gap: 0.6rem; +} + +.warning_label { + font-size: 1.2rem; + color: var(--warning_color); + overflow-wrap: break-word; +} + +.warning_svg { + width: 1.4rem; + color: var(--warning_color); + flex-shrink: 0; } \ No newline at end of file diff --git a/src-ui/views/app/config_page/setting_section/setting_box/others/Others.jsx b/src-ui/views/app/config_page/setting_section/setting_box/others/Others.jsx index a70a2300..0af65930 100644 --- a/src-ui/views/app/config_page/setting_section/setting_box/others/Others.jsx +++ b/src-ui/views/app/config_page/setting_section/setting_box/others/Others.jsx @@ -110,12 +110,20 @@ export const VrcMicMuteSyncContainer = () => { const { currentEnableVrcMicMuteSync, toggleEnableVrcMicMuteSync } = useOthers(); const { currentIsOscAvailable } = useIsOscAvailable(); + const add_warnings = []; + if (currentIsOscAvailable.data === false) { + add_warnings.push({ + label: t("config_page.common.warning_labels.unable_to_use_osc_query"), + }); + } + return ( );