chore: set default memo visibility

web/src/components/Memo.tsx

@@ -60,11 +60,16 @@ const Memo: React.FC<Props> = (props: Props) => {
       });
     }
 
+    let intervalFlag = -1;
     if (Date.now() - memo.createdTs < 1000 * 60 * 60 * 24) {
-      setInterval(() => {
+      intervalFlag = setInterval(() => {
         setCreatedAtStr(getFormatedMemoCreatedAtStr(memo.createdTs, locale));
       }, 1000 * 1);
     }
+
+    return () => {
+      clearInterval(intervalFlag);
+    };
   }, [locale]);
 
   const handleShowMemoStoryDialog = () => {

web/src/components/MemoCardDialog.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect, useCallback } from "react";
 import { editorStateService, memoService, userService } from "../services";
-import { IMAGE_URL_REG, MEMO_LINK_REG, UNKNOWN_ID } from "../helpers/consts";
+import { IMAGE_URL_REG, MEMO_LINK_REG, UNKNOWN_ID, VISIBILITY_SELECTOR_ITEMS } from "../helpers/consts";
 import * as utils from "../helpers/utils";
 import { formatMemoContent, parseHtmlToRawText } from "../helpers/marked";
 import Only from "./common/OnlyWhen";
@@ -27,11 +27,6 @@ const MemoCardDialog: React.FC<Props> = (props: Props) => {
   const [linkMemos, setLinkMemos] = useState<LinkedMemo[]>([]);
   const [linkedMemos, setLinkedMemos] = useState<LinkedMemo[]>([]);
   const imageUrls = Array.from(memo.content.match(IMAGE_URL_REG) ?? []).map((s) => s.replace(IMAGE_URL_REG, "$1"));
-  const visibilityList = [
-    { text: "PUBLIC", value: "PUBLIC" },
-    { text: "PROTECTED", value: "PROTECTED" },
-    { text: "PRIVATE", value: "PRIVATE" },
-  ];
 
   useEffect(() => {
     const fetchLinkedMemos = async () => {
@@ -132,7 +127,7 @@ const MemoCardDialog: React.FC<Props> = (props: Props) => {
             <Icon.Eye className="icon-img" />
             <Selector
               className="visibility-selector"
-              dataSource={visibilityList}
+              dataSource={VISIBILITY_SELECTOR_ITEMS}
               value={memo.visibility}
               handleValueChanged={(value) => handleVisibilitySelectorChange(value as Visibility)}
             />

web/src/components/Settings/PreferencesSection.tsx

@@ -1,5 +1,6 @@
 import { globalService, userService } from "../../services";
 import { useAppSelector } from "../../store";
+import { VISIBILITY_SELECTOR_ITEMS } from "../../helpers/consts";
 import useI18n from "../../hooks/useI18n";
 import Selector from "../common/Selector";
 import "../../less/settings/preferences-section.less";
@@ -26,12 +27,25 @@ const PreferencesSection: React.FC<Props> = () => {
     await userService.upsertUserSetting("locale", value);
   };
 
+  const handleDefaultMemoVisibilityChanged = async (value: string) => {
+    await userService.upsertUserSetting("memoVisibility", value);
+  };
+
   return (
     <div className="section-container preferences-section-container">
       <label className="form-label">
         <span className="normal-text">{t("common.language")}:</span>
         <Selector className="ml-2 w-28" value={setting.locale} dataSource={localeSelectorItems} handleValueChanged={handleLocaleChanged} />
       </label>
+      <label className="form-label">
+        <span className="normal-text">{t("setting.preference-section.default-memo-visibility")}:</span>
+        <Selector
+          className="ml-2 w-28"
+          value={setting.memoVisibility}
+          dataSource={VISIBILITY_SELECTOR_ITEMS}
+          handleValueChanged={handleDefaultMemoVisibilityChanged}
+        />
+      </label>
     </div>
   );
 };

web/src/helpers/consts.ts

@@ -21,3 +21,9 @@ export const LINK_URL_REG = /\[(.*?)\]\((.+?)\)/g;
 
 // linked memo regex
 export const MEMO_LINK_REG = /@\[(.+?)\]\((.+?)\)/g;
+
+export const VISIBILITY_SELECTOR_ITEMS = [
+  { text: "PUBLIC", value: "PUBLIC" },
+  { text: "PROTECTED", value: "PROTECTED" },
+  { text: "PRIVATE", value: "PRIVATE" },
+];

web/src/labs/i18n/useI18n.ts

@@ -3,8 +3,6 @@ import i18nStore from "./i18nStore";
 import enLocale from "../../locales/en.json";
 import zhLocale from "../../locales/zh.json";
 
-type Locale = "en" | "zh";
-
 const resources: Record<string, any> = {
   en: enLocale,
   zh: zhLocale,

web/src/locales/en.json

@@ -51,6 +51,9 @@
     "account-section": {
       "title": "Account Information"
     },
+    "preference-section": {
+      "default-memo-visibility": "Default memo visibility"
+    },
     "member-section": {
       "create-a-member": "Create a member"
     }

web/src/locales/zh.json

@@ -52,6 +52,9 @@
     "account-section": {
       "title": "账号信息"
     },
+    "preference-section": {
+      "default-memo-visibility": "默认 Memo 可见性"
+    },
     "member-section": {
       "create-a-member": "创建成员"
     }

web/src/services/userService.ts

@@ -6,6 +6,7 @@ import { setUser, patchUser, setHost, setOwner } from "../store/modules/user";
 
 const defauleSetting: Setting = {
   locale: "en",
+  memoVisibility: "PRIVATE",
 };
 
 export const convertResponseModelUser = (user: User): User => {

web/src/types/modules/setting.d.ts

@@ -1,10 +1,16 @@
 interface Setting {
-  locale: "en" | "zh";
+  locale: Locale;
+  memoVisibility: Visibility;
 }
 
 interface UserLocaleSetting {
   key: "locale";
-  value: "en" | "zh";
+  value: Locale;
+}
+
+interface UserMemoVisibilitySetting {
+  key: "memoVisibility";
+  value: Visibility;
 }
 
 type UserSetting = UserLocaleSetting;