Reland "[Files F2] Dispatch actions for volume/navigation"

This is a reland of commit 81a1114,
no additional change.

Original change's description:
> [Files F2] Dispatch actions for volume/navigation
>
> Integrate the new actions from CL:4150614 to the existing
> controllers, dispatch those actions when volume/shortcuts/uiEntries
> change.
>
> Bug: b:228139957
> Change-Id: Ib065332fe69a81c05d0568f8ecbe134f40289cc8
> Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4150870
> Reviewed-by: Luciano Pacheco <lucmult@chromium.org>
> Commit-Queue: Wenbo Jie <wenbojie@chromium.org>
> Cr-Commit-Position: refs/heads/main@{#1114921}

Bug: b:228139957
Change-Id: I2846a95fa29beed75a31ba1f91114a011e391850
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4336458
Reviewed-by: Luciano Pacheco <lucmult@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1117314}

ui/file_manager/file_manager/background/js/BUILD.gn

@@ -390,6 +390,7 @@ js_library("volume_manager_impl") {
     "//ui/file_manager/file_manager/common/js:volume_manager_types",
     "//ui/file_manager/file_manager/externs:volume_info",
     "//ui/file_manager/file_manager/externs:volume_manager",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
 }
 
@@ -421,6 +422,7 @@ js_library("volume_manager_util") {
     "//ui/file_manager/file_manager/common/js:util",
     "//ui/file_manager/file_manager/common/js:volume_manager_types",
     "//ui/file_manager/file_manager/externs:volume_info",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
 }
 

ui/file_manager/file_manager/background/js/volume_manager_impl.js

@@ -11,6 +11,8 @@ import {util} from '../../common/js/util.js';
 import {VolumeManagerCommon} from '../../common/js/volume_manager_types.js';
 import {VolumeInfo} from '../../externs/volume_info.js';
 import {VolumeManager} from '../../externs/volume_manager.js';
+import {removeVolume} from '../../state/actions/volumes.js';
+import {getStore} from '../../state/store.js';
 
 import {EntryLocationImpl} from './entry_location_impl.js';
 import {VolumeInfoListImpl} from './volume_info_list_impl.js';
@@ -312,7 +314,9 @@ export class VolumeManagerImpl extends EventTarget {
             } else {
               console.debug(`Unmounted '${volumeId}'`);
             }
-
+            if (util.isFilesAppExperimental()) {
+              getStore().dispatch(removeVolume({volumeId}));
+            }
             this.volumeInfoList.remove(volumeId);
             this.finishRequest_(requestKey, status);
             return;

ui/file_manager/file_manager/background/js/volume_manager_util.js

@@ -5,6 +5,8 @@
 import {str, util} from '../../common/js/util.js';
 import {VolumeManagerCommon} from '../../common/js/volume_manager_types.js';
 import {VolumeInfo} from '../../externs/volume_info.js';
+import {addVolume} from '../../state/actions/volumes.js';
+import {getStore} from '../../state/store.js';
 
 import {VolumeInfoImpl} from './volume_info_impl.js';
 
@@ -137,6 +139,13 @@ volumeManagerUtil.createVolumeInfo = async volumeMetadata => {
             volumeMetadata.driveLabel, volumeMetadata.remoteMountPath,
             volumeMetadata.vmType);
       })
