From 73a1ace6f3739028694047c7b0f6e77804004913 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Fri, 18 Mar 2022 10:57:43 +0530
Subject: [PATCH 1/2] feat: add delete option to file menu

---
 .../AttachedFilesButton.tsx                   |  2 +-
 .../AttachedFilesPopover.tsx                  | 26 ++++++++++---------
 .../PopoverFileSubmenu.tsx                    | 14 ++++++++++
 3 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesButton.tsx b/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesButton.tsx
index 208e139496d..719384c4375 100644
--- a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesButton.tsx
+++ b/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}"`,
diff --git a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx b/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
index 0f2351c7f34..0dcdf5e65fc 100644
--- a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
+++ b/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
@@ -169,18 +169,20 @@ export const AttachedFilesPopover: FunctionComponent<Props> = observer(
             </div>
           ) : null}
           {filteredList.length > 0 ? (
-            filteredList.map((file: SNFile) => {
-              return (
-                <PopoverFileItem
-                  key={file.uuid}
-                  file={file}
-                  isAttachedToNote={attachedFiles.includes(file)}
-                  handleFileAction={handleFileAction}
-                  getIconType={application.iconsController.getIconForFileType}
-                  closeOnBlur={closeOnBlur}
-                />
-              );
-            })
+            filteredList
+              .filter((file) => file.name && file.size)
+              .map((file: SNFile) => {
+                return (
+                  <PopoverFileItem
+                    key={file.uuid}
+                    file={file}
+                    isAttachedToNote={attachedFiles.includes(file)}
+                    handleFileAction={handleFileAction}
+                    getIconType={application.iconsController.getIconForFileType}
+                    closeOnBlur={closeOnBlur}
+                  />
+                );
+              })
           ) : (
             <div className="flex flex-col items-center justify-center w-full py-8">
               <div className="w-18 h-18 mb-2">
diff --git a/app/assets/javascripts/components/AttachedFilesPopover/PopoverFileSubmenu.tsx b/app/assets/javascripts/components/AttachedFilesPopover/PopoverFileSubmenu.tsx
index bf13440bdbe..9e82b996896 100644
--- a/app/assets/javascripts/components/AttachedFilesPopover/PopoverFileSubmenu.tsx
+++ b/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>

From 3fca2c8586b3c413f134d7f58b9808eaffe3c250 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Fri, 18 Mar 2022 20:01:35 +0530
Subject: [PATCH 2/2] feat: filter files based on file.deleted

---
 .../components/AttachedFilesPopover/AttachedFilesPopover.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx b/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
index 0dcdf5e65fc..4a9cf03aa0b 100644
--- a/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
+++ b/app/assets/javascripts/components/AttachedFilesPopover/AttachedFilesPopover.tsx
@@ -170,7 +170,7 @@ export const AttachedFilesPopover: FunctionComponent<Props> = observer(
           ) : null}
           {filteredList.length > 0 ? (
             filteredList
-              .filter((file) => file.name && file.size)
+              .filter((file) => !file.deleted)
               .map((file: SNFile) => {
                 return (
                   <PopoverFileItem