From 0e7c0daebc4917f2d55e9cd0b91193561fb7632d Mon Sep 17 00:00:00 2001
From: w-okada <you@example.com>
Date: Thu, 23 Nov 2023 08:10:29 +0900
Subject: [PATCH] refactor webedition flag
---
.../src/components/demo/components2/100_ModelSlotArea.tsx | 6 ++----
.../demo/src/components/demo/components2/101-0_Portrait.tsx | 6 +-----
.../src/components/demo/components2/101-1_TuningArea.tsx | 5 +----
.../demo/components2/101-8_web-editionSettingArea.tsx | 5 +----
.../src/components/demo/components2/102-1_QualityArea.tsx | 3 +--
.../src/components/demo/components2/102-2_ConvertArea.tsx | 3 +--
.../src/components/demo/components2/102-3_DeviceArea.tsx | 6 +-----
.../src/components/demo/components2/102-4_RecorderArea.tsx | 5 +----
.../components/demo/components2/102-5_MoreActionArea.tsx | 5 ++---
9 files changed, 11 insertions(+), 33 deletions(-)
diff --git a/client/demo/src/components/demo/components2/100_ModelSlotArea.tsx b/client/demo/src/components/demo/components2/100_ModelSlotArea.tsx
index ee84d548..b0791a5a 100644
--- a/client/demo/src/components/demo/components2/100_ModelSlotArea.tsx
+++ b/client/demo/src/components/demo/components2/100_ModelSlotArea.tsx
@@ -3,7 +3,6 @@ import { useAppState } from "../../../001_provider/001_AppStateProvider";
import { useGuiState } from "../001_GuiStateProvider";
import { useMessageBuilder } from "../../../hooks/useMessageBuilder";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type ModelSlotAreaProps = {};
@@ -14,8 +13,7 @@ const SortTypes = {
export type SortTypes = (typeof SortTypes)[keyof typeof SortTypes];
export const ModelSlotArea = (_props: ModelSlotAreaProps) => {
- const { serverSetting, getInfo } = useAppState();
- const { appGuiSettingState } = useAppRoot();
+ const { serverSetting, getInfo, webEdition } = useAppState();
const guiState = useGuiState();
const messageBuilderState = useMessageBuilder();
const [sortType, setSortType] = useState<SortTypes>("slot");
@@ -118,7 +116,7 @@ export const ModelSlotArea = (_props: ModelSlotAreaProps) => {
);
}, [modelTiles, sortType]);
- if (appGuiSettingState.edition.indexOf("web") >= 0) {
+ if (webEdition) {
return <></>;
}
diff --git a/client/demo/src/components/demo/components2/101-0_Portrait.tsx b/client/demo/src/components/demo/components2/101-0_Portrait.tsx
index 93431788..278e8297 100644
--- a/client/demo/src/components/demo/components2/101-0_Portrait.tsx
+++ b/client/demo/src/components/demo/components2/101-0_Portrait.tsx
@@ -1,7 +1,6 @@
import React, { useEffect, useMemo, useState } from "react";
import { useAppState } from "../../../001_provider/001_AppStateProvider";
import { useMessageBuilder } from "../../../hooks/useMessageBuilder";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type PortraitProps = {};
const BeatriceSpeakerType = {
male: "male",
@@ -13,8 +12,7 @@ type BeatriceSpeakerType = (typeof BeatriceSpeakerType)[keyof typeof BeatriceSpe
import MyIcon from "./female-clickable.svg";
import { useGuiState } from "../001_GuiStateProvider";
export const Portrait = (_props: PortraitProps) => {
- const { appGuiSettingState } = useAppRoot();
- const { serverSetting, volume, bufferingTime, performance, webInfoState } = useAppState();
+ const { serverSetting, volume, bufferingTime, performance, webInfoState, webEdition } = useAppState();
const messageBuilderState = useMessageBuilder();
const [beatriceSpeakerType, setBeatriceSpeakerType] = useState<BeatriceSpeakerType>(BeatriceSpeakerType.male);
const [beatriceSpeakerIndexInGender, setBeatriceSpeakerIndexInGender] = useState<string>("");
@@ -23,8 +21,6 @@ export const Portrait = (_props: PortraitProps) => {
const beatriceMaleSpeakersList = [1, 3, 5, 6, 9, 11, 12, 13, 20, 21, 22, 23, 28, 31, 32, 33, 34, 37, 41, 42, 44, 45, 46, 47, 48, 49, 50, 52, 54, 68, 70, 71, 73, 74, 75, 76, 77, 78, 79, 80, 81, 86, 87, 88, 89, 97, 98, 99, 100];
const beatriceFemaleSpeakersList = [2, 4, 7, 8, 10, 14, 15, 16, 17, 18, 19, 24, 25, 26, 27, 29, 30, 35, 36, 38, 39, 40, 43, 51, 53, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 69, 72, 82, 83, 84, 85, 90, 91, 92, 93, 94, 95, 96];
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
-
useMemo(() => {
messageBuilderState.setMessage(__filename, "terms_of_use", { ja: "利用規約", en: "terms of use" });
}, []);
diff --git a/client/demo/src/components/demo/components2/101-1_TuningArea.tsx b/client/demo/src/components/demo/components2/101-1_TuningArea.tsx
index 2fcf4ecd..1ccfe420 100644
--- a/client/demo/src/components/demo/components2/101-1_TuningArea.tsx
+++ b/client/demo/src/components/demo/components2/101-1_TuningArea.tsx
@@ -1,15 +1,12 @@
import React, { useMemo } from "react";
import { useAppState } from "../../../001_provider/001_AppStateProvider";
import { useGuiState } from "../001_GuiStateProvider";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type TuningAreaProps = {};
export const TuningArea = (_props: TuningAreaProps) => {
- const { appGuiSettingState } = useAppRoot();
- const { serverSetting, webInfoState } = useAppState();
+ const { serverSetting, webInfoState, webEdition } = useAppState();
const { setBeatriceJVSSpeakerPitch, beatriceJVSSpeakerPitch } = useGuiState();
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
const selected = useMemo(() => {
if (webEdition) {
diff --git a/client/demo/src/components/demo/components2/101-8_web-editionSettingArea.tsx b/client/demo/src/components/demo/components2/101-8_web-editionSettingArea.tsx
index c4886b35..9db41bbc 100644
--- a/client/demo/src/components/demo/components2/101-8_web-editionSettingArea.tsx
+++ b/client/demo/src/components/demo/components2/101-8_web-editionSettingArea.tsx
@@ -1,14 +1,11 @@
import React, { useMemo } from "react";
import { useAppState } from "../../../001_provider/001_AppStateProvider";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
import { useGuiState } from "../001_GuiStateProvider";
export type WebEditionSettingAreaProps = {};
export const WebEditionSettingArea = (_props: WebEditionSettingAreaProps) => {
- const { serverSetting, webInfoState } = useAppState();
- const { appGuiSettingState } = useAppRoot();
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
+ const { serverSetting, webInfoState, webEdition } = useAppState();
const guiState = useGuiState();
const selected = useMemo(() => {
diff --git a/client/demo/src/components/demo/components2/102-1_QualityArea.tsx b/client/demo/src/components/demo/components2/102-1_QualityArea.tsx
index 8d1b3086..33ac1d68 100644
--- a/client/demo/src/components/demo/components2/102-1_QualityArea.tsx
+++ b/client/demo/src/components/demo/components2/102-1_QualityArea.tsx
@@ -8,10 +8,9 @@ export type QualityAreaProps = {
};
export const QualityArea = (props: QualityAreaProps) => {
- const { setVoiceChangerClientSetting, serverSetting, setting } = useAppState();
+ const { setVoiceChangerClientSetting, serverSetting, setting, webEdition } = useAppState();
const { appGuiSettingState } = useAppRoot();
const edition = appGuiSettingState.edition;
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
const qualityArea = useMemo(() => {
if (!serverSetting.updateServerSettings || !setVoiceChangerClientSetting || !serverSetting.serverSetting || !setting) {
diff --git a/client/demo/src/components/demo/components2/102-2_ConvertArea.tsx b/client/demo/src/components/demo/components2/102-2_ConvertArea.tsx
index b6fe774b..d7388727 100644
--- a/client/demo/src/components/demo/components2/102-2_ConvertArea.tsx
+++ b/client/demo/src/components/demo/components2/102-2_ConvertArea.tsx
@@ -7,10 +7,9 @@ export type ConvertProps = {
};
export const ConvertArea = (props: ConvertProps) => {
- const { setting, serverSetting, setWorkletNodeSetting, trancateBuffer } = useAppState();
+ const { setting, serverSetting, setWorkletNodeSetting, trancateBuffer, webEdition } = useAppState();
const { appGuiSettingState } = useAppRoot();
const edition = appGuiSettingState.edition;
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
const convertArea = useMemo(() => {
let nums: number[];
diff --git a/client/demo/src/components/demo/components2/102-3_DeviceArea.tsx b/client/demo/src/components/demo/components2/102-3_DeviceArea.tsx
index 27da1c8a..0f358c89 100644
--- a/client/demo/src/components/demo/components2/102-3_DeviceArea.tsx
+++ b/client/demo/src/components/demo/components2/102-3_DeviceArea.tsx
@@ -4,12 +4,11 @@ import { fileSelectorAsDataURL, useIndexedDB } from "@dannadori/voice-changer-cl
import { useGuiState } from "../001_GuiStateProvider";
import { AUDIO_ELEMENT_FOR_PLAY_MONITOR, AUDIO_ELEMENT_FOR_PLAY_RESULT, AUDIO_ELEMENT_FOR_TEST_CONVERTED, AUDIO_ELEMENT_FOR_TEST_CONVERTED_ECHOBACK, INDEXEDDB_KEY_AUDIO_MONITR, INDEXEDDB_KEY_AUDIO_OUTPUT } from "../../../const";
import { isDesktopApp } from "../../../const";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type DeviceAreaProps = {};
export const DeviceArea = (_props: DeviceAreaProps) => {
- const { setting, serverSetting, audioContext, setAudioOutputElementId, setAudioMonitorElementId, initializedRef, setVoiceChangerClientSetting, startOutputRecording, stopOutputRecording } = useAppState();
+ const { setting, serverSetting, audioContext, setAudioOutputElementId, setAudioMonitorElementId, initializedRef, setVoiceChangerClientSetting, startOutputRecording, stopOutputRecording, webEdition } = useAppState();
const { isConverting, audioInputForGUI, inputAudioDeviceInfo, setAudioInputForGUI, fileInputEchoback, setFileInputEchoback, setAudioOutputForGUI, setAudioMonitorForGUI, audioOutputForGUI, audioMonitorForGUI, outputAudioDeviceInfo, shareScreenEnabled, setShareScreenEnabled, reloadDeviceInfo } = useGuiState();
const [inputHostApi, setInputHostApi] = useState<string>("ALL");
const [outputHostApi, setOutputHostApi] = useState<string>("ALL");
@@ -20,9 +19,6 @@ export const DeviceArea = (_props: DeviceAreaProps) => {
const { getItem, setItem } = useIndexedDB({ clientType: null });
const [outputRecordingStarted, setOutputRecordingStarted] = useState<boolean>(false);
- const { appGuiSettingState } = useAppRoot();
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
-
// (1) Audio Mode
const deviceModeRow = useMemo(() => {
if (webEdition) {
diff --git a/client/demo/src/components/demo/components2/102-4_RecorderArea.tsx b/client/demo/src/components/demo/components2/102-4_RecorderArea.tsx
index bef35ebf..98a46878 100644
--- a/client/demo/src/components/demo/components2/102-4_RecorderArea.tsx
+++ b/client/demo/src/components/demo/components2/102-4_RecorderArea.tsx
@@ -2,16 +2,13 @@ import React, { useMemo, useState } from "react";
import { useAppState } from "../../../001_provider/001_AppStateProvider";
import { useGuiState } from "../001_GuiStateProvider";
import { AUDIO_ELEMENT_FOR_SAMPLING_INPUT, AUDIO_ELEMENT_FOR_SAMPLING_OUTPUT } from "../../../const";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
export type RecorderAreaProps = {};
export const RecorderArea = (_props: RecorderAreaProps) => {
- const { serverSetting } = useAppState();
+ const { serverSetting, webEdition } = useAppState();
const { audioOutputForAnalyzer, setAudioOutputForAnalyzer, outputAudioDeviceInfo } = useGuiState();
const [serverIORecording, setServerIORecording] = useState<boolean>(false);
- const { appGuiSettingState } = useAppRoot();
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
const serverIORecorderRow = useMemo(() => {
if (webEdition) {
diff --git a/client/demo/src/components/demo/components2/102-5_MoreActionArea.tsx b/client/demo/src/components/demo/components2/102-5_MoreActionArea.tsx
index aa778756..981c480b 100644
--- a/client/demo/src/components/demo/components2/102-5_MoreActionArea.tsx
+++ b/client/demo/src/components/demo/components2/102-5_MoreActionArea.tsx
@@ -1,13 +1,12 @@
import React, { useMemo } from "react";
import { useGuiState } from "../001_GuiStateProvider";
-import { useAppRoot } from "../../../001_provider/001_AppRootProvider";
+import { useAppState } from "../../../001_provider/001_AppStateProvider";
export type MoreActionAreaProps = {};
export const MoreActionArea = (_props: MoreActionAreaProps) => {
const { stateControls } = useGuiState();
- const { appGuiSettingState } = useAppRoot();
- const webEdition = appGuiSettingState.edition.indexOf("web") >= 0;
+ const { webEdition } = useAppState();
const serverIORecorderRow = useMemo(() => {
const onOpenMergeLabClicked = () => {