🎨 [Frontend] Move multiple studies at once

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

@@ -784,13 +784,9 @@ qx.Class.define("osparc.dashboard.CardBase", {
         if (billingSettingsButton) {
           billingSettingsButton.setEnabled(osparc.study.Utils.canShowBillingOptions(resourceData));
         }
-        const moveToFolderButton = menuButtons.find(menuBtn => "moveToFolderButton" in menuBtn);
-        if (moveToFolderButton) {
-          moveToFolderButton.setEnabled(osparc.study.Utils.canMoveToFolder(resourceData));
-        }
-        const moveToWorkspaceButton = menuButtons.find(menuBtn => "moveToWorkspaceButton" in menuBtn);
-        if (moveToWorkspaceButton) {
-          moveToWorkspaceButton.setEnabled(osparc.study.Utils.canMoveToWorkspace(resourceData));
+        const moveToButton = menuButtons.find(menuBtn => "moveToButton" in menuBtn);
+        if (moveToButton) {
+          moveToButton.setEnabled(osparc.study.Utils.canMoveTo(resourceData));
         }
         const deleteButton = menuButtons.find(menuBtn => "deleteButton" in menuBtn);
         if (deleteButton) {

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

@@ -45,8 +45,7 @@ qx.Class.define("osparc.dashboard.FolderButtonItem", {
   events: {
     "folderSelected": "qx.event.type.Data",
     "folderUpdated": "qx.event.type.Data",
-    "moveFolderToFolderRequested": "qx.event.type.Data",
-    "moveFolderToWorkspaceRequested": "qx.event.type.Data",
+    "moveFolderToRequested": "qx.event.type.Data",
     "deleteFolderRequested": "qx.event.type.Data"
   },
 
@@ -191,13 +190,9 @@ qx.Class.define("osparc.dashboard.FolderButtonItem", {
       editButton.addListener("execute", () => this.__editFolder(), this);
       menu.add(editButton);
 
-      const moveToFolderButton = new qx.ui.menu.Button(this.tr("Move to Folder..."), "@FontAwesome5Solid/folder/12");
-      moveToFolderButton.addListener("execute", () => this.fireDataEvent("moveFolderToFolderRequested", this.getFolderId()), this);
-      menu.add(moveToFolderButton);
-
-      const moveToWorkspaceButton = new qx.ui.menu.Button(this.tr("Move to Workspace..."), osparc.store.Workspaces.iconPath(14));
-      moveToWorkspaceButton.addListener("execute", () => this.fireDataEvent("moveFolderToWorkspaceRequested", this.getFolderId()), this);
-      menu.add(moveToWorkspaceButton);
+      const moveToButton = new qx.ui.menu.Button(this.tr("Move to..."), "@FontAwesome5Solid/folder/12");
+      moveToButton.addListener("execute", () => this.fireDataEvent("moveFolderToRequested", this.getFolderId()), this);
+      menu.add(moveToButton);
 
       menu.addSeparator();
 

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

@@ -0,0 +1,123 @@
+/* ************************************************************************
+
+   osparc - the simcore frontend
+
+   https://osparc.io
+
+   Copyright:
+     2024 IT'IS Foundation, https://itis.swiss
+
+   License:
+     MIT: https://opensource.org/licenses/MIT
+
+   Authors:
+     * Odei Maiz (odeimaiz)
+
+************************************************************************ */
+
+qx.Class.define("osparc.dashboard.MoveResourceTo", {
+  extend: qx.ui.core.Widget,
+
+  construct: function(currentWorkspaceId, currentFolderId) {
+    this.base(arguments);
+
+    this.__currentWorkspaceId = currentWorkspaceId;
+    this.__currentFolderId = currentFolderId;
+
+    this._setLayout(new qx.ui.layout.VBox(10));
+
+    this.getChildControl("current-location");
+
+    const workspacesAndFoldersTree = this.getChildControl("workspaces-and-folders-tree");
+    this.getChildControl("cancel-btn");
+    const moveButton = this.getChildControl("move-btn");
+
+    moveButton.setEnabled(false);
+    workspacesAndFoldersTree.getSelection().addListener("change", () => {
+      const selection = workspacesAndFoldersTree.getSelection();
+      if (selection.getLength() > 0) {
+        const item = selection.getItem(0);
+        this.__selectedWorkspaceId = item.getWorkspaceId();
+        this.__selectedFolderId = item.getFolderId();
+        moveButton.setEnabled(this.__currentWorkspaceId !== this.__selectedWorkspaceId || this.__currentFolderId !== this.__selectedFolderId);
+      }
+    }, this);
+    moveButton.addListener("execute", () => {
+      this.fireDataEvent("moveTo", {
+        workspaceId: this.__selectedWorkspaceId,
+        folderId: this.__selectedFolderId,
+      });
+    }, this);
+  },
+
+  events: {
+    "cancel": "qx.event.type.Event",
+    "moveTo": "qx.event.type.Data"
+  },
+
+  members: {
+    __currentWorkspaceId: null,
+    __currentFolderId: null,
+    __selectedWorkspaceId: null,
+    __selectedFolderId: null,
+
+    _createChildControlImpl: function(id) {
+      let control;
+      switch (id) {
+        case "current-location": {
+          control = new qx.ui.container.Composite(new qx.ui.layout.VBox(5));
+          const intro = new qx.ui.basic.Label(this.tr("Current location"));
+          control.add(intro);
+          const workspace = osparc.store.Workspaces.getInstance().getWorkspace(this.__currentWorkspaceId);
+          const workspaceText = workspace ? workspace.getName() : "My Workspace";
+          const workspaceLabel = new qx.ui.basic.Label(this.tr("- Workspace: ") + workspaceText);
+          control.add(workspaceLabel);
+          const folder = osparc.store.Folders.getInstance().getFolder(this.__currentFolderId);
+          if (folder) {
+            const folderText = folder.getName();
+            const folderLabel = new qx.ui.basic.Label(this.tr("- Folder: ") + folderText);
+            control.add(folderLabel);
+          }
+          this._add(control);
+          break;
+        }
+        case "workspaces-and-folders-tree":
+          control = new osparc.dashboard.WorkspacesAndFoldersTree();
+          this._add(control);
+          break;
+        case "buttons-layout":
+          control = new qx.ui.container.Composite(new qx.ui.layout.HBox(10).set({
+            alignX: "right"
+          }));
+          this._add(control);
+          break;
+        case "cancel-btn": {
+          const buttons = this.getChildControl("buttons-layout");
+          control = new qx.ui.form.Button(this.tr("Cancel")).set({
+            appearance: "form-button-text"
+          });
+          control.addListener("execute", () => this.fireEvent("cancel"), this);
+          buttons.add(control);
+          break;
+        }
+        case "move-btn": {
+          const buttons = this.getChildControl("buttons-layout");
+          control = new qx.ui.form.Button(this.tr("Move")).set({
+            appearance: "form-button"
+          });
+          buttons.add(control);
+          break;
+        }
+      }
+      return control || this.base(arguments, id);
+    },
+
+    __getUpstreamFolders: function(childFolder, folderIds = []) {
+      if (childFolder) {
+        folderIds.unshift(childFolder.getFolderId());
+        const parentFolder = osparc.store.Folders.getInstance().getFolder(childFolder.getParentFolderId());
+        this.__getUpstreamFolders(parentFolder, folderIds);
+      }
+    }
+  }
+});

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

@@ -258,8 +258,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
       resourcesContainer.addListener("tagClicked", e => this._searchBarFilter.addTagActiveFilter(e.getData()));
       resourcesContainer.addListener("emptyStudyClicked", e => this._deleteResourceRequested(e.getData()));
       resourcesContainer.addListener("folderUpdated", e => this._folderUpdated(e.getData()));
-      resourcesContainer.addListener("moveFolderToFolderRequested", e => this._moveFolderToFolderRequested(e.getData()));
-      resourcesContainer.addListener("moveFolderToWorkspaceRequested", e => this._moveFolderToWorkspaceRequested(e.getData()));
+      resourcesContainer.addListener("moveFolderToRequested", e => this._moveFolderToRequested(e.getData()));
       resourcesContainer.addListener("deleteFolderRequested", e => this._deleteFolderRequested(e.getData()));
       resourcesContainer.addListener("folderSelected", e => {
         const folderId = e.getData();
@@ -492,11 +491,7 @@ qx.Class.define("osparc.dashboard.ResourceBrowserBase", {
       throw new Error("Abstract method called!");
     },
 
-    _moveFolderToFolderRequested: function(folderId) {
-      throw new Error("Abstract method called!");
-    },
-
-    _moveFolderToWorkspaceRequested: function(folderId) {
+    _moveFolderToRequested: function(folderId) {
       throw new Error("Abstract method called!");
     },