+      .then(async (volumeInfo) => {
+        if (util.isFilesAppExperimental()) {
+          await volumeInfo.resolveDisplayRoot();
+          getStore().dispatch(addVolume({volumeMetadata, volumeInfo}));
+        }
+        return volumeInfo;
+      })
       .catch(
           /** @param {*} error */
           error => {

ui/file_manager/file_manager/definitions/file_manager.d.ts

@@ -27,6 +27,7 @@ declare global {
   interface Window {
     fileManager: FileManager;
     IN_TEST: boolean;
+    store: Store;
   }
 }
 

ui/file_manager/file_manager/foreground/js/BUILD.gn

@@ -326,7 +326,11 @@ js_library("mock_thumbnail_loader") {
 }
 
 js_library("android_app_list_model") {
-  deps = [ "//ash/webui/common/resources:event_target" ]
+  deps = [
+    "//ash/webui/common/resources:event_target",
+    "//ui/file_manager/file_manager/common/js:util",
+    "//ui/file_manager/file_manager/externs/ts:store",
+  ]
 }
 
 js_library("app_state_controller") {
@@ -364,6 +368,7 @@ js_library("crostini_controller") {
     "//ui/file_manager/file_manager/common/js:util",
     "//ui/file_manager/file_manager/common/js:volume_manager_types",
     "//ui/file_manager/file_manager/externs/background:crostini",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
   externs_list = [
     "//ui/file_manager/file_manager/externs/polymer_elements/files_toast.js",
@@ -636,6 +641,7 @@ js_library("file_manager") {
     "//ui/file_manager/file_manager/externs/background:file_manager_base",
     "//ui/file_manager/file_manager/externs/background:file_operation_manager",
     "//ui/file_manager/file_manager/externs/background:progress_center",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
 }
 
@@ -818,6 +824,7 @@ js_library("folder_shortcuts_data_model") {
     "//ui/file_manager/file_manager/common/js:metrics",
     "//ui/file_manager/file_manager/common/js:util",
     "//ui/file_manager/file_manager/common/js:volume_manager_types",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
 }
 
@@ -846,6 +853,7 @@ js_library("guest_os_controller") {
     "//ui/file_manager/file_manager/common/js:util",
     "//ui/file_manager/file_manager/common/js:volume_manager_types",
     "//ui/file_manager/file_manager/externs:volume_manager",
+    "//ui/file_manager/file_manager/externs/ts:store",
   ]
 }
 

ui/file_manager/file_manager/foreground/js/android_app_list_model.js

@@ -4,6 +4,10 @@
 
 import {NativeEventTarget as EventTarget} from 'chrome://resources/ash/common/event_target.js';
 
+import {util} from '../../common/js/util.js';
+import {addAndroidApps} from '../../state/actions/android_apps.js';
+import {getStore} from '../../state/store.js';
+
 /**
  * Model for managing a list of Android apps.
  */
@@ -33,6 +37,9 @@ export class AndroidAppListModel extends EventTarget {
 
     chrome.fileManagerPrivate.getAndroidPickerApps(extensions, apps => {
       this.apps_ = apps;
+      if (util.isFilesAppExperimental()) {
+        getStore().dispatch(addAndroidApps({apps}));
+      }
       this.dispatchEvent(new Event('permuted'));
     });
   }

ui/file_manager/file_manager/foreground/js/crostini_controller.js

@@ -5,9 +5,12 @@
 import {assert} from 'chrome://resources/ash/common/assert.js';
 
 import {FakeEntryImpl} from '../../common/js/files_app_entry_types.js';
-import {str, strf} from '../../common/js/util.js';
+import {str, strf, util} from '../../common/js/util.js';
 import {VolumeManagerCommon} from '../../common/js/volume_manager_types.js';
 import {Crostini} from '../../externs/background/crostini.js';
+import {addUiEntry, removeUiEntry} from '../../state/actions/ui_entries.js';
+import {crostiniPlaceHolderKey} from '../../state/reducers/volumes.js';
+import {getStore} from '../../state/store.js';
 
 import {constants} from './constants.js';
 import {DirectoryModel} from './directory_model.js';
@@ -55,14 +58,20 @@ export class CrostiniController {
     // Setup Linux files fake root.
     let crostiniNavigationModelItem;
     if (this.crostini_.isEnabled(constants.DEFAULT_CROSTINI_VM)) {
+      const crostiniEntry = new FakeEntryImpl(
+          str('LINUX_FILES_ROOT_LABEL'), VolumeManagerCommon.RootType.CROSTINI);
       crostiniNavigationModelItem = new NavigationModelFakeItem(
           str('LINUX_FILES_ROOT_LABEL'), NavigationModelItemType.CROSTINI,
-          new FakeEntryImpl(
-              str('LINUX_FILES_ROOT_LABEL'),
-              VolumeManagerCommon.RootType.CROSTINI));
+          crostiniEntry);
       crostiniNavigationModelItem.disabled = this.disabled_;
+      if (util.isFilesAppExperimental()) {
+        getStore().dispatch(addUiEntry({entry: crostiniEntry}));
+      }
     } else {
       crostiniNavigationModelItem = null;
+      if (util.isFilesAppExperimental()) {
+        getStore().dispatch(removeUiEntry({key: crostiniPlaceHolderKey}));
+      }
     }
     this.directoryTree_.dataModel.linuxFilesItem = crostiniNavigationModelItem;
     // Redraw the tree to ensure 'Linux files' is added/removed.

ui/file_manager/file_manager/foreground/js/file_manager.js

@@ -28,7 +28,10 @@ import {CommandHandlerDeps} from '../../externs/command_handler_deps.js';
 import {FakeEntry, FilesAppDirEntry} from '../../externs/files_app_entry_interfaces.js';
 import {ForegroundWindow} from '../../externs/foreground_window.js';
 import {PropStatus} from '../../externs/ts/state.js';
+import {Store} from '../../externs/ts/store.js';
 import {updateSearch} from '../../state/actions.js';
+import {addUiEntry, removeUiEntry} from '../../state/actions/ui_entries.js';
+import {trashRootKey} from '../../state/reducers/volumes.js';
 import {getEmptyState, getStore} from '../../state/store.js';
 
 import {ActionsController} from './actions_controller.js';
@@ -403,6 +406,9 @@ export class FileManager extends EventTarget {
      */
     this.guestMode_ = false;
 
+    /** @private {!Store} */
+    this.store_ = getStore();
+
     startColorChangeUpdater();
   }
 
@@ -1105,7 +1111,9 @@ export class FileManager extends EventTarget {
         str('RECENT_ROOT_LABEL'), VolumeManagerCommon.RootType.RECENT,
         this.getSourceRestriction_(),
         chrome.fileManagerPrivate.FileCategory.ALL);
-
+    if (util.isFilesAppExperimental()) {
+      this.store_.dispatch(addUiEntry({entry: this.recentEntry_}));
+    }
     assert(this.launchParams_);
     this.selectionHandler_ = new FileSelectionHandler(
         assert(this.directoryModel_), assert(this.fileOperationManager_),
@@ -1384,7 +1392,7 @@ export class FileManager extends EventTarget {
     const searchQuery = this.launchParams_.searchQuery;
     if (searchQuery) {
       metrics.startInterval('Load.ProcessInitialSearchQuery');
-      getStore().dispatch(updateSearch({
+      this.store_.dispatch(updateSearch({
         query: searchQuery,
         status: PropStatus.STARTED,
         options: undefined,
@@ -1718,10 +1726,16 @@ export class FileManager extends EventTarget {
             str('TRASH_ROOT_LABEL'), NavigationModelItemType.TRASH,
             new TrashRootEntry());
       }
+      if (util.isFilesAppExperimental()) {
+        this.store_.dispatch(addUiEntry({entry: this.fakeTrashItem_.entry}));
+      }
       this.directoryTree.dataModel.fakeTrashItem = this.fakeTrashItem_;
       return;
     }
 
+    if (util.isFilesAppExperimental()) {
+      this.store_.dispatch(removeUiEntry({key: trashRootKey}));
+    }
     this.directoryTree.dataModel.fakeTrashItem = null;
     this.navigateAwayFromDisabledRoot_(this.fakeTrashItem_);
   }
@@ -1733,19 +1747,19 @@ export class FileManager extends EventTarget {
    */
   toggleDriveRootOnPreferencesUpdate_() {
     if (this.driveEnabled_) {
+      const driveFakeRoot = new FakeEntryImpl(
+          str('DRIVE_DIRECTORY_LABEL'),
+          VolumeManagerCommon.RootType.DRIVE_FAKE_ROOT);
       if (!this.fakeDriveItem_) {
         this.fakeDriveItem_ = new NavigationModelFakeItem(
             str('DRIVE_DIRECTORY_LABEL'), NavigationModelItemType.DRIVE,
-            new FakeEntryImpl(
-                str('DRIVE_DIRECTORY_LABEL'),
-                VolumeManagerCommon.RootType.DRIVE_FAKE_ROOT));
+            driveFakeRoot);
         this.fakeDriveItem_.disabled = this.volumeManager_.isDisabled(
             VolumeManagerCommon.VolumeType.DRIVE);
       }
       this.directoryTree.dataModel.fakeDriveItem = this.fakeDriveItem_;
       return;
     }
-
     this.directoryTree.dataModel.fakeDriveItem = null;
     this.navigateAwayFromDisabledRoot_(this.fakeDriveItem_);
   }

ui/file_manager/file_manager/foreground/js/folder_shortcuts_data_model.js

@@ -10,6 +10,8 @@ import {FilteredVolumeManager} from '../../common/js/filtered_volume_manager.js'
 import {metrics} from '../../common/js/metrics.js';
 import {util} from '../../common/js/util.js';
 import {VolumeManagerCommon} from '../../common/js/volume_manager_types.js';
+import {addFolderShortcut, refreshFolderShortcut, removeFolderShortcut} from '../../state/actions/folder_shortcuts.js';
+import {getStore} from '../../state/store.js';
 
 /**
  * The drive mount path used in the persisted storage. It must be '/drive'.
@@ -35,6 +37,7 @@ export class FolderShortcutsDataModel extends EventTarget {
     this.pendingPaths_ = {};  // Hash map for easier deleting.
     this.unresolvablePaths_ = {};
     this.lastDriveRootURL_ = null;
+    this.store_ = getStore();
 
     // Queue to serialize resolving entries.
     this.queue_ = new AsyncQueue();
@@ -181,6 +184,9 @@ export class FolderShortcutsDataModel extends EventTarget {
         }
         // If something changed, then save.
         if (changed) {
+          if (util.isFilesAppExperimental()) {
+            this.store_.dispatch(refreshFolderShortcut({entries: this.array_}));
+          }
           this.save_();
         }
         queueCallback();
@@ -310,6 +316,9 @@ export class FolderShortcutsDataModel extends EventTarget {
    */
   add(value) {
     const result = this.addInternal_(value);
+    if (util.isFilesAppExperimental()) {
+      this.store_.dispatch(addFolderShortcut(value));
+    }
     metrics.recordUserAction('FolderShortcut.Add');
     this.save_();
     return result;
@@ -361,6 +370,9 @@ export class FolderShortcutsDataModel extends EventTarget {
   remove(value) {
     const result = this.removeInternal_(value);
     if (result !== -1) {
+      if (util.isFilesAppExperimental()) {
+        this.store_.dispatch(removeFolderShortcut(value));
+      }
       this.save_();
       metrics.recordUserAction('FolderShortcut.Remove');
     }

ui/file_manager/file_manager/foreground/js/guest_os_controller.js

@@ -7,6 +7,8 @@ import {GuestOsPlaceholder} from '../../common/js/files_app_entry_types.js';
 import {util} from '../../common/js/util.js';
 import {VolumeManagerCommon} from '../../common/js/volume_manager_types.js';
 import {VolumeManager} from '../../externs/volume_manager.js';
+import {addUiEntry, removeUiEntry} from '../../state/actions/ui_entries.js';
+import {getEntry, getStore} from '../../state/store.js';
 
 import {DirectoryModel} from './directory_model.js';
 import {NavigationModelFakeItem, NavigationModelItemType} from './navigation_list_model.js';
@@ -55,17 +57,34 @@ export class GuestOsController {
    * @param {!Array<!chrome.fileManagerPrivate.MountableGuest>} guests
    */
   async onMountableGuestsChanged(guests) {
+    const store = getStore();
+    if (util.isFilesAppExperimental()) {
+      const newGuestIdSet = new Set(guests.map(guest => guest.id));
+      const state = store.getState();
+      // Remove non-existed guest os.
+      for (const uiEntryKey of state.uiEntries) {
+        const uiEntry = getEntry(state, uiEntryKey);
+        if (uiEntry && 'guest_id' in uiEntry &&
+            !newGuestIdSet.has(uiEntry.guest_id)) {
+          store.dispatch(removeUiEntry({key: uiEntryKey}));
+        }
+      }
+    }
     this.directoryTree_.dataModel.guestOsPlaceholders = guests.map(guest => {
+      const guestOsEntry =
+          new GuestOsPlaceholder(guest.displayName, guest.id, guest.vmType);
       const navigationModelItem = new NavigationModelFakeItem(
-          guest.displayName, NavigationModelItemType.GUEST_OS,
-          new GuestOsPlaceholder(guest.displayName, guest.id, guest.vmType));
+          guest.displayName, NavigationModelItemType.GUEST_OS, guestOsEntry);
       if (guest.vmType == chrome.fileManagerPrivate.VmType.ARCVM) {
         navigationModelItem.disabled = this.volumeManager_.isDisabled(
             VolumeManagerCommon.VolumeType.ANDROID_FILES);
       } else {
         navigationModelItem.disabled = this.volumeManager_.isDisabled(
             VolumeManagerCommon.VolumeType.GUEST_OS);
       }
+      if (util.isFilesAppExperimental()) {
+        store.dispatch(addUiEntry({entry: guestOsEntry}));
+      }
       return navigationModelItem;
     });
 

ui/file_manager/file_manager/foreground/js/path_component.js

@@ -83,7 +83,11 @@ export class PathComponent {
     let displayRootFullPath = locationInfo.volumeInfo.displayRoot.fullPath;
 
     const prefixEntry = locationInfo.volumeInfo.prefixEntry;
-    if (prefixEntry) {
+    // Directories under Drive Fake Root can return the fake root entry list as
+    // prefix entry, but we will never show "Google Drive" as the prefix in the
+    // breadcrumb.
+    if (prefixEntry &&
+        prefixEntry.rootType !== VolumeManagerCommon.RootType.DRIVE_FAKE_ROOT) {
       components.push(new PathComponent(
           prefixEntry.name, prefixEntry.toURL(), prefixEntry));
     }

ui/file_manager/file_manager/state/store.ts

@@ -19,8 +19,10 @@ export type Store = BaseStore<State, Action>;
 /**
  * Store singleton instance.
  * It's only exposed via `getStore()` to guarantee it's a single instance.
+ * TODO(b/272120634): Use window.store temporarily, uncomment below code after
+ * the duplicate store issue is resolved.
  */
-let store: null|Store = null;
+// let store: null|Store = null;
 
 /**
  * Returns the singleton instance for the Files app's Store.
@@ -29,12 +31,14 @@ let store: null|Store = null;
  * at the app's main entry point.
  */
 export function getStore(): Store {
-  if (!store) {
-    store =
+  // TODO(b/272120634): Put the store on window to prevent Store being created
+  // twice.
+  if (!window.store) {
+    window.store =
         new BaseStore<State, Action>({allEntries: {}} as State, rootReducer);
   }
 
-  return store;
+  return window.store;
 }
 
 export function getEmptyState(): State {