feat: make configurable action buttons shared component

.vscode/launch.json

@@ -2,11 +2,13 @@
     "version": "0.2.0",
     "configurations": [
       {
-        "name": "ng serve",
+        "name": "Debug SciCat frontend in Chrome",
         "type": "chrome",
         "request": "launch",
-        "url": "http://localhost:4200/#",
-        "webRoot": "${workspaceFolder}"
+        "url": "http://localhost:4200",
+        "webRoot": "${workspaceFolder}",
+        "sourceMaps": true,
+        "trace": true
       },
       {
         "name": "ng test",

CI/e2e/frontend.config.e2e.json

@@ -24,7 +24,6 @@
   "ingestManual": null,
   "jobsEnabled": true,
   "jsonMetadataEnabled": true,
-  "jupyterHubUrl": "",
   "landingPage": "doi.ess.eu/detail/",
   "lbBaseURL": "http://localhost:3000",
   "logbookEnabled": true,
@@ -106,6 +105,86 @@
       "authorization": ["#datasetAccess", "#datasetPublic"]
     }
   ],
+  "datasetDetailsActionsEnabled": true,
+  "datasetDetailsActions": [
+    {
+      "id": "01",
+      "order": 1,
+      "type": "xhr",
+      "method": "PATCH",
+      "description": "Publish dataset",
+      "label": "Publish",
+      "hidden": "#isPublished",
+      "mat_icon": "",
+      "url": "/api/v3/datasets/{{id}}",
+      "payload": "{\"isPublished\": true}"
+    },
+    {
+      "id": "02",
+      "order": 2,
+      "type": "xhr",
+      "method": "PATCH",
+      "description": "Unpublish published dataset",
+      "label": "Unpublish",
+      "hidden": "#!isPublished",
+      "mat_icon": "",
+      "url": "/api/v3/datasets/{{id}}",
+      "payload": "{\"isPublished\": false}"
+    },
+    {
+      "id": "03",
+      "order": 3,
+      "type": "form",
+      "method": "GET",
+      "description": "Jupyter hub",
+      "label": "Jupyter hub",
+      "mat_icon": "",
+      "url": "https://jupyterhub.esss.lu.se/",
+      "target": "_blank"
+    }
+  ],
+  "datasetSelectionActionsEnabled": true,
+  "datasetSelectionActions": [
+    {
+      "id": "01",
+      "order": 1,
+      "type": "link",
+      "description": "Publish datasets",
+      "label": "Publish",
+      "mat_icon": "school",
+      "url": "/datasets/batch/publish"
+    },
+    {
+      "id": "02",
+      "order": 2,
+      "type": "link",
+      "description": "Share datasets",
+      "label": "Share",
+      "mat_icon": "share",
+      "url": "/datasets/batch?share=true"
+    },
+    {
+      "id": "03",
+      "order": 3,
+      "type": "link",
+      "hidden": "!archiveWorkflowEnabled",
+      "description": "Retrieve datasets",
+      "label": "Retrieve",
+      "mat_icon": "cloud_download",
+      "url": "/datasets/batch?retrieve=true"
+    }
+  ],
+  "labelMaps": {
+    "filters": {
+      "LocationFilter": "Location",
+      "PidFilter": "Pid",
+      "GroupFilter": "Group",
+      "TypeFilter": "Type",
+      "KeywordFilter": "Keyword",
+      "DateRangeFilter": "Start Date - End Date",
+      "TextFilter": "Text"
+    }
+  },
   "defaultDatasetsListSettings": {
     "columns": [
       {

src/app/app-config.service.spec.ts

@@ -77,52 +77,14 @@ const appConfig: AppConfigInterface = {
   datasetDetailsShowMissingProposalId: true,
   helpMessages: new HelpMessages(),
   notificationInterceptorEnabled: true,
-  datafilesActionsEnabled: true,
-  datafilesActions: [
-    {
-      id: "eed8efec-4354-11ef-a3b5-d75573a5d37f",
-      order: 4,
-      label: "Download All",
-      files: "all",
-      mat_icon: "download",
-      url: "",
-      target: "_blank",
-      enabled: "#SizeLimit",
-      authorization: ["#datasetAccess", "#datasetPublic"],
-    },
-    {
-      id: "3072fafc-4363-11ef-b9f9-ebf568222d26",
-      order: 3,
-      label: "Download Selected",
-      files: "selected",
-      mat_icon: "download",
-      url: "",
-      target: "_blank",
-      enabled: "#Selected && #SizeLimit",
-      authorization: ["#datasetAccess", "#datasetPublic"],
-    },
-    {
-      id: "4f974f0e-4364-11ef-9c63-03d19f813f4e",
-      order: 2,
-      label: "Notebook All",
-      files: "all",
-      icon: "/assets/icons/jupyter_logo.png",
-      url: "",
-      target: "_blank",
-      authorization: ["#datasetAccess", "#datasetPublic"],
-    },
-    {
-      id: "fa3ce6ee-482d-11ef-95e9-ff2c80dd50bd",
-      order: 1,
-      label: "Notebook Selected",
-      files: "selected",
-      icon: "/assets/icons/jupyter_logo.png",
-      url: "",
-      target: "_blank",
-      enabled: "#Selected",
-      authorization: ["#datasetAccess", "#datasetPublic"],
-    },
-  ],
+  datasetActionsEnabled: false,
+  datasetActions: [],
+  datasetDetailsActionsEnabled: false,
+  datasetDetailsActions: [],
+  datafilesActionsEnabled: false,
+  datafilesActions: [],
+  datasetSelectionActionsEnabled: false,
+  datasetSelectionActions: [],
   defaultDatasetsListSettings: {
     columns: [
       {

src/app/app-config.service.ts

@@ -73,8 +73,14 @@ export interface AppConfigInterface {
   datasetJsonScientificMetadata: boolean;
   datasetReduceEnabled: boolean;
   datasetDetailsShowMissingProposalId: boolean;
+  datasetActionsEnabled: boolean;
+  datasetActions: any[];
   datafilesActionsEnabled: boolean;
   datafilesActions: any[];
+  datasetDetailsActionsEnabled: boolean;
+  datasetDetailsActions: any[];
+  datasetSelectionActionsEnabled: boolean;
+  datasetSelectionActions: any[];
   editDatasetEnabled: boolean;
   editDatasetSampleEnabled: boolean;
   editMetadataEnabled: boolean;

src/app/app-routing/redirecting.component.ts

@@ -42,5 +42,6 @@ import { Component } from "@angular/core";
       }
     `,
   ],
+  standalone: false,
 })
 export class RedirectingComponent {}

src/app/datasets/batch-view/batch-view.component.html

@@ -1,93 +1,17 @@
 <div style="margin-top: 1em">
   <div *ngIf="hasBatch; else empty_batch">
-    <div style="text-align: right; margin-bottom: 1em">
-      <div *ngIf="editingPublishedDataDoi">
-        You are currently editing
-        <a (click)="onCancelEdit()">{{ editingPublishedDataDoi }}</a>
-        dataset list.
-      </div>
-      <button
-        *ngIf="editingPublishedDataDoi"
-        mat-button
-        id="changeSelectionButton"
-        (click)="onChangeSelection()"
-        class="button"
-        color="primary"
-      >
-        <mat-icon> edit </mat-icon>
-        Select new datasets
-      </button>
-      <button
-        *ngIf="editingPublishedDataDoi"
-        mat-button
-        id="saveChangesButton"
-        (click)="onSaveChanges()"
-        class="button"
-        color="primary"
-      >
-        <mat-icon> save </mat-icon>
-        Save Changes
-      </button>
-      <button
-        *ngIf="editingPublishedDataDoi"
-        mat-button
-        id="cancelButton"
-        (click)="onCancelEdit()"
-        class="button"
-        color="warn"
-      >
-        <mat-icon> close </mat-icon>
-        Cancel
-      </button>
-      <button
-        *ngIf="!editingPublishedDataDoi"
-        (click)="onEmpty()"
-        mat-button
-        class="button"
-        color="primary"
-      >
+    <div class="batch-actions" fxLayout="row" fxLayoutAlign="end center">
+<!--
+      <configurable-actions
+        [actionsConfig]="appConfig.datasetSelectionActions"
+        [actionItems]="datasetList"
+        [visible]="appConfig.datasetSelectionActionsEnabled"
+      ></configurable-actions>
+-->
+      <button (click)="onEmpty()" mat-button class="button" color="primary">
         <mat-icon> remove_shopping_cart </mat-icon>
         Empty Cart
       </button>
-      <button
-        *ngIf="!editingPublishedDataDoi"
-        mat-button
-        id="publishButton"
-        (click)="onPublish()"
-        class="button"
-        color="primary"
-      >
-        <mat-icon> school </mat-icon>
-        Publish
-      </button>
-      <ng-container *ngIf="shareEnabled">
-        <button
-          *ngIf="!editingPublishedDataDoi"
-          mat-button
-          (click)="onShare()"
-          id="shareButton"
-          class="button"
-          color="primary"
-        >
-          <mat-icon> share </mat-icon>
-          Share
-        </button>
-      </ng-container>
-      <ng-container *ngIf="appConfig.archiveWorkflowEnabled">
-        <button mat-button (click)="onArchive()" class="button" color="primary">
-          <mat-icon> archive </mat-icon>
-          Archive
-        </button>
-        <button
-          mat-button
-          (click)="onRetrieve()"
-          class="button"
-          color="primary"
-        >
-          <mat-icon> cloud_download </mat-icon>
-          Retrieve
-        </button>
-      </ng-container>
     </div>
 
     <mat-table

src/app/datasets/batch-view/batch-view.component.ts

@@ -14,7 +14,7 @@ import { Message, MessageType } from "state-management/models";
 import { showMessageAction } from "state-management/actions/user.actions";
 import { DialogComponent } from "shared/modules/dialog/dialog.component";
 
-import { Router } from "@angular/router";
+import { ActivatedRoute, Router } from "@angular/router";
 import { ArchivingService } from "../archiving.service";
 import { Observable, Subscription, combineLatest } from "rxjs";
 import { MatDialog } from "@angular/material/dialog";
@@ -39,6 +39,7 @@ export class BatchViewComponent implements OnInit, OnDestroy {
   );
   userProfile$ = this.store.select(selectProfile);
   isAdmin$ = this.store.select(selectIsAdmin);
+  params$ = this.route.queryParams;
   isAdmin = false;
   userProfile: any = {};
   subscriptions: Subscription[] = [];
@@ -57,6 +58,7 @@ export class BatchViewComponent implements OnInit, OnDestroy {
     private store: Store,
     private archivingSrv: ArchivingService,
     private router: Router,
+    private route: ActivatedRoute,
   ) {}
 
   private clearBatch() {
@@ -83,6 +85,13 @@ export class BatchViewComponent implements OnInit, OnDestroy {
     this.router.navigate(["datasets", "selection", "publish"]);
   }
 
+  onShareClick() {
+    this.router.navigate([], {
+      queryParams: { share: "true" },
+      queryParamsHandling: "merge",
+    });
+  }
+
   onShare() {
     const shouldHaveInfoMessage =
       !this.isAdmin &&
@@ -157,6 +166,11 @@ export class BatchViewComponent implements OnInit, OnDestroy {
         );
         this.store.dispatch(showMessageAction({ message }));
       }
+
+      this.router.navigate([], {
+        queryParams: { share: null },
+        queryParamsHandling: "merge",
+      });
     });
   }
 
@@ -208,6 +222,11 @@ export class BatchViewComponent implements OnInit, OnDestroy {
             ),
         );
       }
+
+      this.router.navigate([], {
+        queryParams: { retrieve: null },
+        queryParamsHandling: "merge",
+      });
     });
   }
 
@@ -267,6 +286,17 @@ export class BatchViewComponent implements OnInit, OnDestroy {
         }
       }),
     );
+
+    this.subscriptions.push(
+      combineLatest([this.params$]).subscribe(([queryParams]) => {
+        if (queryParams["share"] === "true") {
+          this.onShare();
+        }
+        if (queryParams["retrieve"] === "true") {
+          this.onRetrieve();
+        }
+      }),
+    );
   }
 
   ngOnDestroy() {