fix: uses docPermissions to show/hide x button on media collection do…

…c fileDetails - #2428
payloadcms · Apr 10, 2023 · 7f2c3d1 · 7f2c3d1
1 parent 13cc669
commit 7f2c3d1
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/docs/admin/hooks.mdx b/docs/admin/hooks.mdx
@@ -166,7 +166,6 @@ The `useDocumentInfo` hook provides lots of information about the document curre
 |---------------------------|--------------------------------------------------------------------------------------------------------------------|                                |
 | **`collection`**          | If the doc is a collection, its collection config will be returned                                                 |
 | **`global`**              | If the doc is a global, its global config will be returned                                                         |
-| **`type`**                | The type of document being edited (collection or global)                                                           |
 | **`id`**                  | If the doc is a collection, its ID will be returned                                                                |
 | **`preferencesKey`**      | The `preferences` key to use when interacting with document-level user preferences                                 |
 | **`versions`**            | Versions of the current doc                                                                                        |

diff --git a/src/admin/components/views/collections/Edit/Upload/index.tsx b/src/admin/components/views/collections/Edit/Upload/index.tsx
@@ -2,6 +2,7 @@ import React, {
   useState, useRef, useEffect, useCallback,
 } from 'react';
 import { useTranslation } from 'react-i18next';
+import { useDocumentInfo } from '../../../../utilities/DocumentInfo';
 import useField from '../../../../forms/useField';
 import Button from '../../../../elements/Button';
 import FileDetails from '../../../../elements/FileDetails';
@@ -40,6 +41,7 @@ const Upload: React.FC<Props> = (props) => {
   const [replacingFile, setReplacingFile] = useState(false);
   const { t } = useTranslation('upload');
   const [doc, setDoc] = useState(reduceFieldsToValues(internalState || {}, true));
+  const { docPermissions } = useDocumentInfo();
 
   const {
     value,
@@ -129,6 +131,8 @@ const Upload: React.FC<Props> = (props) => {
     'field-type',
   ].filter(Boolean).join(' ');
 
+  const canRemoveUpload = docPermissions?.update?.permission && 'delete' in docPermissions && docPermissions?.delete?.permission;
+
   return (
     <div className={classes}>
       <Error
@@ -139,10 +143,10 @@ const Upload: React.FC<Props> = (props) => {
         <FileDetails
           doc={doc}
           collection={collection}
-          handleRemove={() => {
+          handleRemove={canRemoveUpload ? () => {
             setReplacingFile(true);
             setValue(null);
-          }}
+          } : undefined}
         />
       )}
       {(!doc.filename || replacingFile) && (