diff --git a/web/src/components/MemoContentV1/Blockquote.tsx b/web/src/components/MemoContent/Blockquote.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Blockquote.tsx
rename to web/src/components/MemoContent/Blockquote.tsx
diff --git a/web/src/components/MemoContentV1/Bold.tsx b/web/src/components/MemoContent/Bold.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Bold.tsx
rename to web/src/components/MemoContent/Bold.tsx
diff --git a/web/src/components/MemoContentV1/BoldItalic.tsx b/web/src/components/MemoContent/BoldItalic.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/BoldItalic.tsx
rename to web/src/components/MemoContent/BoldItalic.tsx
diff --git a/web/src/components/MemoContentV1/Code.tsx b/web/src/components/MemoContent/Code.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Code.tsx
rename to web/src/components/MemoContent/Code.tsx
diff --git a/web/src/components/MemoContentV1/CodeBlock.tsx b/web/src/components/MemoContent/CodeBlock.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/CodeBlock.tsx
rename to web/src/components/MemoContent/CodeBlock.tsx
diff --git a/web/src/components/MemoContentV1/EscapingCharacter.tsx b/web/src/components/MemoContent/EscapingCharacter.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/EscapingCharacter.tsx
rename to web/src/components/MemoContent/EscapingCharacter.tsx
diff --git a/web/src/components/MemoContentV1/Heading.tsx b/web/src/components/MemoContent/Heading.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Heading.tsx
rename to web/src/components/MemoContent/Heading.tsx
diff --git a/web/src/components/MemoContentV1/HorizontalRule.tsx b/web/src/components/MemoContent/HorizontalRule.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/HorizontalRule.tsx
rename to web/src/components/MemoContent/HorizontalRule.tsx
diff --git a/web/src/components/MemoContentV1/Image.tsx b/web/src/components/MemoContent/Image.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Image.tsx
rename to web/src/components/MemoContent/Image.tsx
diff --git a/web/src/components/MemoContentV1/Italic.tsx b/web/src/components/MemoContent/Italic.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Italic.tsx
rename to web/src/components/MemoContent/Italic.tsx
diff --git a/web/src/components/MemoContentV1/LineBreak.tsx b/web/src/components/MemoContent/LineBreak.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/LineBreak.tsx
rename to web/src/components/MemoContent/LineBreak.tsx
diff --git a/web/src/components/MemoContentV1/Link.tsx b/web/src/components/MemoContent/Link.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Link.tsx
rename to web/src/components/MemoContent/Link.tsx
diff --git a/web/src/components/MemoContentV1/OrderedList.tsx b/web/src/components/MemoContent/OrderedList.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/OrderedList.tsx
rename to web/src/components/MemoContent/OrderedList.tsx
diff --git a/web/src/components/MemoContentV1/Paragraph.tsx b/web/src/components/MemoContent/Paragraph.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Paragraph.tsx
rename to web/src/components/MemoContent/Paragraph.tsx
diff --git a/web/src/components/MemoContentV1/Renderer.tsx b/web/src/components/MemoContent/Renderer.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Renderer.tsx
rename to web/src/components/MemoContent/Renderer.tsx
diff --git a/web/src/components/MemoContentV1/Strikethrough.tsx b/web/src/components/MemoContent/Strikethrough.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Strikethrough.tsx
rename to web/src/components/MemoContent/Strikethrough.tsx
diff --git a/web/src/components/MemoContentV1/Tag.tsx b/web/src/components/MemoContent/Tag.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Tag.tsx
rename to web/src/components/MemoContent/Tag.tsx
diff --git a/web/src/components/MemoContentV1/TaskList.tsx b/web/src/components/MemoContent/TaskList.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/TaskList.tsx
rename to web/src/components/MemoContent/TaskList.tsx
diff --git a/web/src/components/MemoContentV1/Text.tsx b/web/src/components/MemoContent/Text.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/Text.tsx
rename to web/src/components/MemoContent/Text.tsx
diff --git a/web/src/components/MemoContentV1/UnorderedList.tsx b/web/src/components/MemoContent/UnorderedList.tsx
similarity index 100%
rename from web/src/components/MemoContentV1/UnorderedList.tsx
rename to web/src/components/MemoContent/UnorderedList.tsx
diff --git a/web/src/components/MemoContentV1/index.tsx b/web/src/components/MemoContent/index.tsx
similarity index 94%
rename from web/src/components/MemoContentV1/index.tsx
rename to web/src/components/MemoContent/index.tsx
index fa9b50ea..735b73fd 100644
--- a/web/src/components/MemoContentV1/index.tsx
+++ b/web/src/components/MemoContent/index.tsx
@@ -11,7 +11,7 @@ interface Props {
   onMemoContentClick?: (e: React.MouseEvent) => void;
 }
 
