From fb2a04dc14879cd0d2f8a64a60d04a83d2f42edc Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Wed, 28 Aug 2024 14:03:01 +0530
Subject: [PATCH] chore: add authorization to restore version (#5444)

---
 web/ce/components/pages/version/editor.tsx     | 11 +++++++----
 web/core/components/pages/editor/page-root.tsx |  3 ++-
 .../components/pages/version/main-content.tsx  |  7 +++++--
 web/core/components/pages/version/root.tsx     | 18 +++++++++++++++---
 4 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/web/ce/components/pages/version/editor.tsx b/web/ce/components/pages/version/editor.tsx
index 973cb2b459..d176022bc5 100644
--- a/web/ce/components/pages/version/editor.tsx
+++ b/web/ce/components/pages/version/editor.tsx
@@ -15,20 +15,21 @@ import { useIssueEmbed } from "@/plane-web/hooks/use-issue-embed";
 type Props = {
   activeVersion: string | null;
   isCurrentVersionActive: boolean;
+  pageId: string;
   versionDetails: TPageVersion | undefined;
 };
 
 export const PagesVersionEditor: React.FC<Props> = observer((props) => {
-  const { activeVersion, isCurrentVersionActive, versionDetails } = props;
+  const { activeVersion, isCurrentVersionActive, pageId, versionDetails } = props;
   // params
-  const { workspaceSlug, projectId, pageId } = useParams();
+  const { workspaceSlug, projectId } = useParams();
   // store hooks
   const { data: currentUser } = useUser();
   const {
     getUserDetails,
     project: { getProjectMemberIds },
   } = useMember();
-  const { description_html } = usePage(pageId.toString() ?? "");
+  const currentPageDetails = usePage(pageId);
   // derived values
   const projectMemberIds = projectId ? getProjectMemberIds(projectId.toString()) : [];
   const projectMemberDetails = projectMemberIds?.map((id) => getUserDetails(id) as IUserLite);
@@ -94,7 +95,9 @@ export const PagesVersionEditor: React.FC<Props> = observer((props) => {
   return (
     <DocumentReadOnlyEditorWithRef
       id={activeVersion ?? ""}
-      initialValue={(isCurrentVersionActive ? description_html : versionDetails?.description_html) ?? "<p></p>"}
+      initialValue={
+        (isCurrentVersionActive ? currentPageDetails.description_html : versionDetails?.description_html) ?? "<p></p>"
+      }
       containerClassName="p-0 pb-64 border-none"
       displayConfig={displayConfig}
       editorClassName="pl-10"
diff --git a/web/core/components/pages/editor/page-root.tsx b/web/core/components/pages/editor/page-root.tsx
index bbb5acf819..45ca62e3df 100644
--- a/web/core/components/pages/editor/page-root.tsx
+++ b/web/core/components/pages/editor/page-root.tsx
@@ -43,7 +43,7 @@ export const PageRoot = observer((props: TPageRootProps) => {
   // store hooks
   const { createPage } = useProjectPages();
   // derived values
-  const { access, description_html, name } = page;
+  const { access, description_html, name, isContentEditable } = page;
   // editor markings hook
   const { markings, updateMarkings } = useEditorMarkings();
   // project-description
@@ -123,6 +123,7 @@ export const PageRoot = observer((props: TPageRootProps) => {
         isOpen={isVersionsOverlayOpen}
         onClose={handleCloseVersionsOverlay}
         pageId={page.id ?? ""}
+        restoreEnabled={isContentEditable}
       />
       <PageEditorHeaderRoot
         editorRef={editorRef}
diff --git a/web/core/components/pages/version/main-content.tsx b/web/core/components/pages/version/main-content.tsx
index 46440428e3..f729556792 100644
--- a/web/core/components/pages/version/main-content.tsx
+++ b/web/core/components/pages/version/main-content.tsx
@@ -17,10 +17,11 @@ type Props = {
   handleClose: () => void;
   handleRestore: (descriptionHTML: string) => Promise<void>;
   pageId: string;
+  restoreEnabled: boolean;
 };
 
 export const PageVersionsMainContent: React.FC<Props> = observer((props) => {
-  const { activeVersion, fetchVersionDetails, handleClose, handleRestore, pageId } = props;
+  const { activeVersion, fetchVersionDetails, handleClose, handleRestore, pageId, restoreEnabled } = props;
   // states
   const [isRestoring, setIsRestoring] = useState(false);
   const [isRetrying, setIsRetrying] = useState(false);
@@ -37,6 +38,7 @@ export const PageVersionsMainContent: React.FC<Props> = observer((props) => {
   const isCurrentVersionActive = activeVersion === "current";
 
   const handleRestoreVersion = async () => {
+    if (!restoreEnabled) return;
     setIsRestoring(true);
     await handleRestore(versionDetails?.description_html ?? "<p></p>")
       .then(() => {
@@ -88,7 +90,7 @@ export const PageVersionsMainContent: React.FC<Props> = observer((props) => {
                   ? `${renderFormattedDate(versionDetails.last_saved_at)} ${renderFormattedTime(versionDetails.last_saved_at)}`
                   : "Loading version details"}
             </h6>
-            {!isCurrentVersionActive && (
+            {!isCurrentVersionActive && restoreEnabled && (
               <Button
                 variant="primary"
                 size="sm"
@@ -104,6 +106,7 @@ export const PageVersionsMainContent: React.FC<Props> = observer((props) => {
             <PagesVersionEditor
               activeVersion={activeVersion}
               isCurrentVersionActive={isCurrentVersionActive}
+              pageId={pageId}
               versionDetails={versionDetails}
             />
           </div>
diff --git a/web/core/components/pages/version/root.tsx b/web/core/components/pages/version/root.tsx
index 443053d56d..9cec13c2d7 100644
--- a/web/core/components/pages/version/root.tsx
+++ b/web/core/components/pages/version/root.tsx
@@ -1,3 +1,4 @@
+import { observer } from "mobx-react";
 // plane types
 import { TPageVersion } from "@plane/types";
 // components
@@ -13,10 +14,20 @@ type Props = {
   isOpen: boolean;
   onClose: () => void;
   pageId: string;
+  restoreEnabled: boolean;
 };
 
-export const PageVersionsOverlay: React.FC<Props> = (props) => {
-  const { activeVersion, fetchAllVersions, fetchVersionDetails, handleRestore, isOpen, onClose, pageId } = props;
+export const PageVersionsOverlay: React.FC<Props> = observer((props) => {
+  const {
+    activeVersion,
+    fetchAllVersions,
+    fetchVersionDetails,
+    handleRestore,
+    isOpen,
+    onClose,
+    pageId,
+    restoreEnabled,
+  } = props;
 
   const handleClose = () => {
     onClose();
@@ -37,6 +48,7 @@ export const PageVersionsOverlay: React.FC<Props> = (props) => {
         handleClose={handleClose}
         handleRestore={handleRestore}
         pageId={pageId}
+        restoreEnabled={restoreEnabled}
       />
       <PageVersionsSidebarRoot
         activeVersion={activeVersion}
@@ -47,4 +59,4 @@ export const PageVersionsOverlay: React.FC<Props> = (props) => {
       />
     </div>
   );
-};
+});