diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js index 9082c3a5c2b2..9334861f11c4 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js @@ -282,7 +282,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { this._addToLayout(resourcesContainer); }, - _groupByChanged: function(groupBy) { + __groupByChanged: function(groupBy) { // if cards are grouped they need to be in grid mode this._resourcesContainer.setMode("grid"); this.__viewModeLayout.setVisibility(groupBy ? "excluded" : "visible"); @@ -290,7 +290,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { this._reloadCards(); }, - _viewByChanged: function(viewMode) { + __viewModeChanged: function(viewMode) { this._resourcesContainer.setMode(viewMode); this._reloadCards(); @@ -314,14 +314,14 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { const dontGroup = new qx.ui.menu.RadioButton(this.tr("None")); osparc.utils.Utils.setIdToWidget(dontGroup, "groupByNone"); - dontGroup.addListener("execute", () => this._groupByChanged(null)); + dontGroup.addListener("execute", () => this.__groupByChanged(null)); groupByMenu.add(dontGroup); groupOptions.add(dontGroup); if (this._resourceType === "template") { const tagByGroup = new qx.ui.menu.RadioButton(this.tr("Tags")); - tagByGroup.addListener("execute", () => this._groupByChanged("tags")); + tagByGroup.addListener("execute", () => this.__groupByChanged("tags")); groupByMenu.add(tagByGroup); groupOptions.add(tagByGroup); if ( @@ -334,7 +334,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { } const groupByShared = new qx.ui.menu.RadioButton(this.tr("Shared with")); - groupByShared.addListener("execute", () => this._groupByChanged("shared")); + groupByShared.addListener("execute", () => this.__groupByChanged("shared")); groupByMenu.add(groupByShared); groupOptions.add(groupByShared); @@ -343,10 +343,10 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", { _addViewModeButton: function() { const gridBtn = this.self().createToolbarRadioButton(null, "@FontAwesome5Solid/th/14", this.tr("Grid view"), "left"); - gridBtn.addListener("execute", () => this._viewByChanged("grid")); + gridBtn.addListener("execute", () => this.__viewModeChanged("grid")); const listBtn = this.self().createToolbarRadioButton(null, "@FontAwesome5Solid/bars/14", this.tr("List view"), "right"); - listBtn.addListener("execute", () => this._viewByChanged("list")); + listBtn.addListener("execute", () => this.__viewModeChanged("list")); const viewModeLayout = this.__viewModeLayout; const radioGroup = new qx.ui.form.RadioGroup(); diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js index f0d854b2222c..df41744539d5 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceContainerManager.js @@ -59,8 +59,7 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { check: ["grid", "list"], init: "grid", nullable: false, - event: "changeMode", - apply: "__reloadCards" + event: "changeMode" }, groupBy: { @@ -277,10 +276,6 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { this._removeAll(); }, - __reloadCards: function(mode) { - this.reloadCards(); - }, - __addFoldersContainer: function() { // add foldersContainer dynamically [ @@ -301,7 +296,7 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { }); }, - reloadCards: function(resourceType) { + __rebuildLayout: function(resourceType) { this.__cleanAll(); if (osparc.utils.DisabledPlugins.isFoldersEnabled()) { this.__addFoldersContainer(); @@ -326,8 +321,12 @@ qx.Class.define("osparc.dashboard.ResourceContainerManager", { }); this._add(this.__nonGroupedContainer); } + }, - let cards = []; + reloadCards: function(resourceType) { + this.__rebuildLayout(resourceType); + + const cards = []; this.__resourcesList.forEach(resourceData => { Array.prototype.push.apply(cards, this.__resourceToCards(resourceData)); }); diff --git a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js index bc22291e7bca..165b2dff7e0e 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js @@ -104,6 +104,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { __workspaceHeader: null, __workspacesList: null, __foldersList: null, + __loadingFolders: null, // overridden initResources: function() { @@ -170,31 +171,35 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { }, __reloadFolders: function() { - if (!osparc.auth.Manager.getInstance().isLoggedIn()) { + if ( + !osparc.auth.Manager.getInstance().isLoggedIn() || + !osparc.utils.DisabledPlugins.isFoldersEnabled() || + this.__loadingFolders) { return; } - - if (osparc.utils.DisabledPlugins.isFoldersEnabled()) { - const folderId = this.getCurrentFolderId(); - const workspaceId = this.getCurrentWorkspaceId(); - if (workspaceId === -1 || workspaceId === -2) { - return; - } - this.__setFoldersToList([]); - osparc.store.Folders.getInstance().fetchFolders(folderId, workspaceId, this.getOrderBy()) - .then(folders => { - this.__setFoldersToList(folders); - }) - .catch(console.error); + const workspaceId = this.getCurrentWorkspaceId(); + if (workspaceId === -1 || workspaceId === -2) { + return; } + + this.__loadingFolders = true; + this.__setFoldersToList([]); + const folderId = this.getCurrentFolderId(); + osparc.store.Folders.getInstance().fetchFolders(folderId, workspaceId, this.getOrderBy()) + .then(folders => { + this.__setFoldersToList(folders); + }) + .catch(console.error) + .finally(() => this.__loadingFolders = null); }, __reloadStudies: function() { - if (this._loadingResourcesBtn.isFetching() || !osparc.auth.Manager.getInstance().isLoggedIn()) { - return; - } const workspaceId = this.getCurrentWorkspaceId(); - if (workspaceId === -1) { // shared workspace listing + if ( + !osparc.auth.Manager.getInstance().isLoggedIn() || + workspaceId === -1 || // listing workspaces + this._loadingResourcesBtn.isFetching() + ) { return; } @@ -283,6 +288,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { __resetStudiesList: function() { this._resourcesList = []; + // It will remove the study cards this._reloadCards(); }, @@ -693,7 +699,9 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { invalidateStudies: function() { osparc.store.Store.getInstance().invalidate("studies"); this.__resetStudiesList(); - this._resourcesContainer.getFlatList().nextRequest = null; + if (this._resourcesContainer.getFlatList()) { + this._resourcesContainer.getFlatList().nextRequest = null; + } }, __addNewStudyButtons: function() { @@ -938,6 +946,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { return; } + this._loadingResourcesBtn.setFetching(false); this.resetSelection(); this.setMultiSelection(false); this.set({ @@ -1233,6 +1242,7 @@ qx.Class.define("osparc.dashboard.StudyBrowser", { } else { this._resourcesList[index] = studyData; } + // it will render the studies in the right order this._reloadCards(); }, diff --git a/services/static-webserver/client/source/class/osparc/data/Resources.js b/services/static-webserver/client/source/class/osparc/data/Resources.js index 3c2d4d500f64..9d591c0d1eee 100644 --- a/services/static-webserver/client/source/class/osparc/data/Resources.js +++ b/services/static-webserver/client/source/class/osparc/data/Resources.js @@ -1370,7 +1370,7 @@ qx.Class.define("osparc.data.Resources", { params["url"] = {}; } params["url"]["offset"] = offset; - params["url"]["limit"] = 20; + params["url"]["limit"] = 10; const endpoint = "getPage"; const options = { resolveWResponse: true