-const MemoContentV1: React.FC<Props> = (props: Props) => {
+const MemoContent: React.FC<Props> = (props: Props) => {
   const { className, content, onMemoContentClick } = props;
   const [nodes, setNodes] = useState<Node[]>(props.nodes ?? []);
   const memoContentContainerRef = useRef<HTMLDivElement>(null);
@@ -51,4 +51,4 @@ const MemoContentV1: React.FC<Props> = (props: Props) => {
   );
 };
 
-export default MemoContentV1;
+export default MemoContent;
diff --git a/web/src/components/MemoContentV1/types/context.ts b/web/src/components/MemoContent/types/context.ts
similarity index 100%
rename from web/src/components/MemoContentV1/types/context.ts
rename to web/src/components/MemoContent/types/context.ts
diff --git a/web/src/components/MemoContentV1/types/index.ts b/web/src/components/MemoContent/types/index.ts
similarity index 100%
rename from web/src/components/MemoContentV1/types/index.ts
rename to web/src/components/MemoContent/types/index.ts
diff --git a/web/src/components/MemoEditorV1/ActionButton/TagSelector.tsx b/web/src/components/MemoEditor/ActionButton/TagSelector.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/ActionButton/TagSelector.tsx
rename to web/src/components/MemoEditor/ActionButton/TagSelector.tsx
diff --git a/web/src/components/MemoEditorV1/Editor/TagSuggestions.tsx b/web/src/components/MemoEditor/Editor/TagSuggestions.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/Editor/TagSuggestions.tsx
rename to web/src/components/MemoEditor/Editor/TagSuggestions.tsx
diff --git a/web/src/components/MemoEditorV1/Editor/index.tsx b/web/src/components/MemoEditor/Editor/index.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/Editor/index.tsx
rename to web/src/components/MemoEditor/Editor/index.tsx
diff --git a/web/src/components/MemoEditorV1/MemoEditorDialog.tsx b/web/src/components/MemoEditor/MemoEditorDialog.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/MemoEditorDialog.tsx
rename to web/src/components/MemoEditor/MemoEditorDialog.tsx
diff --git a/web/src/components/MemoEditorV1/RelationListView.tsx b/web/src/components/MemoEditor/RelationListView.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/RelationListView.tsx
rename to web/src/components/MemoEditor/RelationListView.tsx
diff --git a/web/src/components/MemoEditorV1/ResourceListView.tsx b/web/src/components/MemoEditor/ResourceListView.tsx
similarity index 100%
rename from web/src/components/MemoEditorV1/ResourceListView.tsx
rename to web/src/components/MemoEditor/ResourceListView.tsx
diff --git a/web/src/components/MemoEditorV1/index.tsx b/web/src/components/MemoEditor/index.tsx
similarity index 99%
rename from web/src/components/MemoEditorV1/index.tsx
rename to web/src/components/MemoEditor/index.tsx
index 61db7a45..8df1e042 100644
--- a/web/src/components/MemoEditorV1/index.tsx
+++ b/web/src/components/MemoEditor/index.tsx
@@ -17,7 +17,7 @@ import { convertVisibilityFromString, convertVisibilityToString } from "@/utils/
 import showCreateMemoRelationDialog from "../CreateMemoRelationDialog";
 import showCreateResourceDialog from "../CreateResourceDialog";
 import Icon from "../Icon";
-import VisibilityIconV1 from "../VisibilityIconV1";
+import VisibilityIcon from "../VisibilityIcon";
 import TagSelector from "./ActionButton/TagSelector";
 import Editor, { EditorRefActions } from "./Editor";
 import RelationListView from "./RelationListView";
@@ -427,7 +427,7 @@ const MemoEditor = (props: Props) => {
           <Select
             variant="plain"
             value={state.memoVisibility}
-            startDecorator={<VisibilityIconV1 visibility={state.memoVisibility} />}
+            startDecorator={<VisibilityIcon visibility={state.memoVisibility} />}
             onChange={(_, visibility) => {
               if (visibility) {
                 handleMemoVisibilityChange(visibility);
diff --git a/web/src/components/MemoRelationListViewV1.tsx b/web/src/components/MemoRelationListView.tsx
similarity index 97%
rename from web/src/components/MemoRelationListViewV1.tsx
rename to web/src/components/MemoRelationListView.tsx
index 0423c057..c257eb52 100644
--- a/web/src/components/MemoRelationListViewV1.tsx
+++ b/web/src/components/MemoRelationListView.tsx
@@ -11,7 +11,7 @@ interface Props {
   relationList: MemoRelation[];
 }
 
-const MemoRelationListViewV1 = (props: Props) => {
+const MemoRelationListView = (props: Props) => {
   const { memo, relationList } = props;
   const memoStore = useMemoV1Store();
   const [referencingMemoList, setReferencingMemoList] = useState<Memo[]>([]);
@@ -80,4 +80,4 @@ const MemoRelationListViewV1 = (props: Props) => {
   );
 };
 
-export default MemoRelationListViewV1;
+export default MemoRelationListView;
diff --git a/web/src/components/MemoViewV1.tsx b/web/src/components/MemoView.tsx
similarity index 94%
rename from web/src/components/MemoViewV1.tsx
rename to web/src/components/MemoView.tsx
index 5d525064..40c3b245 100644
--- a/web/src/components/MemoViewV1.tsx
+++ b/web/src/components/MemoView.tsx
@@ -18,14 +18,14 @@ import { convertVisibilityToString } from "@/utils/memo";
 import showChangeMemoCreatedTsDialog from "./ChangeMemoCreatedTsDialog";
 import { showCommonDialog } from "./Dialog/CommonDialog";
 import Icon from "./Icon";
-import MemoContentV1 from "./MemoContentV1";
-import showMemoEditorDialog from "./MemoEditorV1/MemoEditorDialog";
-import MemoRelationListViewV1 from "./MemoRelationListViewV1";
+import MemoContent from "./MemoContent";
+import showMemoEditorDialog from "./MemoEditor/MemoEditorDialog";
+import MemoRelationListView from "./MemoRelationListView";
 import MemoResourceListView from "./MemoResourceListView";
 import showPreviewImageDialog from "./PreviewImageDialog";
-import showShareMemoDialogV1 from "./ShareMemoDialogV1";
+import showShareMemoDialog from "./ShareMemoDialog";
 import UserAvatar from "./UserAvatar";
-import VisibilityIconV1 from "./VisibilityIconV1";
+import VisibilityIcon from "./VisibilityIcon";
 import "@/less/memo.less";
 
 interface Props {
@@ -37,7 +37,7 @@ interface Props {
   lazyRendering?: boolean;
 }
 
-const MemoViewV1: React.FC<Props> = (props: Props) => {
+const MemoView: React.FC<Props> = (props: Props) => {
   const { memo, lazyRendering } = props;
   const t = useTranslate();
   const navigateTo = useNavigateTo();
@@ -263,7 +263,7 @@ const MemoViewV1: React.FC<Props> = (props: Props) => {
                 <Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
                 <Tooltip title={t(`memo.visibility.${convertVisibilityToString(memo.visibility)}` as any)} placement="top">
                   <span>
-                    <VisibilityIconV1 visibility={memo.visibility} />
+                    <VisibilityIcon visibility={memo.visibility} />
                   </span>
                 </Tooltip>
               </>
@@ -294,7 +294,7 @@ const MemoViewV1: React.FC<Props> = (props: Props) => {
                       {t("common.mark")}
                     </span>
                   )}
-                  <span className="btn" onClick={() => showShareMemoDialogV1(memo)}>
+                  <span className="btn" onClick={() => showShareMemoDialog(memo)}>
                     <Icon.Share className="w-4 h-auto mr-2" />
                     {t("common.share")}
                   </span>
@@ -325,11 +325,11 @@ const MemoViewV1: React.FC<Props> = (props: Props) => {
           </Link>
         </div>
       )}
-      <MemoContentV1 content={memo.content} nodes={memo.nodes} onMemoContentClick={handleMemoContentClick} />
+      <MemoContent content={memo.content} nodes={memo.nodes} onMemoContentClick={handleMemoContentClick} />
       <MemoResourceListView resourceList={resources} />
-      <MemoRelationListViewV1 memo={memo} relationList={referenceRelations} />
+      <MemoRelationListView memo={memo} relationList={referenceRelations} />
     </div>
   );
 };
 
-export default memo(MemoViewV1);
+export default memo(MemoView);
diff --git a/web/src/components/Settings/PreferencesSection.tsx b/web/src/components/Settings/PreferencesSection.tsx
index 3ff7ad72..544d85da 100644
--- a/web/src/components/Settings/PreferencesSection.tsx
+++ b/web/src/components/Settings/PreferencesSection.tsx
@@ -2,11 +2,12 @@ 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 { VISIBILITY_SELECTOR_ITEMS } from "@/helpers/consts";
 import { useGlobalStore } from "@/store/module";
 import { useUserV1Store } from "@/store/v1";
+import { Visibility } from "@/types/proto/api/v2/memo_service";
 import { UserSetting } from "@/types/proto/api/v2/user_service";
 import { useTranslate } from "@/utils/i18n";
+import { convertVisibilityFromString, convertVisibilityToString } from "@/utils/memo";
 import AppearanceSelect from "../AppearanceSelect";
 import Icon from "../Icon";
 import LocaleSelect from "../LocaleSelect";
@@ -87,18 +88,20 @@ const PreferencesSection = () => {
         <Select
           className="!min-w-fit"
           value={setting.memoVisibility}
-          startDecorator={<VisibilityIcon visibility={setting.memoVisibility as Visibility} />}
+          startDecorator={<VisibilityIcon visibility={convertVisibilityFromString(setting.memoVisibility)} />}
           onChange={(_, visibility) => {
             if (visibility) {
               handleDefaultMemoVisibilityChanged(visibility);
             }
           }}
         >
-          {VISIBILITY_SELECTOR_ITEMS.map((item) => (
-            <Option key={item} value={item} className="whitespace-nowrap">
-              {t(`memo.visibility.${item.toLowerCase() as Lowercase<typeof item>}`)}
-            </Option>
-          ))}
+          {[Visibility.PRIVATE, Visibility.PROTECTED, Visibility.PUBLIC]
+            .map((v) => convertVisibilityToString(v))
+            .map((item) => (
+              <Option key={item} value={item} className="whitespace-nowrap">
+                {t(`memo.visibility.${item.toLowerCase() as Lowercase<typeof item>}`)}
+              </Option>
+            ))}
         </Select>
       </div>
 
diff --git a/web/src/components/ShareMemoDialogV1.tsx b/web/src/components/ShareMemoDialog.tsx
similarity index 93%
rename from web/src/components/ShareMemoDialogV1.tsx
rename to web/src/components/ShareMemoDialog.tsx
index 30614c45..a7901ba3 100644
--- a/web/src/components/ShareMemoDialogV1.tsx
+++ b/web/src/components/ShareMemoDialog.tsx
@@ -11,7 +11,7 @@ import { Resource } from "@/types/proto/api/v2/resource_service";
 import { useTranslate } from "@/utils/i18n";
 import { generateDialog } from "./Dialog";
 import Icon from "./Icon";
-import MemoContentV1 from "./MemoContentV1";
+import MemoContent from "./MemoContent";
 import MemoResourceListView from "./MemoResourceListView";
 import UserAvatar from "./UserAvatar";
 import "@/less/share-memo-dialog.less";
@@ -20,7 +20,7 @@ interface Props extends DialogProps {
   memo: Memo;
 }
 
-const ShareMemoDialogV1: React.FC<Props> = (props: Props) => {
+const ShareMemoDialog: React.FC<Props> = (props: Props) => {
   const { memo, destroy } = props;
   const t = useTranslate();
   const userV1Store = useUserV1Store();
@@ -104,7 +104,7 @@ const ShareMemoDialogV1: React.FC<Props> = (props: Props) => {
           >
             <span className="w-full px-6 pt-5 pb-2 text-sm text-gray-500">{getTimeString(memo.displayTime)}</span>
             <div className="w-full px-6 text-base pb-4">
-              <MemoContentV1 content={memo.content} />
+              <MemoContent content={memo.content} />
               <MemoResourceListView resourceList={resources} />
             </div>
             <div className="flex flex-row justify-between items-center w-full bg-gray-100 dark:bg-zinc-700 py-4 px-6">
@@ -125,13 +125,13 @@ const ShareMemoDialogV1: React.FC<Props> = (props: Props) => {
   );
 };
 
-export default function showShareMemoDialogV1(memo: Memo): void {
+export default function showShareMemoDialog(memo: Memo): void {
   generateDialog(
     {
-      className: "share-memo-dialog-v1",
-      dialogName: "share-memo-dialog-v1",
+      className: "share-memo-dialog",
+      dialogName: "share-memo-dialog",
     },
-    ShareMemoDialogV1,
+    ShareMemoDialog,
     { memo }
   );
 }
diff --git a/web/src/components/TimelineMemo.tsx b/web/src/components/TimelineMemo.tsx
index 9e82ec1e..c9113465 100644
--- a/web/src/components/TimelineMemo.tsx
+++ b/web/src/components/TimelineMemo.tsx
@@ -1,13 +1,13 @@
 import { useEffect, useState } from "react";
 import Icon from "@/components/Icon";
-import MemoContentV1 from "@/components/MemoContentV1";
+import MemoContent from "@/components/MemoContent";
 import MemoResourceListView from "@/components/MemoResourceListView";
 import { getTimeString } from "@/helpers/datetime";
 import { useMemoV1Store } from "@/store/v1";
 import { MemoRelation, MemoRelation_Type } from "@/types/proto/api/v2/memo_relation_service";
 import { Memo } from "@/types/proto/api/v2/memo_service";
 import { Resource } from "@/types/proto/api/v2/resource_service";
-import MemoRelationListViewV1 from "./MemoRelationListViewV1";
+import MemoRelationListView from "./MemoRelationListView";
 
 interface Props {
   memo: Memo;
@@ -35,9 +35,9 @@ const TimelineMemo = (props: Props) => {
         <Icon.Dot className="w-5 h-auto opacity-60" />
         <span className="opacity-60">#{memo.id}</span>
       </div>
-      <MemoContentV1 content={memo.content} nodes={memo.nodes} />
+      <MemoContent content={memo.content} nodes={memo.nodes} />
       <MemoResourceListView resourceList={resources} />
-      <MemoRelationListViewV1 memo={memo} relationList={relations} />
+      <MemoRelationListView memo={memo} relationList={relations} />
     </div>
   );
 };
diff --git a/web/src/components/VisibilityIcon.tsx b/web/src/components/VisibilityIcon.tsx
index 5dc5a12b..dfbd8a89 100644
--- a/web/src/components/VisibilityIcon.tsx
+++ b/web/src/components/VisibilityIcon.tsx
@@ -1,4 +1,5 @@
 import classNames from "classnames";
+import { Visibility } from "@/types/proto/api/v2/memo_service";
 import Icon from "./Icon";
 
 interface Props {
@@ -9,11 +10,11 @@ const VisibilityIcon = (props: Props) => {
   const { visibility } = props;
 
   let VIcon = null;
-  if (visibility === "PRIVATE") {
+  if (visibility === Visibility.PRIVATE) {
     VIcon = Icon.Lock;
-  } else if (visibility === "PROTECTED") {
+  } else if (visibility === Visibility.PROTECTED) {
     VIcon = Icon.Users;
-  } else if (visibility === "PUBLIC") {
+  } else if (visibility === Visibility.PUBLIC) {
     VIcon = Icon.Globe2;
   }
   if (!VIcon) {
diff --git a/web/src/components/VisibilityIconV1.tsx b/web/src/components/VisibilityIconV1.tsx
deleted file mode 100644
index dfbd8a89..00000000
--- a/web/src/components/VisibilityIconV1.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import classNames from "classnames";
-import { Visibility } from "@/types/proto/api/v2/memo_service";
-import Icon from "./Icon";
-
-interface Props {
-  visibility: Visibility;
-}
-
-const VisibilityIcon = (props: Props) => {
-  const { visibility } = props;
-
-  let VIcon = null;
-  if (visibility === Visibility.PRIVATE) {
-    VIcon = Icon.Lock;
-  } else if (visibility === Visibility.PROTECTED) {
-    VIcon = Icon.Users;
-  } else if (visibility === Visibility.PUBLIC) {
-    VIcon = Icon.Globe2;
-  }
-  if (!VIcon) {
-    return null;
-  }
-
-  return <VIcon className={classNames("w-4 h-auto text-gray-400")} />;
-};
-
-export default VisibilityIcon;
diff --git a/web/src/helpers/consts.ts b/web/src/helpers/consts.ts
index 68ef77ec..ebd127ec 100644
--- a/web/src/helpers/consts.ts
+++ b/web/src/helpers/consts.ts
@@ -7,8 +7,6 @@ export const ANIMATION_DURATION = 200;
 // millisecond in a day
 export const DAILY_TIMESTAMP = 3600 * 24 * 1000;
 
-export const VISIBILITY_SELECTOR_ITEMS = ["PRIVATE", "PROTECTED", "PUBLIC"] as const;
-
 // space width for tab action in editor
 export const TAB_SPACE_WIDTH = 2;
 
diff --git a/web/src/pages/Archived.tsx b/web/src/pages/Archived.tsx
index 958adb50..818a53fb 100644
--- a/web/src/pages/Archived.tsx
+++ b/web/src/pages/Archived.tsx
@@ -4,7 +4,7 @@ import toast from "react-hot-toast";
 import { showCommonDialog } from "@/components/Dialog/CommonDialog";
 import Empty from "@/components/Empty";
 import Icon from "@/components/Icon";
-import MemoContentV1 from "@/components/MemoContentV1";
+import MemoContent from "@/components/MemoContent";
 import MobileHeader from "@/components/MobileHeader";
 import { memoServiceClient } from "@/grpcweb";
 import { getDateTimeString } from "@/helpers/datetime";
@@ -104,7 +104,7 @@ const Archived = () => {
                     </Tooltip>
                   </div>
                 </div>
-                <MemoContentV1 content={memo.content} nodes={memo.nodes} />
+                <MemoContent content={memo.content} nodes={memo.nodes} />
               </div>
             ))}
           </div>
diff --git a/web/src/pages/Explore.tsx b/web/src/pages/Explore.tsx
index 80dcf0c9..49f70a3d 100644
--- a/web/src/pages/Explore.tsx
+++ b/web/src/pages/Explore.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useRef, useState } from "react";
 import Empty from "@/components/Empty";
 import MemoFilter from "@/components/MemoFilter";
-import MemoViewV1 from "@/components/MemoViewV1";
+import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
 import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
@@ -56,7 +56,7 @@ const Explore = () => {
       <div className="relative w-full h-auto flex flex-col justify-start items-start px-4 sm:px-6">
         <MemoFilter />
         {sortedMemos.map((memo) => (
-          <MemoViewV1 key={memo.id} memo={memo} lazyRendering showCreator showParent />
+          <MemoView key={memo.id} memo={memo} lazyRendering showCreator showParent />
         ))}
 
         {isRequesting && (
diff --git a/web/src/pages/Home.tsx b/web/src/pages/Home.tsx
index b4228066..f4045979 100644
--- a/web/src/pages/Home.tsx
+++ b/web/src/pages/Home.tsx
@@ -2,9 +2,9 @@ import { useEffect, useRef, useState } from "react";
 import Empty from "@/components/Empty";
 import HomeSidebar from "@/components/HomeSidebar";
 import HomeSidebarDrawer from "@/components/HomeSidebarDrawer";
-import MemoEditorV1 from "@/components/MemoEditorV1";
+import MemoEditor from "@/components/MemoEditor";
 import MemoFilter from "@/components/MemoFilter";
-import MemoViewV1 from "@/components/MemoViewV1";
+import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
 import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
 import { getTimeStampByDate } from "@/helpers/datetime";
@@ -67,11 +67,11 @@ const Home = () => {
       <div className="w-full sm:pt-3 md:pt-6">
         <MobileHeader>{!md && <HomeSidebarDrawer />}</MobileHeader>
         <div className="w-full px-4 sm:px-6 md:pr-2">
-          <MemoEditorV1 className="mb-2" cacheKey="home-memo-editor" onConfirm={handleMemoCreated} />
+          <MemoEditor className="mb-2" cacheKey="home-memo-editor" onConfirm={handleMemoCreated} />
           <div className="flex flex-col justify-start items-start w-full max-w-full overflow-y-scroll pb-28 hide-scrollbar">
             <MemoFilter />
             {sortedMemos.map((memo) => (
-              <MemoViewV1 key={memo.id} memo={memo} lazyRendering showVisibility showPinnedStyle showParent />
+              <MemoView key={memo.id} memo={memo} lazyRendering showVisibility showPinnedStyle showParent />
             ))}
             {isRequesting && (
               <div className="flex flex-col justify-start items-center w-full my-8">
diff --git a/web/src/pages/MemoDetail.tsx b/web/src/pages/MemoDetail.tsx
index 716c2866..79a2391a 100644
--- a/web/src/pages/MemoDetail.tsx
+++ b/web/src/pages/MemoDetail.tsx
@@ -4,16 +4,16 @@ import { useEffect, useState } from "react";
 import { toast } from "react-hot-toast";
 import { Link, useParams } from "react-router-dom";
 import Icon from "@/components/Icon";
-import MemoContentV1 from "@/components/MemoContentV1";
-import MemoEditorV1 from "@/components/MemoEditorV1";
-import showMemoEditorDialog from "@/components/MemoEditorV1/MemoEditorDialog";
-import MemoRelationListViewV1 from "@/components/MemoRelationListViewV1";
+import MemoContent from "@/components/MemoContent";
+import MemoEditor from "@/components/MemoEditor";
+import showMemoEditorDialog from "@/components/MemoEditor/MemoEditorDialog";
+import MemoRelationListView from "@/components/MemoRelationListView";
 import MemoResourceListView from "@/components/MemoResourceListView";
-import MemoViewV1 from "@/components/MemoViewV1";
+import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
-import showShareMemoDialogV1 from "@/components/ShareMemoDialogV1";
+import showShareMemoDialog from "@/components/ShareMemoDialog";
 import UserAvatar from "@/components/UserAvatar";
-import VisibilityIconV1 from "@/components/VisibilityIconV1";
+import VisibilityIcon from "@/components/VisibilityIcon";
 import { UNKNOWN_ID } from "@/helpers/consts";
 import { getDateTimeString } from "@/helpers/datetime";
 import useCurrentUser from "@/hooks/useCurrentUser";
@@ -141,9 +141,9 @@ const MemoDetail = () => {
           <div className="w-full mb-2 flex flex-row justify-start items-center">
             <span className="text-gray-400 select-none">{getDateTimeString(memo.displayTime)}</span>
           </div>
-          <MemoContentV1 content={memo.content} />
+          <MemoContent content={memo.content} />
           <MemoResourceListView resourceList={resources} />
-          <MemoRelationListViewV1 memo={memo} relationList={referenceRelations} />
+          <MemoRelationListView memo={memo} relationList={referenceRelations} />
           <div className="w-full mt-4 flex flex-col sm:flex-row justify-start sm:justify-between sm:items-center gap-2">
             <div className="flex flex-row justify-start items-center">
               <Tooltip title={"Identifier"} placement="top">
@@ -165,7 +165,7 @@ const MemoDetail = () => {
                     className="w-auto text-sm"
                     variant="plain"
                     value={memo.visibility}
-                    startDecorator={<VisibilityIconV1 visibility={memo.visibility} />}
+                    startDecorator={<VisibilityIcon visibility={memo.visibility} />}
                     onChange={(_, visibility) => {
                       if (visibility) {
                         handleMemoVisibilityOptionChanged(visibility);
@@ -195,7 +195,7 @@ const MemoDetail = () => {
                 </IconButton>
               </Tooltip>
               <Tooltip title={"Share"} placement="top">
-                <IconButton size="sm" onClick={() => showShareMemoDialogV1(memo)}>
+                <IconButton size="sm" onClick={() => showShareMemoDialog(memo)}>
                   <Icon.Share className="w-4 h-auto text-gray-600 dark:text-gray-400" />
                 </IconButton>
               </Tooltip>
@@ -217,14 +217,14 @@ const MemoDetail = () => {
                   <span className="text-gray-400 text-sm ml-0.5">({comments.length})</span>
                 </div>
                 {comments.map((comment) => (
-                  <MemoViewV1 key={comment.id} memo={comment} showCreator />
+                  <MemoView key={comment.id} memo={comment} showCreator />
                 ))}
               </>
             )}
 
             {/* Only show comment editor when user login */}
             {currentUser && (
-              <MemoEditorV1
+              <MemoEditor
                 key={memo.id}
                 cacheKey={`comment-editor-${memo.id}`}
                 relationList={[{ memoId: UNKNOWN_ID, relatedMemoId: memo.id, type: MemoRelation_Type.COMMENT }]}
diff --git a/web/src/pages/Timeline.tsx b/web/src/pages/Timeline.tsx
index dc3aea23..bb393601 100644
--- a/web/src/pages/Timeline.tsx
+++ b/web/src/pages/Timeline.tsx
@@ -3,7 +3,7 @@ import { useEffect, useState } from "react";
 import useToggle from "react-use/lib/useToggle";
 import Empty from "@/components/Empty";
 import Icon from "@/components/Icon";
-import MemoEditorV1 from "@/components/MemoEditorV1";
+import MemoEditor from "@/components/MemoEditor";
 import MobileHeader from "@/components/MobileHeader";
 import TimelineMemo from "@/components/TimelineMemo";
 import DatePicker from "@/components/kit/DatePicker";
@@ -108,7 +108,7 @@ const Timeline = () => {
               ))}
               {selectedDateStamp === currentDateStamp && (
                 <div className="w-full pl-0 sm:pl-12 sm:mt-4">
-                  <MemoEditorV1 cacheKey="timeline-editor" onConfirm={handleMemoCreate} />
+                  <MemoEditor cacheKey="timeline-editor" onConfirm={handleMemoCreate} />
                 </div>
               )}
             </div>
diff --git a/web/src/pages/UserProfile.tsx b/web/src/pages/UserProfile.tsx
index d0791736..d5847429 100644
--- a/web/src/pages/UserProfile.tsx
+++ b/web/src/pages/UserProfile.tsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { toast } from "react-hot-toast";
 import { useParams } from "react-router-dom";
 import Empty from "@/components/Empty";
-import MemoViewV1 from "@/components/MemoViewV1";
+import MemoView from "@/components/MemoView";
 import MobileHeader from "@/components/MobileHeader";
 import UserAvatar from "@/components/UserAvatar";
 import { DEFAULT_MEMO_LIMIT } from "@/helpers/consts";
@@ -79,7 +79,7 @@ const UserProfile = () => {
                 <p className="text-3xl text-black opacity-80 dark:text-gray-200">{user?.nickname}</p>
               </div>
               {memos.map((memo) => (
-                <MemoViewV1 key={memo.id} memo={memo} lazyRendering showVisibility showPinnedStyle showParent />
+                <MemoView key={memo.id} memo={memo} lazyRendering showVisibility showPinnedStyle showParent />
               ))}
               {isRequesting && (
                 <div className="flex flex-col justify-start items-center w-full my-8">