From a25deadac57b5b7904a028a98fd7e804b11531a4 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Tue, 10 Sep 2024 17:53:35 +0530
Subject: [PATCH] fix: current version sync (#1093)

---
 web/ee/components/pages/editor/page-root.tsx |  8 ++++++--
 web/ee/components/pages/version/editor.tsx   | 19 ++++++-------------
 2 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/web/ee/components/pages/editor/page-root.tsx b/web/ee/components/pages/editor/page-root.tsx
index bd526611ba..2968a9abb9 100644
--- a/web/ee/components/pages/editor/page-root.tsx
+++ b/web/ee/components/pages/editor/page-root.tsx
@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
 // plane editor
-import { EditorRefApi, useEditorMarkings } from "@plane/editor";
+import { EditorReadOnlyRefApi, EditorRefApi, useEditorMarkings } from "@plane/editor";
 // plane types
 import { TPage } from "@plane/types";
 // plane ui
@@ -37,7 +37,7 @@ export const WorkspacePageRoot = observer((props: TPageRootProps) => {
   const [isVersionsOverlayOpen, setIsVersionsOverlayOpen] = useState(false);
   // refs
   const editorRef = useRef<EditorRefApi>(null);
-  const readOnlyEditorRef = useRef<EditorRefApi>(null);
+  const readOnlyEditorRef = useRef<EditorReadOnlyRefApi>(null);
   // router
   const router = useAppRouter();
   // search params
@@ -91,11 +91,15 @@ export const WorkspacePageRoot = observer((props: TPageRootProps) => {
     editorRef.current?.clearEditor();
     editorRef.current?.setEditorValue(descriptionHTML);
   };
+  const currentVersionDescription = isContentEditable
+    ? editorRef.current?.getHTML()
+    : readOnlyEditorRef.current?.getHTML();
 
   return (
     <>
       <PageVersionsOverlay
         activeVersion={version}
+        currentVersionDescription={currentVersionDescription ?? null}
         editorComponent={WorkspacePagesVersionEditor}
         fetchAllVersions={async (pageId) => {
           if (!workspaceSlug) return;
diff --git a/web/ee/components/pages/version/editor.tsx b/web/ee/components/pages/version/editor.tsx
index 0b937f4a4e..4a8a853f46 100644
--- a/web/ee/components/pages/version/editor.tsx
+++ b/web/ee/components/pages/version/editor.tsx
@@ -3,27 +3,21 @@ import { useParams } from "next/navigation";
 // plane editor
 import { DocumentReadOnlyEditorWithRef, TDisplayConfig } from "@plane/editor";
 // plane types
-import { IUserLite, TPageVersion } from "@plane/types";
+import { IUserLite } from "@plane/types";
 // plane ui
 import { Loader } from "@plane/ui";
+// components
+import { TVersionEditorProps } from "@/components/pages";
 // hooks
 import { useMember, useUser } from "@/hooks/store";
 import { usePageFilters } from "@/hooks/use-page-filters";
 // plane web components
 import { IssueEmbedCard } from "@/plane-web/components/pages";
 // plane web hooks
-import { useWorkspacePageDetails } from "@/plane-web/hooks/store";
 import { useWorkspaceMention } from "@/plane-web/hooks/use-workspace-mention";
 
-type Props = {
-  activeVersion: string | null;
-  isCurrentVersionActive: boolean;
-  pageId: string;
-  versionDetails: TPageVersion | undefined;
-};
-
-export const WorkspacePagesVersionEditor: React.FC<Props> = observer((props) => {
-  const { activeVersion, isCurrentVersionActive, pageId, versionDetails } = props;
+export const WorkspacePagesVersionEditor: React.FC<TVersionEditorProps> = observer((props) => {
+  const { activeVersion, currentVersionDescription, isCurrentVersionActive, versionDetails } = props;
   // params
   const { workspaceSlug } = useParams();
   // store hooks
@@ -32,7 +26,6 @@ export const WorkspacePagesVersionEditor: React.FC<Props> = observer((props) =>
     getUserDetails,
     workspace: { workspaceMemberIds },
   } = useMember();
-  const currentPageDetails = useWorkspacePageDetails(pageId);
   // derived values
   const workspaceMemberDetails = workspaceMemberIds?.map((id) => getUserDetails(id) as IUserLite);
   // use-mention
@@ -91,7 +84,7 @@ export const WorkspacePagesVersionEditor: React.FC<Props> = observer((props) =>
       </div>
     );
 
-  const description = isCurrentVersionActive ? currentPageDetails.description_html : versionDetails?.description_html;
+  const description = isCurrentVersionActive ? currentVersionDescription : versionDetails?.description_html;
   if (description === undefined || description?.trim() === "") return null;
 
   return (