SearchBar on top

Author: odeimaiz

services/static-webserver/client/source/class/osparc/dashboard/ResourceBrowserBase.js

@@ -230,10 +230,16 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
       throw new Error("Abstract method called!");
     },
 
-    _createResourcesLayout: function() {
-      const topBar = this.__createTopBar();
-      this._addToLayout(topBar);
+    _createSearchBar: function() {
+      const searchBarFilter = this._searchBarFilter = new osparc.dashboard.SearchBarFilter(this._resourceType).set({
+        paddingRight: 22
+      });
+      const textField = searchBarFilter.getChildControl("text-field");
+      osparc.utils.Utils.setIdToWidget(textField, "searchBarFilter-textField-"+this._resourceType);
+      this._addToLayout(searchBarFilter);
+    },
 
+    _createResourcesLayout: function() {
       const toolbar = this._toolbar = new qx.ui.toolbar.ToolBar().set({
         backgroundColor: "transparent",
         spacing: 10,
@@ -280,22 +286,6 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
       this._addToLayout(resourcesContainer);
     },
 
-    __createTopBar: function() {
-      const topBar = new qx.ui.container.Composite(new qx.ui.layout.HBox(10)).set({
-        paddingRight: 22,
-        alignY: "middle"
-      });
-
-      const searchBarFilter = this._searchBarFilter = new osparc.dashboard.SearchBarFilter(this._resourceType);
-      const textField = searchBarFilter.getChildControl("text-field");
-      osparc.utils.Utils.setIdToWidget(textField, "searchBarFilter-textField-"+this._resourceType);
-      topBar.add(searchBarFilter, {
-        flex: 1
-      });
-
-      return topBar;
-    },
-
     _groupByChanged: function(groupBy) {
       // if cards are grouped they need to be in grid mode
       this._resourcesContainer.setMode("grid");

services/static-webserver/client/source/class/osparc/dashboard/ServiceBrowser.js

@@ -145,6 +145,7 @@ qx.Class.define("osparc.dashboard.ServiceBrowser", {
 
     // LAYOUT //
     _createLayout: function() {
+      this._createSearchBar();
       this._createResourcesLayout();
       const list = this._resourcesContainer.getFlatList();
       if (list) {

services/static-webserver/client/source/class/osparc/dashboard/StudyBrowser.js

@@ -872,6 +872,8 @@ qx.Class.define("osparc.dashboard.StudyBrowser", {
 
     // LAYOUT //
     _createLayout: function() {
+      this._createSearchBar();
+
       if (osparc.utils.DisabledPlugins.isFoldersEnabled()) {
         const workspaceHeader = new osparc.dashboard.WorkspaceHeader();
         this.bind("currentWorkspaceId", workspaceHeader, "currentWorkspaceId");

services/static-webserver/client/source/class/osparc/dashboard/TemplateBrowser.js

@@ -162,6 +162,7 @@ qx.Class.define("osparc.dashboard.TemplateBrowser", {
 
     // LAYOUT //
     _createLayout: function() {
+      this._createSearchBar();
       this._createResourcesLayout();
       const list = this._resourcesContainer.getFlatList();
       if (list) {