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

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";
 }