- 
- ![]({"/full-logo.webp"})
+
{systemStatus.customizedProfile.name}
+
+ Memos
{children}
diff --git a/web/src/components/Settings/PreferencesSection.tsx b/web/src/components/Settings/PreferencesSection.tsx
index ed030741..7aff8320 100644
--- a/web/src/components/Settings/PreferencesSection.tsx
+++ b/web/src/components/Settings/PreferencesSection.tsx
@@ -2,7 +2,7 @@ import { Button, Divider, Input, Option, Select } from "@mui/joy";
import { useState } from "react";
import { toast } from "react-hot-toast";
import { Link } from "react-router-dom";
-import { useGlobalStore } from "@/store/module";
+import { useCommonContext } from "@/layouts/CommonContextProvider";
import { useUserStore } from "@/store/v1";
import { Visibility } from "@/types/proto/api/v2/memo_service";
import { UserSetting } from "@/types/proto/api/v2/user_service";
@@ -16,29 +16,29 @@ import WebhookSection from "./WebhookSection";
const PreferencesSection = () => {
const t = useTranslate();
- const globalStore = useGlobalStore();
+ const commonContext = useCommonContext();
const userStore = useUserStore();
const setting = userStore.userSetting as UserSetting;
const [telegramUserId, setTelegramUserId] = useState
- showUpdateLocalStorageDialog(systemStatus.localStoragePath)}>
+ {
+ handleActivedExternalStorageIdChanged(Number(event.target.value));
+ }}
+ >
{storageList.map((storage) => (
+
+ showUpdateLocalStorageDialog()}>
+
+
+ {t("setting.system-section.max-upload-size")}
+
+
+
+
+
diff --git a/web/src/components/Settings/SystemSection.tsx b/web/src/components/Settings/WorkspaceSection.tsx
similarity index 69%
rename from web/src/components/Settings/SystemSection.tsx
rename to web/src/components/Settings/WorkspaceSection.tsx
index 5517779d..0c341414 100644
--- a/web/src/components/Settings/SystemSection.tsx
+++ b/web/src/components/Settings/WorkspaceSection.tsx
@@ -1,65 +1,39 @@
-import { Button, Divider, Input, Switch, Textarea, Tooltip } from "@mui/joy";
-import { useEffect, useState } from "react";
+import { Button, Divider, Input, Switch, Textarea } from "@mui/joy";
+import { useState } from "react";
import { toast } from "react-hot-toast";
import { Link } from "react-router-dom";
import { workspaceSettingServiceClient } from "@/grpcweb";
-import * as api from "@/helpers/api";
-import { useGlobalStore } from "@/store/module";
-import { WorkspaceSettingPrefix } from "@/store/v1";
-import { WorkspaceGeneralSetting } from "@/types/proto/api/v2/workspace_setting_service";
+import { WorkspaceSettingPrefix, useWorkspaceSettingStore } from "@/store/v1";
+import {
+ WorkspaceGeneralSetting,
+ WorkspaceMemoRelatedSetting,
+ WorkspaceTelegramIntegrationSetting,
+} from "@/types/proto/api/v2/workspace_setting_service";
import { WorkspaceSettingKey } from "@/types/proto/store/workspace_setting";
import { useTranslate } from "@/utils/i18n";
import { showCommonDialog } from "../Dialog/CommonDialog";
import Icon from "../Icon";
import showUpdateCustomizedProfileDialog from "../UpdateCustomizedProfileDialog";
-interface State {
- disablePublicMemos: boolean;
- maxUploadSizeMiB: number;
- memoDisplayWithUpdatedTs: boolean;
-}
-
-const SystemSection = () => {
+const WorkspaceSection = () => {
const t = useTranslate();
- const globalStore = useGlobalStore();
- const systemStatus = globalStore.state.systemStatus;
- const [state, setState] = useState({
- disablePublicMemos: systemStatus.disablePublicMemos,
- maxUploadSizeMiB: systemStatus.maxUploadSizeMiB,
- memoDisplayWithUpdatedTs: systemStatus.memoDisplayWithUpdatedTs,
- });
- const [workspaceGeneralSetting, setWorkspaceGeneralSetting] = useState(WorkspaceGeneralSetting.fromPartial({}));
- const [telegramBotToken, setTelegramBotToken] = useState("");
-
- useEffect(() => {
- (async () => {
- await globalStore.fetchSystemStatus();
- const { setting } = await workspaceSettingServiceClient.getWorkspaceSetting({
- name: `${WorkspaceSettingPrefix}${WorkspaceSettingKey.WORKSPACE_SETTING_GENERAL}`,
- });
- if (setting && setting.generalSetting) {
- setWorkspaceGeneralSetting(WorkspaceGeneralSetting.fromPartial(setting.generalSetting));
- }
- })();
- }, []);
-
- useEffect(() => {
- api.getSystemSetting().then(({ data: systemSettings }) => {
- const telegramBotSetting = systemSettings.find((setting) => setting.name === "telegram-bot-token");
- if (telegramBotSetting) {
- setTelegramBotToken(telegramBotSetting.value);
- }
- });
- }, []);
-
- useEffect(() => {
- setState({
- ...state,
- disablePublicMemos: systemStatus.disablePublicMemos,
- maxUploadSizeMiB: systemStatus.maxUploadSizeMiB,
- memoDisplayWithUpdatedTs: systemStatus.memoDisplayWithUpdatedTs,
- });
- }, [systemStatus]);
+ const workspaceSettingStore = useWorkspaceSettingStore();
+ const [workspaceGeneralSetting, setWorkspaceGeneralSetting] = useState(
+ WorkspaceGeneralSetting.fromPartial(
+ workspaceSettingStore.getWorkspaceSettingByKey(WorkspaceSettingKey.WORKSPACE_SETTING_GENERAL)?.generalSetting || {},
+ ),
+ );
+ const [workspaceMemoRelatedSetting, setWorkspaceMemoRelatedSetting] = useState(
+ WorkspaceMemoRelatedSetting.fromPartial(
+ workspaceSettingStore.getWorkspaceSettingByKey(WorkspaceSettingKey.WORKSPACE_SETTING_MEMO_RELATED)?.memoRelatedSetting || {},
+ ),
+ );
+ const [workspaceTelegramIntegrationSetting, setWorkspaceTelegramIntegrationSetting] = useState(
+ WorkspaceTelegramIntegrationSetting.fromPartial(
+ workspaceSettingStore.getWorkspaceSettingByKey(WorkspaceSettingKey.WORKSPACE_SETTING_TELEGRAM_INTEGRATION)
+ ?.telegramIntegrationSetting || {},
+ ),
+ );
const handleAllowSignUpChanged = async (value: boolean) => {
const setting = { ...workspaceGeneralSetting, disallowSignup: !value };
@@ -123,21 +97,20 @@ const SystemSection = () => {
};
const handleTelegramBotTokenChanged = (value: string) => {
- setTelegramBotToken(value);
+ setWorkspaceTelegramIntegrationSetting({ ...workspaceTelegramIntegrationSetting, botToken: value });
};
const handleSaveTelegramBotToken = async () => {
try {
- await api.upsertSystemSetting({
- name: "telegram-bot-token",
- value: telegramBotToken,
+ await workspaceSettingStore.setWorkspaceSetting({
+ name: `${WorkspaceSettingPrefix}${WorkspaceSettingKey.WORKSPACE_SETTING_TELEGRAM_INTEGRATION}`,
+ telegramIntegrationSetting: workspaceTelegramIntegrationSetting,
});
+ toast.success("Telegram Bot Token updated");
} catch (error: any) {
console.error(error);
- toast.error(error.response.data.message);
- return;
+ toast.error(error.details);
}
- toast.success("Telegram Bot Token updated");
};
const handleAdditionalStyleChanged = (value: string) => {
@@ -181,51 +154,21 @@ const SystemSection = () => {
};
const handleDisablePublicMemosChanged = async (value: boolean) => {
- setState({
- ...state,
- disablePublicMemos: value,
- });
- globalStore.setSystemStatus({ disablePublicMemos: value });
- await api.upsertSystemSetting({
- name: "disable-public-memos",
- value: JSON.stringify(value),
+ const update: WorkspaceMemoRelatedSetting = { ...workspaceMemoRelatedSetting, disallowPublicVisible: value };
+ setWorkspaceMemoRelatedSetting(update);
+ await workspaceSettingStore.setWorkspaceSetting({
+ name: `${WorkspaceSettingPrefix}${WorkspaceSettingKey.WORKSPACE_SETTING_MEMO_RELATED}`,
+ memoRelatedSetting: update,
});
};
const handleMemoDisplayWithUpdatedTs = async (value: boolean) => {
- setState({
- ...state,
- memoDisplayWithUpdatedTs: value,
+ const update: WorkspaceMemoRelatedSetting = { ...workspaceMemoRelatedSetting, displayWithUpdateTime: value };
+ setWorkspaceMemoRelatedSetting(update);
+ await workspaceSettingStore.setWorkspaceSetting({
+ name: `${WorkspaceSettingPrefix}${WorkspaceSettingKey.WORKSPACE_SETTING_MEMO_RELATED}`,
+ memoRelatedSetting: update,
});
- globalStore.setSystemStatus({ memoDisplayWithUpdatedTs: value });
- await api.upsertSystemSetting({
- name: "memo-display-with-updated-ts",
- value: JSON.stringify(value),
- });
- };
-
- const handleMaxUploadSizeChanged = async (event: React.FocusEvent) => {
- // fixes cursor skipping position on mobile
- event.target.selectionEnd = event.target.value.length;
-
- let num = parseInt(event.target.value);
- if (Number.isNaN(num)) {
- num = 0;
- }
- setState({
- ...state,
- maxUploadSizeMiB: num,
- });
- event.target.value = num.toString();
- globalStore.setSystemStatus({ maxUploadSizeMiB: num });
- await api.upsertSystemSetting({
- name: "max-upload-size-mib",
- value: JSON.stringify(num),
- });
- };
-
- const handleMaxUploadSizeFocus = (event: React.FocusEvent) => {
- event.target.select();
};
return (
@@ -233,7 +176,8 @@ const SystemSection = () => {
@@ -331,32 +275,23 @@ const SystemSection = () => {
{t("common.basic")}
- {t("setting.system-section.server-name")}: {systemStatus.customizedProfile.name}
+ {t("setting.system-section.server-name")}:{" "}
+ {workspaceGeneralSetting.customProfile?.title || "Memos"}
Others
+Memo related settings
{t("setting.system-section.disable-public-memos")}
- handleDisablePublicMemosChanged(event.target.checked)} />
+ handleDisablePublicMemosChanged(event.target.checked)}
+ />
{t("setting.system-section.display-with-updated-time")}
- handleMemoDisplayWithUpdatedTs(event.target.checked)} />
-
-
-
+
- {t("setting.system-section.max-upload-size")}
-
-
-
- handleMemoDisplayWithUpdatedTs(event.target.checked)}
/>
Integrations
@@ -375,7 +310,7 @@ const SystemSection = () => {
fontSize: "14px",
}}
placeholder={t("setting.system-section.telegram-bot-token-placeholder")}
- value={telegramBotToken}
+ value={workspaceTelegramIntegrationSetting.botToken}
onChange={(event) => handleTelegramBotTokenChanged(event.target.value)}
/>
) => {
- store.dispatch(
- setGlobalState({
- systemStatus: {
- ...state.systemStatus,
- ...systemStatus,
- },
- }),
- );
- },
- setLocale: (locale: Locale) => {
- // Set storageLocale to user selected locale.
- storage.set({
- locale: locale,
- });
- store.dispatch(setLocale(locale));
- },
- setAppearance: (appearance: Appearance) => {
- // Set storageAppearance to user selected appearance.
- storage.set({
- appearance: appearance,
- });
- store.dispatch(setAppearance(appearance));
- },
- };
-};
diff --git a/web/src/store/module/index.ts b/web/src/store/module/index.ts
index 57fc4f2a..9fba225a 100644
--- a/web/src/store/module/index.ts
+++ b/web/src/store/module/index.ts
@@ -1,4 +1,3 @@
-export * from "./global";
export * from "./filter";
export * from "./tag";
export * from "./dialog";
diff --git a/web/src/store/reducer/global.ts b/web/src/store/reducer/global.ts
deleted file mode 100644
index 1664e2a3..00000000
--- a/web/src/store/reducer/global.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-import { WorkspaceProfile } from "@/types/proto/api/v2/workspace_service";
-
-interface State {
- locale: Locale;
- appearance: Appearance;
- systemStatus: SystemStatus;
- workspaceProfile: WorkspaceProfile;
-}
-
-const globalSlice = createSlice({
- name: "global",
- initialState: {
- locale: "en",
- appearance: "system",
- systemStatus: {
- disablePasswordLogin: false,
- disablePublicMemos: false,
- memoDisplayWithUpdatedTs: false,
- customizedProfile: {
- name: "Memos",
- logoUrl: "/logo.webp",
- description: "",
- locale: "en",
- appearance: "system",
- },
- },
- workspaceProfile: WorkspaceProfile.fromPartial({}),
- } as State,
- reducers: {
- setGlobalState: (state, action: PayloadAction>) => {
- return {
- ...state,
- ...action.payload,
- };
- },
- setLocale: (state, action: PayloadAction) => {
- return {
- ...state,
- locale: action.payload,
- };
- },
- setAppearance: (state, action: PayloadAction) => {
- return {
- ...state,
- appearance: action.payload,
- };
- },
- },
-});
-
-export const { setGlobalState, setLocale, setAppearance } = globalSlice.actions;
-
-export default globalSlice.reducer;
diff --git a/web/src/store/v1/workspaceSetting.ts b/web/src/store/v1/workspaceSetting.ts
index 555ef198..b7213faf 100644
--- a/web/src/store/v1/workspaceSetting.ts
+++ b/web/src/store/v1/workspaceSetting.ts
@@ -15,6 +15,13 @@ const getDefaultState = (): State => ({
export const useWorkspaceSettingStore = create(
combine(getDefaultState(), (set, get) => ({
+ getState: () => {
+ return get();
+ },
+ listWorkspaceSettings: async () => {
+ const { settings } = await workspaceSettingServiceClient.listWorkspaceSettings({});
+ set({ workspaceSettingByName: settings.reduce((acc, setting) => ({ ...acc, [setting.name]: setting }), {}) });
+ },
fetchWorkspaceSetting: async (key: WorkspaceSettingKey) => {
const { setting } = await workspaceSettingServiceClient.getWorkspaceSetting({ name: `${WorkspaceSettingPrefix}${key}` });
if (!setting) {
@@ -25,5 +32,9 @@ export const useWorkspaceSettingStore = create(
getWorkspaceSettingByKey: (key: WorkspaceSettingKey): WorkspaceSetting => {
return get().workspaceSettingByName[`${WorkspaceSettingPrefix}${key}`] || WorkspaceSetting.fromPartial({});
},
+ setWorkspaceSetting: async (setting: WorkspaceSetting) => {
+ await workspaceSettingServiceClient.setWorkspaceSetting({ setting });
+ set({ workspaceSettingByName: { ...get().workspaceSettingByName, [setting.name]: setting } });
+ },
})),
);
diff --git a/web/src/types/modules/system.d.ts b/web/src/types/modules/system.d.ts
deleted file mode 100644
index debecd26..00000000
--- a/web/src/types/modules/system.d.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-interface CustomizedProfile {
- name: string;
- logoUrl: string;
- description: string;
- locale: Locale;
- appearance: Appearance;
-}
-
-interface SystemStatus {
- // System settings
- disablePasswordLogin: boolean;
- disablePublicMemos: boolean;
- maxUploadSizeMiB: number;
- customizedProfile: CustomizedProfile;
- storageServiceId: number;
- localStoragePath: string;
- memoDisplayWithUpdatedTs: boolean;
-}
-
-interface SystemSetting {
- name: string;
- value: string;
-}
@@ -393,4 +328,4 @@ const SystemSection = () => {
);
};
-export default SystemSection;
+export default WorkspaceSection;
diff --git a/web/src/components/UpdateCustomizedProfileDialog.tsx b/web/src/components/UpdateCustomizedProfileDialog.tsx
index 7fe2dd51..2f595961 100644
--- a/web/src/components/UpdateCustomizedProfileDialog.tsx
+++ b/web/src/components/UpdateCustomizedProfileDialog.tsx
@@ -2,8 +2,9 @@ import { Button, IconButton, Input } from "@mui/joy";
import Textarea from "@mui/joy/Textarea/Textarea";
import { useState } from "react";
import { toast } from "react-hot-toast";
-import * as api from "@/helpers/api";
-import { useGlobalStore } from "@/store/module";
+import { WorkspaceSettingPrefix, useWorkspaceSettingStore } from "@/store/v1";
+import { WorkspaceCustomProfile, WorkspaceGeneralSetting } from "@/types/proto/api/v2/workspace_setting_service";
+import { WorkspaceSettingKey } from "@/types/proto/store/workspace_setting";
import { useTranslate } from "@/utils/i18n";
import AppearanceSelect from "./AppearanceSelect";
import { generateDialog } from "./Dialog";
@@ -14,15 +15,20 @@ type Props = DialogProps;
const UpdateCustomizedProfileDialog: React.FC = ({ destroy }: Props) => {
const t = useTranslate();
- const globalStore = useGlobalStore();
- const [state, setState] = useState(globalStore.state.systemStatus.customizedProfile);
+ const workspaceSettingStore = useWorkspaceSettingStore();
+ const workspaceGeneralSetting = WorkspaceGeneralSetting.fromPartial(
+ workspaceSettingStore.getWorkspaceSettingByKey(WorkspaceSettingKey.WORKSPACE_SETTING_GENERAL)?.generalSetting || {},
+ );
+ const [customProfile, setCustomProfile] = useState(
+ WorkspaceCustomProfile.fromPartial(workspaceGeneralSetting.customProfile || {}),
+ );
const handleCloseButtonClick = () => {
destroy();
};
- const setPartialState = (partialState: Partial) => {
- setState((state) => {
+ const setPartialState = (partialState: Partial) => {
+ setCustomProfile((state) => {
return {
...state,
...partialState,
@@ -32,7 +38,7 @@ const UpdateCustomizedProfileDialog: React.FC = ({ destroy }: Props) => {
const handleNameChanged = (e: React.ChangeEvent) => {
setPartialState({
- name: e.target.value as string,
+ title: e.target.value as string,
});
};
@@ -62,7 +68,7 @@ const UpdateCustomizedProfileDialog: React.FC = ({ destroy }: Props) => {
const handleRestoreButtonClick = () => {
setPartialState({
- name: "Memos",
+ title: "Memos",
logoUrl: "/logo.webp",
description: "",
locale: "en",
@@ -71,17 +77,19 @@ const UpdateCustomizedProfileDialog: React.FC = ({ destroy }: Props) => {
};
const handleSaveButtonClick = async () => {
- if (state.name === "") {
+ if (customProfile.title === "") {
toast.error(t("message.fill-server-name"));
return;
}
try {
- await api.upsertSystemSetting({
- name: "customized-profile",
- value: JSON.stringify(state),
+ await workspaceSettingStore.setWorkspaceSetting({
+ name: `${WorkspaceSettingPrefix}${WorkspaceSettingKey.WORKSPACE_SETTING_GENERAL}`,
+ generalSetting: {
+ ...workspaceGeneralSetting,
+ customProfile: customProfile,
+ },
});
- await globalStore.fetchSystemStatus();
} catch (error) {
console.error(error);
return;
@@ -100,15 +108,15 @@ const UpdateCustomizedProfileDialog: React.FC = ({ destroy }: Props) => {
{t("setting.system-section.server-name")}
- +{t("setting.system-section.customize-server.icon-url")}
- +{t("setting.system-section.customize-server.description")}
- +{t("setting.system-section.customize-server.locale")}
-{t("setting.system-section.customize-server.appearance")}
-