fix: Fixed an issue where deleting a file from the preview modal would not correctly navigate to next item or dismiss the modal

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) => {