[Refactor] store.js: put the function names dynamically.
This commit is contained in:
140
src-ui/store.js
140
src-ui/store.js
@@ -12,12 +12,20 @@ export const store = {
|
|||||||
log_box_ref: null,
|
log_box_ref: null,
|
||||||
};
|
};
|
||||||
|
|
||||||
const createAtomWithHook = (initialValue, property_names) => {
|
const generatePropertyNames = (base_ame) => ({
|
||||||
|
current: `current${base_ame}`,
|
||||||
|
update: `update${base_ame}`,
|
||||||
|
async_update: `asyncUpdate${base_ame}`,
|
||||||
|
add: `add${base_ame}`,
|
||||||
|
async_add: `asyncAdd${base_ame}`,
|
||||||
|
});
|
||||||
|
|
||||||
|
const createAtomWithHook = (initialValue, base_ame) => {
|
||||||
|
const property_names = generatePropertyNames(base_ame);
|
||||||
const atomInstance = atom(initialValue);
|
const atomInstance = atom(initialValue);
|
||||||
|
|
||||||
const useHook = () => {
|
const useHook = () => {
|
||||||
const currentAtom = useAtomValue(atomInstance);
|
const currentAtom = useAtomValue(atomInstance);
|
||||||
|
|
||||||
const setAtom = useSetAtom(atomInstance);
|
const setAtom = useSetAtom(atomInstance);
|
||||||
|
|
||||||
const updateAtom = (value) => {
|
const updateAtom = (value) => {
|
||||||
@@ -39,17 +47,16 @@ const createAtomWithHook = (initialValue, property_names) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
import { loadable } from "jotai/utils";
|
import { loadable } from "jotai/utils";
|
||||||
const createAsyncAtomWithHook = (initialValue, property_names) => {
|
const createAsyncAtomWithHook = (initialValue, base_ame) => {
|
||||||
|
const property_names = generatePropertyNames(base_ame);
|
||||||
const atomInstance = atom(initialValue);
|
const atomInstance = atom(initialValue);
|
||||||
const asyncAtom = atom(async (get) => get(atomInstance));
|
const asyncAtom = atom(async (get) => get(atomInstance));
|
||||||
|
|
||||||
const loadableAtom = loadable(asyncAtom);
|
const loadableAtom = loadable(asyncAtom);
|
||||||
|
|
||||||
const useHook = () => {
|
const useHook = () => {
|
||||||
const asyncCurrentAtom = useAtomValue(loadableAtom);
|
const asyncCurrentAtom = useAtomValue(loadableAtom);
|
||||||
// const currentAtom = useAtomValue(atomInstance);
|
|
||||||
|
|
||||||
const setAtom = useSetAtom(atomInstance);
|
const setAtom = useSetAtom(atomInstance);
|
||||||
|
|
||||||
const updateAtom = (value) => {
|
const updateAtom = (value) => {
|
||||||
setAtom(value);
|
setAtom(value);
|
||||||
};
|
};
|
||||||
@@ -57,6 +64,7 @@ const createAsyncAtomWithHook = (initialValue, property_names) => {
|
|||||||
const asyncSetAtom = useSetAtom(atom(null, async (get, set, payloadAsyncFunc, ...args) => {
|
const asyncSetAtom = useSetAtom(atom(null, async (get, set, payloadAsyncFunc, ...args) => {
|
||||||
set(atomInstance, payloadAsyncFunc(...args));
|
set(atomInstance, payloadAsyncFunc(...args));
|
||||||
}));
|
}));
|
||||||
|
|
||||||
const asyncUpdateAtom = async (asyncFunction, ...args) => {
|
const asyncUpdateAtom = async (asyncFunction, ...args) => {
|
||||||
asyncSetAtom(asyncFunction, ...args);
|
asyncSetAtom(asyncFunction, ...args);
|
||||||
};
|
};
|
||||||
@@ -64,9 +72,10 @@ const createAsyncAtomWithHook = (initialValue, property_names) => {
|
|||||||
const addAtom = (value) => {
|
const addAtom = (value) => {
|
||||||
setAtom((old_value) => [...old_value, value]);
|
setAtom((old_value) => [...old_value, value]);
|
||||||
};
|
};
|
||||||
|
|
||||||
const asyncAddAtom = useSetAtom(atom(null, async (get, set, payloadAsyncFunc, ...args) => {
|
const asyncAddAtom = useSetAtom(atom(null, async (get, set, payloadAsyncFunc, ...args) => {
|
||||||
const ald_value = await get(atomInstance);
|
const old_value = await get(atomInstance);
|
||||||
set(atomInstance, payloadAsyncFunc([...ald_value, ...args]));
|
set(atomInstance, payloadAsyncFunc([...old_value, ...args]));
|
||||||
}));
|
}));
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@@ -81,110 +90,33 @@ const createAsyncAtomWithHook = (initialValue, property_names) => {
|
|||||||
return { atomInstance, useHook };
|
return { atomInstance, useHook };
|
||||||
};
|
};
|
||||||
|
|
||||||
export const { atomInstance: uiLanguage, useHook: useUiLanguage } = createAtomWithHook("en", {
|
export const { atomInstance: uiLanguage, useHook: useUiLanguage } = createAtomWithHook("en", "UiLanguage");
|
||||||
current: "currentUiLanguage",
|
export const { atomInstance: State_Translation, useHook: useState_Translation } = createAsyncAtomWithHook(false, "State_Translation");
|
||||||
update: "updateUiLanguage",
|
export const { atomInstance: State_TranscriptionSend, useHook: useState_TranscriptionSend } = createAsyncAtomWithHook(false, "State_TranscriptionSend");
|
||||||
});
|
export const { atomInstance: State_TranscriptionReceive, useHook: useState_TranscriptionReceive } = createAsyncAtomWithHook(false, "State_TranscriptionReceive");
|
||||||
|
export const { atomInstance: State_Foreground, useHook: useState_Foreground } = createAsyncAtomWithHook(false, "State_Foreground");
|
||||||
|
|
||||||
export const { atomInstance: State_Translation, useHook: useState_Translation } = createAsyncAtomWithHook(false, {
|
|
||||||
current: "currentState_Translation",
|
|
||||||
update: "updateState_Translation",
|
|
||||||
async_update: "asyncUpdateState_Translation",
|
|
||||||
});
|
|
||||||
export const { atomInstance: State_TranscriptionSend, useHook: useState_TranscriptionSend } = createAsyncAtomWithHook(false, {
|
|
||||||
current: "currentState_TranscriptionSend",
|
|
||||||
update: "updateState_TranscriptionSend",
|
|
||||||
async_update: "asyncUpdateState_TranscriptionSend",
|
|
||||||
});
|
|
||||||
export const { atomInstance: State_TranscriptionReceive, useHook: useState_TranscriptionReceive } = createAsyncAtomWithHook(false, {
|
|
||||||
current: "currentState_TranscriptionReceive",
|
|
||||||
update: "updateState_TranscriptionReceive",
|
|
||||||
async_update: "asyncUpdateState_TranscriptionReceive",
|
|
||||||
});
|
|
||||||
export const { atomInstance: State_Foreground, useHook: useState_Foreground } = createAsyncAtomWithHook(false, {
|
|
||||||
current: "currentState_Foreground",
|
|
||||||
update: "updateState_Foreground",
|
|
||||||
async_update: "asyncUpdateState_Foreground",
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const { atomInstance: messageLogs, useHook: useMessageLogs } = createAtomWithHook(generateTestData(20), {
|
|
||||||
current: "currentMessageLogs",
|
|
||||||
update: "updateMessageLogs",
|
|
||||||
add: "addMessageLogs",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: isCompactMode, useHook: useIsCompactMode } = createAtomWithHook(false, {
|
|
||||||
current: "currentIsCompactMode",
|
|
||||||
update: "updateIsCompactMode",
|
|
||||||
});
|
|
||||||
|
|
||||||
|
export const { atomInstance: messageLogs, useHook: useMessageLogs } = createAtomWithHook(generateTestData(20), "MessageLogs");
|
||||||
|
export const { atomInstance: isCompactMode, useHook: useIsCompactMode } = createAtomWithHook(false, "IsCompactMode");
|
||||||
export const { atomInstance: isOpenedLanguageSelector, useHook: useIsOpenedLanguageSelector } = createAtomWithHook(
|
export const { atomInstance: isOpenedLanguageSelector, useHook: useIsOpenedLanguageSelector } = createAtomWithHook(
|
||||||
{ your_language: false, target_language: false },
|
{ your_language: false, target_language: false },
|
||||||
{
|
"IsOpenedLanguageSelector"
|
||||||
current: "currentIsOpenedLanguageSelector",
|
|
||||||
update: "updateIsOpenedLanguageSelector",
|
|
||||||
}
|
|
||||||
);
|
);
|
||||||
|
|
||||||
export const { atomInstance: selectedTab, useHook: useSelectedTab } = createAtomWithHook(1, {
|
export const { atomInstance: selectedTab, useHook: useSelectedTab } = createAtomWithHook(1, "SelectedTab");
|
||||||
current: "currentSelectedTab",
|
export const { atomInstance: isOpenedConfigWindow, useHook: useIsOpenedConfigWindow } = createAtomWithHook(false, "IsOpenedConfigWindow");
|
||||||
update: "updateSelectedTab",
|
export const { atomInstance: selectedConfigTab, useHook: useSelectedConfigTab } = createAtomWithHook("appearance", "SelectedConfigTab");
|
||||||
});
|
export const { atomInstance: openedDropdownMenu, useHook: useOpenedDropdownMenu } = createAtomWithHook("", "OpenedDropdownMenu");
|
||||||
|
export const { atomInstance: selectedMicDevice, useHook: useSelectedMicDevice } = createAsyncAtomWithHook("device b", "SelectedMicDevice");
|
||||||
|
|
||||||
|
|
||||||
export const { atomInstance: isOpenedConfigWindow, useHook: useIsOpenedConfigWindow } = createAtomWithHook(false, {
|
|
||||||
current: "currentIsOpenedConfigWindow",
|
|
||||||
update: "updateIsOpenedConfigWindow",
|
|
||||||
} );
|
|
||||||
|
|
||||||
export const { atomInstance: selectedConfigTab, useHook: useSelectedConfigTab } = createAtomWithHook("appearance", {
|
|
||||||
current: "currentSelectedConfigTab",
|
|
||||||
update: "updateSelectedConfigTab",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: openedDropdownMenu, useHook: useOpenedDropdownMenu } = createAtomWithHook("", {
|
|
||||||
current: "currentOpenedDropdownMenu",
|
|
||||||
update: "updateOpenedDropdownMenu",
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
export const { atomInstance: selectedMicDevice, useHook: useSelectedMicDevice } = createAsyncAtomWithHook("device b", {
|
|
||||||
current: "currentSelectedMicDevice",
|
|
||||||
update: "updateSelectedMicDevice",
|
|
||||||
});
|
|
||||||
const test_list = {
|
const test_list = {
|
||||||
a: "Device A",
|
a: "Device A",
|
||||||
"device b": "Device B",
|
"device b": "Device B",
|
||||||
};
|
};
|
||||||
export const { atomInstance: micDeviceList, useHook: useMicDeviceList } = createAtomWithHook(test_list, {
|
|
||||||
current: "currentMicDeviceList",
|
|
||||||
update: "updateMicDeviceList",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: translatorList, useHook: useTranslatorList } = createAtomWithHook(translator_list, {
|
export const { atomInstance: micDeviceList, useHook: useMicDeviceList } = createAtomWithHook(test_list, "MicDeviceList");
|
||||||
current: "currentTranslatorList",
|
export const { atomInstance: translatorList, useHook: useTranslatorList } = createAtomWithHook(translator_list, "TranslatorList");
|
||||||
update: "updateTranslatorList",
|
export const { atomInstance: selectedTranslator, useHook: useSelectedTranslator } = createAtomWithHook("CTranslate2", "SelectedTranslator");
|
||||||
});
|
export const { atomInstance: openedTranslatorSelector, useHook: useOpenedTranslatorSelector } = createAtomWithHook(false, "OpenedTranslatorSelector");
|
||||||
|
export const { atomInstance: vrctPosterIndex, useHook: useVrctPosterIndex } = createAtomWithHook(0, "VrctPosterIndex");
|
||||||
export const { atomInstance: selectedTranslator, useHook: useSelectedTranslator } = createAtomWithHook("CTranslate2", {
|
export const { atomInstance: posterShowcaseWorldPageIndex, useHook: usePosterShowcaseWorldPageIndex } = createAtomWithHook(0, "PosterShowcaseWorldPageIndex");
|
||||||
current: "currentSelectedTranslator",
|
|
||||||
update: "updateSelectedTranslator",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: openedTranslatorSelector, useHook: useOpenedTranslatorSelector } = createAtomWithHook(false, {
|
|
||||||
current: "currentOpenedTranslatorSelector",
|
|
||||||
update: "updateOpenedTranslatorSelector",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: vrctPosterIndex, useHook: useVrctPosterIndex } = createAtomWithHook(0, {
|
|
||||||
current: "currentVrctPosterIndex",
|
|
||||||
update: "updateVrctPosterIndex",
|
|
||||||
});
|
|
||||||
|
|
||||||
export const { atomInstance: posterShowcaseWorldPageIndex, useHook: usePosterShowcaseWorldPageIndex } = createAtomWithHook(0, {
|
|
||||||
current: "currentPosterShowcaseWorldPageIndex",
|
|
||||||
update: "updatePosterShowcaseWorldPageIndex",
|
|
||||||
});
|
|
||||||
Reference in New Issue
Block a user