[Update/bugfix] UI: Add disable/enable UI function when osc query is disabled.

Fix the error that the mic mute sync couldn't enable/disable.

src-ui/logics/common/index.js

@@ -11,5 +11,6 @@ export { useMessage } from "./useMessage";
 export { useUpdateSoftware } from "./useUpdateSoftware";
 export { useVolume } from "./useVolume";
 export { useHandleNetworkConnection } from "./useHandleNetworkConnection";
+export { useHandleOscQuery } from "./useHandleOscQuery";
 export { useIsVrctAvailable } from "./useIsVrctAvailable";
 export { useFetch } from "./useFetch";

src-ui/logics/common/useHandleOscQuery.js

@@ -0,0 +1,44 @@
+import { useTranslation } from "react-i18next";
+import { useNotificationStatus } from "@logics_common";
+import {
+    useEnableVrcMicMuteSync,
+} from "@logics_configs";
+
+export const useHandleOscQuery = () => {
+    const { t } = useTranslation();
+
+    const { showNotification_Warning } = useNotificationStatus();
+    const { updateEnableVrcMicMuteSync } = useEnableVrcMicMuteSync();
+
+    const handleOscQuery = ({is_osc_query_enabled, disabled_functions}) => {
+        if (!is_osc_query_enabled && disabled_functions.length > 0) {
+            const BASE_LABEL = t("common_warning.unable_to_use_osc_query");
+            let items_label = "";
+
+            for (const disabled_function of disabled_functions) {
+                if (disabled_function === "vrc_mic_mute_sync") {
+                    updateEnableVrcMicMuteSync({
+                        is_enabled: !is_osc_query_enabled,
+                        is_available: false,
+                    });
+                    const item = `- ${t("config_page.others.vrc_mic_mute_sync.label")}`;
+                    items_label = `${items_label}\n${item}`;
+                }
+            }
+            const label = `${BASE_LABEL}${items_label}`;
+            showNotification_Warning(
+                label,
+                { hide_duration: 10000, }
+            );
+        } else if (is_osc_query_enabled) {
+            updateEnableVrcMicMuteSync((old_value) => ({
+                ...old_value.data,
+                is_available: true,
+            }));
+        }
+    };
+
+    return {
+        handleOscQuery,
+    };
+};

src-ui/logics/common/useNotificationStatus.js

@@ -5,6 +5,16 @@ export const useNotificationStatus = () => {
 
     const generateRandomKey = () => Math.random();
 
+    const showNotification_Warning = (message, options = {}) => {
+        updateNotificationStatus({
+            status: "warning",
+            is_open: true,
+            key: generateRandomKey(),
+            message: message,
+            options: options,
+        });
+    };
+
     const showNotification_Error = (message, options = {}) => {
         updateNotificationStatus({
             status: "error",
@@ -37,6 +47,7 @@ export const useNotificationStatus = () => {
         currentNotificationStatus,
         updateNotificationStatus,
 
+        showNotification_Warning,
         showNotification_Error,
         showNotification_Success,
         closeNotification,

src-ui/logics/configs/others/useEnableVrcMicMuteSync.js

@@ -12,7 +12,7 @@ export const useEnableVrcMicMuteSync = () => {
 
     const toggleEnableVrcMicMuteSync = () => {
         pendingEnableVrcMicMuteSync();
-        if (currentEnableVrcMicMuteSync.data) {
+        if (currentEnableVrcMicMuteSync.data.is_enabled) {
             asyncStdoutToPython("/set/disable/vrc_mic_mute_sync");
         } else {
             asyncStdoutToPython("/set/enable/vrc_mic_mute_sync");

src-ui/logics/useReceiveRoutes.js

@@ -7,6 +7,7 @@ import {
     useIsVrctAvailable,
     useNotificationStatus,
     useHandleNetworkConnection,
+    useHandleOscQuery,
 
     useSoftwareVersion,
     useComputeMode,
@@ -83,6 +84,7 @@ export const useReceiveRoutes = () => {
     const { updateComputeMode } = useComputeMode();
     const { updateInitProgress } = useInitProgress();
     const { updateIsBackendReady } = useIsBackendReady();
+    const { handleOscQuery } = useHandleOscQuery();
     const { restoreWindowGeometry } = useWindow();
     const { updateIsMainPageCompactMode } = useIsMainPageCompactMode();
     const {
@@ -219,6 +221,12 @@ export const useReceiveRoutes = () => {
             }));
         },
         "/run/connected_network": handleNetworkConnection,
+        "/run/enable_osc_query": ({data, disabled_functions}) => {
+            handleOscQuery({
+                is_osc_query_enabled: data,
+                disabled_functions: disabled_functions,
+            });
+        },
 
         // Main Page
         // Page Controls
@@ -480,9 +488,15 @@ export const useReceiveRoutes = () => {
         "/set/enable/logger_feature": updateEnableAutoExportMessageLogs,
         "/set/disable/logger_feature": updateEnableAutoExportMessageLogs,
 
-        "/get/data/vrc_mic_mute_sync": updateEnableVrcMicMuteSync,
-        "/set/enable/vrc_mic_mute_sync": updateEnableVrcMicMuteSync,
-        "/set/disable/vrc_mic_mute_sync": updateEnableVrcMicMuteSync,
+        "/get/data/vrc_mic_mute_sync": (payload) => updateEnableVrcMicMuteSync((old_value) => {
+            return {...old_value.data, is_enabled: payload};
+        }),
+        "/set/enable/vrc_mic_mute_sync": (payload) => updateEnableVrcMicMuteSync((old_value) => {
+            return {...old_value.data, is_enabled: payload};
+        }),
+        "/set/disable/vrc_mic_mute_sync": (payload) => updateEnableVrcMicMuteSync((old_value) => {
+            return {...old_value.data, is_enabled: payload};
+        }),
 
         "/get/data/send_message_to_vrc": updateEnableSendMessageToVrc,
         "/set/enable/send_message_to_vrc": updateEnableSendMessageToVrc,