chore: remove mobile editor style user setting (#455)

api/user_setting.go

@@ -12,8 +12,6 @@ const (
 	UserSettingLocaleKey UserSettingKey = "locale"
 	// UserSettingMemoVisibilityKey is the key type for user preference memo default visibility.
 	UserSettingMemoVisibilityKey UserSettingKey = "memoVisibility"
-	// UserSettingMobileEditorStyleKey is the key type for mobile editor style.
-	UserSettingMobileEditorStyleKey UserSettingKey = "mobileEditorStyle"
 	// UserSettingMemoDisplayTsOptionKey is the key type for memo display ts option.
 	UserSettingMemoDisplayTsOptionKey UserSettingKey = "memoDisplayTsOption"
 )
@@ -25,8 +23,6 @@ func (key UserSettingKey) String() string {
 		return "locale"
 	case UserSettingMemoVisibilityKey:
 		return "memoVisibility"
-	case UserSettingMobileEditorStyleKey:
-		return "mobileEditorStyle"
 	case UserSettingMemoDisplayTsOptionKey:
 		return "memoDisplayTsOption"
 	}
@@ -37,7 +33,6 @@ var (
 	UserSettingLocaleValue                 = []string{"en", "zh", "vi"}
 	UserSettingMemoVisibilityValue         = []Visibility{Privite, Protected, Public}
 	UserSettingEditorFontStyleValue        = []string{"normal", "mono"}
-	UserSettingMobileEditorStyleValue      = []string{"normal", "float"}
 	UserSettingMemoDisplayTsOptionKeyValue = []string{"created_ts", "updated_ts"}
 )
 
@@ -89,23 +84,6 @@ func (upsert UserSettingUpsert) Validate() error {
 		if invalid {
 			return fmt.Errorf("invalid user setting memo visibility value")
 		}
-	} else if upsert.Key == UserSettingMobileEditorStyleKey {
-		mobileEditorStyleValue := "normal"
-		err := json.Unmarshal([]byte(upsert.Value), &mobileEditorStyleValue)
-		if err != nil {
-			return fmt.Errorf("failed to unmarshal user setting mobile editor style")
-		}
-
-		invalid := true
-		for _, value := range UserSettingMobileEditorStyleValue {
-			if mobileEditorStyleValue == value {
-				invalid = false
-				break
-			}
-		}
-		if invalid {
-			return fmt.Errorf("invalid user setting mobile editor style value")
-		}
 	} else if upsert.Key == UserSettingMemoDisplayTsOptionKey {
 		memoDisplayTsOption := "created_ts"
 		err := json.Unmarshal([]byte(upsert.Value), &memoDisplayTsOption)

web/src/components/MemoEditor.tsx

@@ -53,7 +53,6 @@ const MemoEditor = () => {
   const prevGlobalStateRef = useRef(editorState);
   const editorRef = useRef<EditorRefActions>(null);
   const tagSeletorRef = useRef<HTMLDivElement>(null);
-  const mobileEditorStyle = user?.setting.mobileEditorStyle || "normal";
   const memoVisibilityOptionSelectorItems = VISIBILITY_SELECTOR_ITEMS.map((item) => {
     return {
       value: item.value,
@@ -408,7 +407,7 @@ const MemoEditor = () => {
 
   return (
     <div
-      className={`memo-editor-container ${mobileEditorStyle} ${isEditing ? "edit-ing" : ""} ${state.fullscreen ? "fullscreen" : ""}`}
+      className={`memo-editor-container ${isEditing ? "edit-ing" : ""} ${state.fullscreen ? "fullscreen" : ""}`}
       tabIndex={0}
       onKeyDown={handleKeyDown}
       onDrop={handleDropEvent}

web/src/components/Settings/PreferencesSection.tsx

@@ -20,17 +20,6 @@ const localeSelectorItems = [
   },
 ];
 
-const mobileEditorStyleSelectorItems = [
-  {
-    text: "Normal",
-    value: "normal",
-  },
-  {
-    text: "Float",
-    value: "float",
-  },
-];
-
 const PreferencesSection = () => {
   const { t } = useTranslation();
   const { setting } = useAppSelector((state) => state.user.user as User);
@@ -57,10 +46,6 @@ const PreferencesSection = () => {
     await userService.upsertUserSetting("memoVisibility", value);
   };
 
-  const handleMobileEditorStyleChanged = async (value: string) => {
-    await userService.upsertUserSetting("mobileEditorStyle", value);
-  };
-
   const handleMemoDisplayTsOptionChanged = async (value: string) => {
     await userService.upsertUserSetting("memoDisplayTsOption", value);
   };
@@ -82,15 +67,6 @@ const PreferencesSection = () => {
           handleValueChanged={handleDefaultMemoVisibilityChanged}
         />
       </label>
-      <label className="form-label selector">
-        <span className="normal-text">{t("setting.preference-section.mobile-editor-style")}</span>
-        <Selector
-          className="ml-2 w-32"
-          value={setting.mobileEditorStyle}
-          dataSource={mobileEditorStyleSelectorItems}
-          handleValueChanged={handleMobileEditorStyleChanged}
-        />
-      </label>
       <label className="form-label selector">
         <span className="normal-text">{t("setting.preference-section.default-memo-sort-option")}</span>
         <Selector

web/src/less/memo-editor.less

@@ -3,26 +3,6 @@
 .memo-editor-container {
   @apply transition-all relative w-full flex flex-col justify-start items-start bg-white p-4 pt-3 rounded-lg border-2 border-gray-200;
 
-  &.float {
-    @media (max-width: 640px) {
-      @apply fixed w-full bottom-0 left-0 border-none rounded-none;
-      background-color: #f6f5f4;
-
-      > .memo-editor {
-        @apply p-4 mb-2 rounded-lg border-2 flex flex-col flex-grow justify-start items-start relative w-full h-full bg-white;
-      }
-
-      .tag-action > .tag-list {
-        @apply bottom-7;
-        top: unset !important;
-      }
-      .emoji-picker-react {
-        @apply !bottom-8;
-        top: unset !important;
-      }
-    }
-  }
-
   &.fullscreen {
     @apply fixed w-full h-full top-0 left-0 z-1000 border-none rounded-none sm:p-8;
     background-color: #f6f5f4;

web/src/services/userService.ts

@@ -7,7 +7,6 @@ import { setUser, patchUser, setHost, setOwner } from "../store/modules/user";
 const defauleSetting: Setting = {
   locale: "en",
   memoVisibility: "PRIVATE",
-  mobileEditorStyle: "normal",
   memoDisplayTsOption: "created_ts",
 };
 

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

@@ -1,7 +1,6 @@
 interface Setting {
   locale: Locale;
   memoVisibility: Visibility;
-  mobileEditorStyle: "normal" | "float";
   memoDisplayTsOption: "created_ts" | "updated_ts";
 }