From 7773becdec0f5a623337b25a7fd218e5bcfebf13 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Thu, 30 Mar 2023 12:40:50 +0530
Subject: [PATCH] fix: Fixed an issue where deleting a file from the preview
 modal would not correctly navigate to next item or dismiss the modal

---
 .../FilePreview/FilePreviewModal.tsx          |  2 +-
 .../Controllers/FilePreviewModalController.ts | 36 +++++++++++++++++--
 .../Controllers/ViewControllerManager.ts      |  5 ++-
 3 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/packages/web/src/javascripts/Components/FilePreview/FilePreviewModal.tsx b/packages/web/src/javascripts/Components/FilePreview/FilePreviewModal.tsx
index 8fe0501ed..ff90169c5 100644
--- a/packages/web/src/javascripts/Components/FilePreview/FilePreviewModal.tsx
+++ b/packages/web/src/javascripts/Components/FilePreview/FilePreviewModal.tsx
@@ -51,7 +51,7 @@ const FilePreviewModal = observer(({ application, viewControllerManager }: Props
 
       event.preventDefault()
 
-      const currentFileIndex = otherFiles.findIndex((fileFromArray) => fileFromArray.uuid === currentFile.uuid)
+      const currentFileIndex = otherFiles.findIndex((file) => file.uuid === currentFile.uuid)
 
       switch (event.key) {
         case KeyboardKey.Left: {
diff --git a/packages/web/src/javascripts/Controllers/FilePreviewModalController.ts b/packages/web/src/javascripts/Controllers/FilePreviewModalController.ts
index d274c39b1..4da39ab10 100644
--- a/packages/web/src/javascripts/Controllers/FilePreviewModalController.ts
+++ b/packages/web/src/javascripts/Controllers/FilePreviewModalController.ts
@@ -1,4 +1,5 @@
-import { FileItem } from '@standardnotes/snjs'
+import { WebApplication } from '@/Application/Application'
+import { ContentType, FileItem } from '@standardnotes/snjs'
 import { action, makeObservable, observable } from 'mobx'
 
 export class FilePreviewModalController {
@@ -6,7 +7,9 @@ export class FilePreviewModalController {
   currentFile: FileItem | undefined = undefined
   otherFiles: FileItem[] = []
 
-  constructor() {
+  eventObservers: (() => void)[] = []
+
+  constructor(application: WebApplication) {
     makeObservable(this, {
       isOpen: observable,
       currentFile: observable,
@@ -16,6 +19,35 @@ export class FilePreviewModalController {
       dismiss: action,
       setCurrentFile: action,
     })
+
+    this.eventObservers.push(
+      application.streamItems(ContentType.File, ({ changed, removed }) => {
+        if (!this.currentFile) {
+          return
+        }
+        if (changed.includes(this.currentFile)) {
+          this.setCurrentFile(this.currentFile)
+        }
+        if (removed.find((f) => f.uuid === this.currentFile?.uuid)) {
+          if (!this.otherFiles.length) {
+            this.dismiss()
+            this.currentFile = undefined
+            return
+          }
+
+          const currentFileIndex = this.otherFiles.findIndex((file) => file.uuid === this.currentFile?.uuid)
+          const nextFileIndex = currentFileIndex + 1 < this.otherFiles.length ? currentFileIndex + 1 : 0
+          this.setCurrentFile(this.otherFiles[nextFileIndex])
+          this.otherFiles = this.otherFiles.filter((file) => file.uuid !== this.currentFile?.uuid)
+        }
+      }),
+    )
+  }
+
+  deinit = () => {
+    this.eventObservers.forEach((observer) => observer())
+    ;(this.currentFile as any) = undefined
+    ;(this.otherFiles as any) = undefined
   }
 
   setCurrentFile = (currentFile: FileItem) => {
diff --git a/packages/web/src/javascripts/Controllers/ViewControllerManager.ts b/packages/web/src/javascripts/Controllers/ViewControllerManager.ts
index b91d96b74..14446f3f6 100644
--- a/packages/web/src/javascripts/Controllers/ViewControllerManager.ts
+++ b/packages/web/src/javascripts/Controllers/ViewControllerManager.ts
@@ -51,7 +51,7 @@ export class ViewControllerManager implements InternalEventHandlerInterface {
   readonly accountMenuController: AccountMenuController
   readonly actionsMenuController = new ActionsMenuController()
   readonly featuresController: FeaturesController
-  readonly filePreviewModalController = new FilePreviewModalController()
+  readonly filePreviewModalController: FilePreviewModalController
   readonly filesController: FilesController
   readonly noAccountWarningController: NoAccountWarningController
   readonly notesController: NotesController
@@ -88,6 +88,8 @@ export class ViewControllerManager implements InternalEventHandlerInterface {
 
     this.subscriptionManager = application.subscriptions
 
+    this.filePreviewModalController = new FilePreviewModalController(application)
+
     this.quickSettingsMenuController = new QuickSettingsController(application, this.eventBus)
 
     this.paneController = new PaneController(application, this.eventBus)
@@ -201,6 +203,7 @@ export class ViewControllerManager implements InternalEventHandlerInterface {
     this.appEventObserverRemovers.forEach((remover) => remover())
     this.appEventObserverRemovers.length = 0
     ;(this.device as unknown) = undefined
+    this.filePreviewModalController.deinit()
     ;(this.filePreviewModalController as unknown) = undefined
     ;(this.preferencesController as unknown) = undefined
     ;(this.quickSettingsMenuController as unknown) = undefined