baseAppView: Only add and remove when necessary

BaseAppView currently removes all icons, and readds them, every
time the list of app icons needs to be redisplayed. In order to
allow animating app icon positions in the future, however, we
cannot destroy the actors of the app icons.

Previous commits paved the way for us to do differential loading,
i.e. add only the icons that were added, and remove only what was
removed.

Make the BaseAppView effectively implement differential loading.
The BaseAppView.removeAll() method is removed, since we do not
remove all icons anymore. BaseAppView._loadApps() now returns an
array with the new apps, instead of putting them directly at the
BaseAppView lists.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/645

js/ui/appDisplay.js

@@ -114,18 +114,34 @@ class BaseAppView {
         // Nothing by default
     }
 
-    removeAll() {
-        this._grid.destroyAll();
-        this._items = {};
-        this._allItems = [];
-    }
-
     _redisplay() {
-        this.removeAll();
-        this._loadApps();
+        let oldApps = this._allItems.slice();
+        let oldAppIds = oldApps.map(icon => icon.id);
+
+        let newApps = this._loadApps().sort(this._compareItems);
+        let newAppIds = newApps.map(icon => icon.id);
+
+        let addedApps = newApps.filter(icon => !oldAppIds.includes(icon.id));
+        let removedApps = oldApps.filter(icon => !newAppIds.includes(icon.id));
+
+        // Remove old app icons
+        removedApps.forEach(icon => {
+            let iconIndex = this._allItems.indexOf(icon);
+
+            this._allItems.splice(iconIndex, 1);
+            this._grid.removeItem(icon);
+            delete this._items[icon.id];
+        });
+
+        // Add new app icons
+        addedApps.forEach(icon => {
+            let iconIndex = newApps.indexOf(icon);
+
+            this._allItems.splice(iconIndex, 0, icon);
+            this._grid.addItem(icon, iconIndex);
+            this._items[icon.id] = icon;
+        });
 
-        this._allItems.sort(this._compareItems);
-        this._allItems.forEach(item => this._grid.addItem(item));
         this.emit('view-loaded');
     }
 
@@ -324,25 +340,9 @@ var AllView = class AllView extends BaseAppView {
         });
     }
 
-    removeAll() {
-        this.folderIcons = [];
-        super.removeAll();
-    }
-
     _redisplay() {
-        let openFolderId = null;
-        if (this._displayingPopup && this._currentPopup)
-            openFolderId = this._currentPopup._source.id;
-
         super._redisplay();
         this._refilterApps();
-
-        if (openFolderId) {
-            let [folderToReopen] = this.folderIcons.filter(folder => folder.id == openFolderId);
-
-            if (folderToReopen)
-                folderToReopen.open();
-        }
     }
 
     _itemNameChanged(item) {
@@ -376,6 +376,7 @@ var AllView = class AllView extends BaseAppView {
     }
 
     _loadApps() {
+        let newApps = [];
         this._appInfoList = Shell.AppSystem.get_default().get_installed().filter(appInfo => {
             try {
                 (appInfo.get_id()); // catch invalid file encodings
@@ -389,6 +390,8 @@ var AllView = class AllView extends BaseAppView {
 
         let appSys = Shell.AppSystem.get_default();
 
+        this.folderIcons = [];
+
         let folders = this._folderSettings.get_strv('folder-children');
         folders.forEach(id => {
             if (this.hasItem(id))
@@ -397,7 +400,7 @@ var AllView = class AllView extends BaseAppView {
             let icon = new FolderIcon(id, path, this);
             icon.connect('name-changed', this._itemNameChanged.bind(this));
             icon.connect('apps-changed', this._refilterApps.bind(this));
-            this.addItem(icon);
+            newApps.push(icon);
             this.folderIcons.push(icon);
         });
 
@@ -414,8 +417,10 @@ var AllView = class AllView extends BaseAppView {
 
             let icon = new AppIcon(app,
                                    { isDraggable: favoritesWritable });
-            this.addItem(icon);
+            newApps.push(icon);
         });
+
+        return newApps;
     }
 
     // Overridden from BaseAppView
@@ -708,11 +713,12 @@ var FrequentView = class FrequentView extends BaseAppView {
     }
 
     _loadApps() {
+        let apps = [];
         let mostUsed = this._usage.get_most_used();
         let hasUsefulData = this.hasUsefulData();
         this._noFrequentAppsLabel.visible = !hasUsefulData;
         if (!hasUsefulData)
-            return;
+            return [];
 
         // Allow dragging of the icon only if the Dash would accept a drop to
         // change favorite-apps. There are no other possible drop targets from
@@ -727,8 +733,10 @@ var FrequentView = class FrequentView extends BaseAppView {
                 continue;
             let appIcon = new AppIcon(mostUsed[i],
                                       { isDraggable: favoritesWritable });
-            this.addItem(appIcon);
+            apps.push(appIcon);
         }
+
+        return apps;
     }
 
     // Called before allocation to calculate dynamic spacing
@@ -1135,6 +1143,7 @@ var FolderView = class FolderView extends BaseAppView {
     }
 
     _loadApps() {
+        let apps = [];
         let excludedApps = this._folder.get_strv('excluded-apps');
         let appSys = Shell.AppSystem.get_default();
         let addAppId = appId => {
@@ -1152,7 +1161,7 @@ var FolderView = class FolderView extends BaseAppView {
                 return;
 
             let icon = new AppIcon(app);
-            this.addItem(icon);
+            apps.push(icon);
         };
 
         let folderApps = this._folder.get_strv('apps');
@@ -1167,6 +1176,8 @@ var FolderView = class FolderView extends BaseAppView {
 
             addAppId(appInfo.get_id());
         });
+
+        return apps;
     }
 };