fix: prevents rendering of version actions when a user does not have …

…permission
payloadcms · Apr 10, 2023 · 13cc669 · 13cc669
1 parent 4d515a0
commit 13cc669
Show file tree

Hide file tree

Showing 7 changed files with 33 additions and 25 deletions.
diff --git a/src/admin/components/Routes.tsx b/src/admin/components/Routes.tsx
@@ -273,10 +273,15 @@ const Routes = () => {
                                       render={(routeProps) => {
                                         if (permissions?.collections?.[collection.slug]?.readVersions?.permission) {
                                           return (
-                                            <Version
-                                              {...routeProps}
+                                            <DocumentInfoProvider
                                               collection={collection}
-                                            />
+                                              id={routeProps.match.params.id}
+                                            >
+                                              <Version
+                                                {...routeProps}
+                                                collection={collection}
+                                              />
+                                            </DocumentInfoProvider>
                                           );
                                         }
 

diff --git a/src/admin/components/elements/Status/index.tsx b/src/admin/components/elements/Status/index.tsx
@@ -24,6 +24,7 @@ const Status: React.FC<Props> = () => {
     global,
     id,
     getVersions,
+    docPermissions,
   } = useDocumentInfo();
   const { toggleModal } = useModal();
   const {
@@ -114,12 +115,14 @@ const Status: React.FC<Props> = () => {
     }
   }, [collection, global, publishedDoc, serverURL, api, id, i18n, locale, resetForm, getVersions, t, toggleModal, revertModalSlug, unPublishModalSlug]);
 
+  const canUpdate = docPermissions?.update?.permission;
+
   if (statusToRender) {
     return (
       <div className={baseClass}>
         <div className={`${baseClass}__value-wrap`}>
           <span className={`${baseClass}__value`}>{t(statusToRender)}</span>
-          {statusToRender === 'published' && (
+          {canUpdate && statusToRender === 'published' && (
             <React.Fragment>
               &nbsp;&mdash;&nbsp;
               <Button
@@ -152,7 +155,7 @@ const Status: React.FC<Props> = () => {
               </Modal>
             </React.Fragment>
           )}
-          {statusToRender === 'changed' && (
+          {canUpdate && statusToRender === 'changed' && (
             <React.Fragment>
               &nbsp;&mdash;&nbsp;
               <Button

diff --git a/src/admin/components/forms/field-types/Array/index.tsx b/src/admin/components/forms/field-types/Array/index.tsx
@@ -63,13 +63,12 @@ const ArrayFieldType: React.FC<Props> = (props) => {
 
   const CustomRowLabel = components?.RowLabel || undefined;
 
-  const { preferencesKey } = useDocumentInfo();
+  const { preferencesKey, id } = useDocumentInfo();
   const { getPreference } = usePreferences();
   const { setPreference } = usePreferences();
   const [rows, dispatchRows] = useReducer(reducer, undefined);
   const formContext = useForm();
   const { user } = useAuth();
-  const { id } = useDocumentInfo();
   const locale = useLocale();
   const operation = useOperation();
   const { t, i18n } = useTranslation('fields');

diff --git a/src/admin/components/forms/field-types/Blocks/index.tsx b/src/admin/components/forms/field-types/Blocks/index.tsx
@@ -65,13 +65,12 @@ const BlocksField: React.FC<Props> = (props) => {
 
   const path = pathFromProps || name;
 
-  const { preferencesKey } = useDocumentInfo();
+  const { preferencesKey, id } = useDocumentInfo();
   const { getPreference } = usePreferences();
   const { setPreference } = usePreferences();
   const [rows, dispatchRows] = useReducer(reducer, undefined);
   const formContext = useForm();
   const { user } = useAuth();
-  const { id } = useDocumentInfo();
   const locale = useLocale();
   const operation = useOperation();
   const { dispatchFields, setModified } = formContext;

diff --git a/src/admin/components/utilities/DocumentInfo/index.tsx b/src/admin/components/utilities/DocumentInfo/index.tsx
@@ -5,7 +5,7 @@ import qs from 'qs';
 import { useTranslation } from 'react-i18next';
 import { useConfig } from '../Config';
 import { PaginatedDocs } from '../../../../mongoose/types';
-import { ContextType, DocumentPermissions, EntityType, Props, Version } from './types';
+import { ContextType, DocumentPermissions, Props, Version } from './types';
 import { TypeWithID } from '../../../../globals/config/types';
 import { TypeWithTimestamps } from '../../../../collections/config/types';
 import { Where } from '../../../../types';
@@ -15,6 +15,8 @@ import { useAuth } from '../Auth';
 
 const Context = createContext({} as ContextType);
 
+export const useDocumentInfo = (): ContextType => useContext(Context);
+
 export const DocumentInfoProvider: React.FC<Props> = ({
   children,
   global,
@@ -32,7 +34,7 @@ export const DocumentInfoProvider: React.FC<Props> = ({
 
   const baseURL = `${serverURL}${api}`;
   let slug: string;
-  let type: EntityType;
+  let type: 'global' | 'collection';
   let pluralType: 'globals' | 'collections';
   let preferencesKey: string;
 
@@ -233,5 +235,3 @@ export const DocumentInfoProvider: React.FC<Props> = ({
     </Context.Provider>
   );
 };
-
-export const useDocumentInfo = (): ContextType => useContext(Context);
diff --git a/src/admin/components/utilities/DocumentInfo/types.ts b/src/admin/components/utilities/DocumentInfo/types.ts
@@ -9,13 +9,9 @@ export type Version = TypeWithVersion<any>
 
 export type DocumentPermissions = null | GlobalPermission | CollectionPermission
 
-export type EntityType = 'global' | 'collection'
-
 export type ContextType = {
   collection?: SanitizedCollectionConfig
   global?: SanitizedGlobalConfig
-  type: EntityType
-  /** Slug of the collection or global */
   slug?: string
   id?: string | number
   preferencesKey?: string

diff --git a/src/admin/components/views/Version/Version.tsx b/src/admin/components/views/Version/Version.tsx
@@ -3,6 +3,7 @@ import { useRouteMatch } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import { useConfig } from '../../utilities/Config';
 import { useAuth } from '../../utilities/Auth';
+import { useDocumentInfo } from '../../utilities/DocumentInfo';
 import usePayloadAPI from '../../../hooks/usePayloadAPI';
 import Eyebrow from '../../elements/Eyebrow';
 import { useStepNav } from '../../elements/StepNav';
@@ -36,6 +37,7 @@ const VersionView: React.FC<Props> = ({ collection, global }) => {
   const { permissions } = useAuth();
   const locale = useLocale();
   const { t, i18n } = useTranslation('version');
+  const { docPermissions } = useDocumentInfo();
 
   let originalDocFetchURL: string;
   let versionFetchURL: string;
@@ -163,6 +165,8 @@ const VersionView: React.FC<Props> = ({ collection, global }) => {
     comparison = publishedDoc;
   }
 
+  const canUpdate = docPermissions?.update?.permission;
+
   return (
     <React.Fragment>
       <div className={baseClass}>
@@ -179,14 +183,16 @@ const VersionView: React.FC<Props> = ({ collection, global }) => {
             <h2>
               {formattedCreatedAt}
             </h2>
-            <Restore
-              className={`${baseClass}__restore`}
-              collection={collection}
-              global={global}
-              originalDocID={id}
-              versionID={versionID}
-              versionDate={formattedCreatedAt}
-            />
+            {canUpdate && (
+              <Restore
+                className={`${baseClass}__restore`}
+                collection={collection}
+                global={global}
+                originalDocID={id}
+                versionID={versionID}
+                versionDate={formattedCreatedAt}
+              />
+            )}
           </header>
           <div className={`${baseClass}__controls`}>
             <CompareVersion