open it in a nwe window

Author: odeimaiz

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

@@ -337,7 +337,6 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
       [
         this.__getInfoPage,
         this.__getBillingPage,
-        this.__getActivityOverviewPage,
         this.__getServicesUpdatePage,
         this.__getServicesBootOptionsPage,
         this.__getConversationsPage,
@@ -357,27 +356,9 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
         }
       });
 
-      const resourceData = this.__resourceData;
-      if (!osparc.utils.Resources.isService(resourceData)) {
-        const title = osparc.product.Utils.getStudyAlias({firstUpperCase: true}) + this.tr(" Files...");
-        const iconSrc = "@FontAwesome5Solid/file/22";
-        const dataAccess = new qx.ui.basic.Atom().set({
-          label: title,
-          icon: iconSrc,
-          font: "text-14",
-          padding: 8,
-          paddingLeft: 12,
-          gap: 14,
-          cursor: "pointer",
-        });
-        dataAccess.addListener("tap", () => osparc.widget.StudyDataManager.popUpInWindow(resourceData["uuid"]));
-        this.addWidgetToTabs(dataAccess);
 
-        if (resourceData["resourceType"] === "study") {
-          const canShowData = osparc.study.Utils.canShowStudyData(resourceData);
-          dataAccess.setEnabled(canShowData);
-        }
-      }
+      this.__getActivityOverviewPopUp();
+      this.__getProjectFilesPopUp();
 
       if (selectedTabId) {
         const pageFound = tabsView.getChildren().find(page => page.tabId === selectedTabId);
@@ -495,31 +476,6 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
       return null;
     },
 
-    __getActivityOverviewPage: function() {
-      const resourceData = this.__resourceData;
-      if (
-        !osparc.desktop.credits.Utils.areWalletsEnabled() ||
-        !osparc.utils.Resources.isStudy(resourceData)
-      ) {
-        return null;
-      }
-
-      const id = "ActivityOverview";
-      const title = this.tr("Activity Overview");
-      const iconSrc = "@FontAwesome5Solid/tasks/22";
-      const page = this.__billingSettings = new osparc.dashboard.resources.pages.BasePage(title, iconSrc, id);
-      this.__addOpenButton(page);
-
-      const lazyLoadContent = () => {
-        const activityOverview = new osparc.jobs.ActivityOverview(resourceData);
-        const billingScroll = new qx.ui.container.Scroll(activityOverview);
-        page.addToContent(billingScroll);
-      }
-      page.addListenerOnce("appear", lazyLoadContent, this);
-
-      return page;
-    },
-
     __getPreviewPage: function() {
       const resourceData = this.__resourceData;
       if (
@@ -840,6 +796,52 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
       page.addToHeader(toolbar);
       page.addToContent(createFunction);
       return page;
-    }
+    },
+
+    __getProjectFilesPopUp: function() {
+      const resourceData = this.__resourceData;
+      if (!osparc.utils.Resources.isService(resourceData)) {
+        const title = osparc.product.Utils.getStudyAlias({firstUpperCase: true}) + this.tr(" Files...");
+        const iconSrc = "@FontAwesome5Solid/file/22";
+        const dataAccess = new qx.ui.basic.Atom().set({
+          label: title,
+          icon: iconSrc,
+          font: "text-14",
+          padding: 8,
+          paddingLeft: 12,
+          gap: 14,
+          cursor: "pointer",
+        });
+        dataAccess.addListener("tap", () => osparc.widget.StudyDataManager.popUpInWindow(resourceData["uuid"]));
+        this.addWidgetToTabs(dataAccess);
+
+        if (resourceData["resourceType"] === "study") {
+          const canShowData = osparc.study.Utils.canShowStudyData(resourceData);
+          dataAccess.setEnabled(canShowData);
+        }
+      }
+    },
+
+    __getActivityOverviewPopUp: function() {
+      const resourceData = this.__resourceData;
+      if (
+        osparc.desktop.credits.Utils.areWalletsEnabled() &&
+        osparc.utils.Resources.isStudy(resourceData)
+      ) {
+        const title = this.tr("Activity Overview...");
+        const iconSrc = "@FontAwesome5Solid/tasks/22";
+        const dataAccess = new qx.ui.basic.Atom().set({
+          label: title,
+          icon: iconSrc,
+          font: "text-14",
+          padding: 8,
+          paddingLeft: 10,
+          gap: 12, // align with the rest of the tabs
+          cursor: "pointer",
+        });
+        dataAccess.addListener("tap", () => osparc.jobs.ActivityOverview.popUpInWindow(resourceData));
+        this.addWidgetToTabs(dataAccess);
+      }
+    },
   }
 });

services/static-webserver/client/source/class/osparc/jobs/ActivityCenterWindow.js

@@ -24,8 +24,8 @@ qx.Class.define("osparc.jobs.ActivityCenterWindow", {
     this.set({
       layout: new qx.ui.layout.VBox(),
       modal: true,
-      width: 1100,
-      height: 500,
+      width: this.self().WIDTH,
+      height: this.self().HEIGHT,
       showMaximize: false,
       showMinimize: false,
     });
@@ -34,6 +34,9 @@ qx.Class.define("osparc.jobs.ActivityCenterWindow", {
   },
 
   statics: {
+    WIDTH: 1000,
+    HEIGHT: 500,
+
     openWindow: function() {
       const runsWindow = new osparc.jobs.ActivityCenterWindow();
       runsWindow.center();

services/static-webserver/client/source/class/osparc/jobs/ActivityOverview.js

@@ -26,6 +26,14 @@ qx.Class.define("osparc.jobs.ActivityOverview", {
     this.__buildLayout(projectData);
   },
 
+  statics: {
+    popUpInWindow: function(projectData) {
+      const activityOverview = new osparc.jobs.ActivityOverview(projectData);
+      const title = qx.locale.Manager.tr("Activity Overview");
+      return osparc.ui.window.Window.popUpInWindow(activityOverview, title, osparc.jobs.ActivityCenterWindow.WIDTH, osparc.jobs.ActivityCenterWindow.HEIGHT);
+    },
+  },
+
   members: {
     __buildLayout: function(projectData) {
       const subRunsTable = new osparc.jobs.SubRunsTable(projectData["uuid"]);