fix: files navigation (#1084)

packages/web/src/javascripts/Components/NoteGroupView/NoteGroupView.tsx

@@ -1,4 +1,4 @@
-import { FileItem, NoteViewController } from '@standardnotes/snjs'
+import { FileItem, FileViewController, NoteViewController } from '@standardnotes/snjs'
 import { PureComponent } from '@/Components/Abstract/PureComponent'
 import { WebApplication } from '@/Application/Application'
 import MultipleSelectedNotes from '@/Components/MultipleSelectedNotes/MultipleSelectedNotes'
@@ -10,7 +10,7 @@ import FileView from '@/Components/FileView/FileView'
 type State = {
   showMultipleSelectedNotes: boolean
   showMultipleSelectedFiles: boolean
-  controllers: NoteViewController[]
+  controllers: (NoteViewController | FileViewController)[]
   selectedFile: FileItem | undefined
 }
 
@@ -34,9 +34,9 @@ class NoteGroupView extends PureComponent<Props, State> {
   override componentDidMount(): void {
     super.componentDidMount()
 
-    const controllerGroup = this.application.noteControllerGroup
-    this.removeChangeObserver = this.application.noteControllerGroup.addActiveControllerChangeObserver(() => {
-      const controllers = controllerGroup.noteControllers
+    const controllerGroup = this.application.itemControllerGroup
+    this.removeChangeObserver = this.application.itemControllerGroup.addActiveControllerChangeObserver(() => {
+      const controllers = controllerGroup.itemControllers
       this.setState({
         controllers: controllers,
       })
@@ -110,18 +110,19 @@ class NoteGroupView extends PureComponent<Props, State> {
         {shouldNotShowMultipleSelectedItems && this.state.controllers.length > 0 && (
           <>
             {this.state.controllers.map((controller) => {
-              return <NoteView key={controller.note.uuid} application={this.application} controller={controller} />
+              return controller instanceof NoteViewController ? (
+                <NoteView key={controller.item.uuid} application={this.application} controller={controller} />
+              ) : (
+                <FileView
+                  key={controller.item.uuid}
+                  application={this.application}
+                  viewControllerManager={this.viewControllerManager}
+                  file={controller.item}
+                />
+              )
             })}
           </>
         )}
-
-        {shouldNotShowMultipleSelectedItems && this.state.controllers.length < 1 && this.state.selectedFile && (
-          <FileView
-            application={this.application}
-            viewControllerManager={this.viewControllerManager}
-            file={this.state.selectedFile}
-          />
-        )}
       </div>
     )
   }

packages/web/src/javascripts/Components/NoteView/NoteView.test.ts

@@ -52,7 +52,7 @@ describe('NoteView', () => {
     it("should hide the note if at the time of the session expiration the note wasn't edited for longer than the allowed idle time", async () => {
       const secondsElapsedSinceLastEdit = ProposedSecondsToDeferUILevelSessionExpirationDuringActiveInteraction + 5
 
-      noteViewController.note = {
+      noteViewController.item = {
         protected: true,
         userModifiedDate: new Date(Date.now() - secondsElapsedSinceLastEdit * 1000),
       } as jest.Mocked<SNNote>
@@ -65,7 +65,7 @@ describe('NoteView', () => {
     it('should postpone the note hiding by correct time if the time passed after its last modification is less than the allowed idle time', async () => {
       const secondsElapsedSinceLastEdit = ProposedSecondsToDeferUILevelSessionExpirationDuringActiveInteraction - 3
 
-      noteViewController.note = {
+      noteViewController.item = {
         protected: true,
         userModifiedDate: new Date(Date.now() - secondsElapsedSinceLastEdit * 1000),
       } as jest.Mocked<SNNote>
@@ -87,7 +87,7 @@ describe('NoteView', () => {
     it('should postpone the note hiding by correct time if the user continued editing it even after the protection session has expired', async () => {
       const secondsElapsedSinceLastModification = 3
 
-      noteViewController.note = {
+      noteViewController.item = {
         protected: true,
         userModifiedDate: new Date(Date.now() - secondsElapsedSinceLastModification * 1000),
       } as jest.Mocked<SNNote>
@@ -98,7 +98,7 @@ describe('NoteView', () => {
         ProposedSecondsToDeferUILevelSessionExpirationDuringActiveInteraction - secondsElapsedSinceLastModification
       jest.advanceTimersByTime((secondsAfterWhichTheNoteShouldHide - 1) * 1000)
 
-      noteViewController.note = {
+      noteViewController.item = {
         protected: true,
         userModifiedDate: new Date(),
       } as jest.Mocked<SNNote>
@@ -114,7 +114,7 @@ describe('NoteView', () => {
 
   describe('note is unprotected', () => {
     it('should not call any hiding logic', async () => {
-      noteViewController.note = {
+      noteViewController.item = {
         protected: false,
       } as jest.Mocked<SNNote>
 
@@ -126,7 +126,7 @@ describe('NoteView', () => {
 
   describe('dismissProtectedWarning', () => {
     beforeEach(() => {
-      noteViewController.note = {
+      noteViewController.item = {
         protected: false,
       } as jest.Mocked<SNNote>
     })

packages/web/src/javascripts/Components/NoteView/NoteView.tsx

@@ -118,7 +118,7 @@ class NoteView extends PureComponent<NoteViewProps, State> {
       isDesktop: isDesktopApplication(),
       lockText: NOTE_EDITING_DISABLED_TEXT,
       noteStatus: undefined,
-      noteLocked: this.controller.note.locked,
+      noteLocked: this.controller.item.locked,
       showLockedIcon: true,
       showProtectedWarning: false,
       spellcheck: true,
@@ -180,7 +180,7 @@ class NoteView extends PureComponent<NoteViewProps, State> {
   }
 
   get note() {
-    return this.controller.note
+    return this.controller.item
   }
 
   override componentDidMount(): void {