feat: add delete option to file menu (#936)

app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesButton.tsx

@@ -141,7 +141,7 @@ export const AttachedFilesButton: FunctionComponent<Props> = observer(
           type: ToastType.Loading,
           message: `Deleting file "${file.name}"...`,
         });
-        await application.deleteItem(file);
+        await application.files.deleteFile(file);
         addToast({
           type: ToastType.Success,
           message: `Deleted file "${file.name}"`,

app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx

@@ -169,7 +169,9 @@ export const AttachedFilesPopover: FunctionComponent<Props> = observer(
             </div>
           ) : null}
           {filteredList.length > 0 ? (
-            filteredList.map((file: SNFile) => {
+            filteredList
+              .filter((file) => !file.deleted)
+              .map((file: SNFile) => {
                 return (
                   <PopoverFileItem
                     key={file.uuid}

app/assets/javascripts/components/AttachedFilesPopover/PopoverFileSubmenu.tsx

@@ -179,6 +179,20 @@ export const PopoverFileSubmenu: FunctionComponent<Props> = ({
                 <Icon type="pencil" className="mr-2 color-neutral" />
                 Rename
               </button>
+              <button
+                onBlur={closeOnBlur}
+                className="sn-dropdown-item focus:bg-info-backdrop"
+                onClick={() => {
+                  handleFileAction({
+                    type: PopoverFileItemActionType.DeleteFile,
+                    payload: file,
+                  });
+                  closeMenu();
+                }}
+              >
+                <Icon type="trash" className="mr-2 color-danger" />
+                <span className="color-danger">Delete permanently</span>
+              </button>
             </>
           )}
         </DisclosurePanel>