From 7d93f386d725232ca3345f5be7ae63492596a6f5 Mon Sep 17 00:00:00 2001
From: davelopez <46503462+davelopez@users.noreply.github.com>
Date: Wed, 13 Jul 2022 13:05:12 +0200
Subject: [PATCH 1/5] Add href links to some history item actions

This will allow to right click and open the action in a new tab or window.
---
 .../History/Content/ContentItem.vue           | 33 +++++++++++++++----
 .../History/Content/ContentOptions.vue        |  7 ++--
 .../Content/Dataset/DatasetActions.vue        | 25 ++++++++++----
 .../Content/Dataset/DatasetDetails.vue        |  7 +++-
 4 files changed, 55 insertions(+), 17 deletions(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index 049f11f36ca..f8b4f8bc533 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -53,6 +53,7 @@
                     :is-history-item="isHistoryItem"
                     :is-visible="item.visible"
                     :state="state"
+                    :item-urls="itemUrls"
                     @delete="$emit('delete')"
                     @display="onDisplay"
                     @edit="onEdit"
@@ -81,6 +82,7 @@
                 v-if="expandDataset"
                 :dataset="item"
                 :show-highlight="isHistoryItem"
+                :item-urls="itemUrls"
                 @edit="onEdit"
                 @toggleHighlights="toggleHighlights" />
         </b-collapse>
@@ -99,9 +101,12 @@ import { JobStateSummary } from "./Collection/JobStateSummary";
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { faArrowCircleUp, faMinusCircle, faCheckCircle } from "@fortawesome/free-solid-svg-icons";
+import { getAppRoot } from "onload/loadConfig";
 
 library.add(faArrowCircleUp, faMinusCircle, faCheckCircle);
 
+const root = getAppRoot();
+
 export default {
     components: {
         CollectionDescription,
@@ -165,6 +170,25 @@ export default {
         tagsDisabled() {
             return !this.expandDataset || !this.isHistoryItem;
         },
+        isCollection() {
+            return "collection_type" in this.item;
+        },
+        itemUrls() {
+            const id = this.item.id;
+            if (this.isCollection) {
+                return {
+                    edit: `${root}collection/edit/${id}`,
+                };
+            }
+            return {
+                display: `${root}datasets/${id}/display/?preview=True`,
+                edit: `${root}datasets/edit?dataset_id=${id}`,
+                showDetails: `${root}datasets/${id}/details`,
+                reportError: `${root}datasets/error?dataset_id=${id}`,
+                rerun: `${root}tool_runner/rerun?id=${id}`,
+                visualize: `visualizations?dataset_id=${id}`,
+            };
+        },
     },
     methods: {
         onClick() {
@@ -175,8 +199,7 @@ export default {
             }
         },
         onDisplay() {
-            const url = `datasets/${this.item.id}/display/?preview=True`;
-            iframeAdd({ path: url, title: this.name });
+            iframeAdd({ path: this.itemUrls.display, title: this.name });
         },
         onDragStart(evt) {
             evt.dataTransfer.dropEffect = "move";
@@ -184,11 +207,7 @@ export default {
             evt.dataTransfer.setData("text", JSON.stringify([this.item]));
         },
         onEdit() {
-            if (this.item.collection_type) {
-                backboneRoute(`collection/edit/${this.item.id}`);
-            } else {
-                backboneRoute("datasets/edit", { dataset_id: this.item.id });
-            }
+            backboneRoute(this.itemUrls.edit);
         },
         onTags(newTags) {
             this.$emit("tag-change", this.item, newTags);
diff --git a/client/src/components/History/Content/ContentOptions.vue b/client/src/components/History/Content/ContentOptions.vue
index b24d51f1dc7..0e25a4eb405 100644
--- a/client/src/components/History/Content/ContentOptions.vue
+++ b/client/src/components/History/Content/ContentOptions.vue
@@ -7,7 +7,8 @@
             class="px-1"
             size="sm"
             variant="link"
-            @click.stop="$emit('display')">
+            :href="itemUrls.display"
+            @click.prevent.stop="$emit('display')">
             <icon icon="eye" />
         </b-button>
         <b-button
@@ -17,7 +18,8 @@
             class="px-1"
             size="sm"
             variant="link"
-            @click.stop="$emit('edit')">
+            :href="itemUrls.edit"
+            @click.prevent.stop="$emit('edit')">
             <icon icon="pen" />
         </b-button>
         <b-button
@@ -58,6 +60,7 @@ export default {
         isHistoryItem: { type: Boolean, required: true },
         isVisible: { type: Boolean, default: true },
         state: { type: String, default: "" },
+        itemUrls: { type: Object, required: true },
     },
     computed: {
         displayButtonTitle() {
diff --git a/client/src/components/History/Content/Dataset/DatasetActions.vue b/client/src/components/History/Content/Dataset/DatasetActions.vue
index bf63ed233a8..a140fae183f 100644
--- a/client/src/components/History/Content/Dataset/DatasetActions.vue
+++ b/client/src/components/History/Content/Dataset/DatasetActions.vue
@@ -2,7 +2,14 @@
     <div class="dataset-actions mb-1">
         <div class="clearfix">
             <div class="btn-group float-left">
-                <b-button v-if="showError" class="px-1" title="Error" size="sm" variant="link" @click.stop="onError">
+                <b-button
+                    v-if="showError"
+                    class="px-1"
+                    title="Error"
+                    size="sm"
+                    variant="link"
+                    :href="itemUrls.reportError"
+                    @click.prevent.stop="onError">
                     <span class="fa fa-bug" />
                 </b-button>
                 <dataset-download v-if="showDownloads" :item="item" @on-download="onDownload" />
@@ -21,7 +28,8 @@
                     title="Dataset Details"
                     size="sm"
                     variant="link"
-                    @click.stop="onInfo">
+                    :href="itemUrls.showDetails"
+                    @click.prevent.stop="onInfo">
                     <span class="fa fa-info-circle" />
                 </b-button>
                 <b-button
@@ -30,7 +38,8 @@
                     title="Run Job Again"
                     size="sm"
                     variant="link"
-                    @click.stop="onRerun">
+                    :href="itemUrls.rerun"
+                    @click.prevent.stop="onRerun">
                     <span class="fa fa-redo" />
                 </b-button>
                 <b-button
@@ -39,7 +48,8 @@
                     title="Visualize"
                     size="sm"
                     variant="link"
-                    @click.stop="onVisualize">
+                    :href="itemUrls.visualize"
+                    @click.prevent.stop="onVisualize">
                     <span class="fa fa-bar-chart-o" />
                 </b-button>
                 <b-button
@@ -74,6 +84,7 @@ export default {
     props: {
         item: { type: Object, required: true },
         showHighlight: { type: Boolean, default: false },
+        itemUrls: { type: Object, required: true },
     },
     computed: {
         showDownloads() {
@@ -107,10 +118,10 @@ export default {
             window.location.href = resource;
         },
         onError() {
-            this.backboneRoute("datasets/error", { dataset_id: this.item.id });
+            this.backboneRoute(this.itemUrls.reportError);
         },
         onInfo() {
-            this.backboneRoute(`datasets/${this.item.id}/details`);
+            this.backboneRoute(this.itemUrls.showDetails);
         },
         onRerun() {
             this.backboneRoute(`root?job_id=${this.item.creating_job}`);
@@ -118,7 +129,7 @@ export default {
         onVisualize() {
             const name = this.item.name || "";
             const title = `Visualization of ${name}`;
-            const path = `visualizations?dataset_id=${this.item.id}`;
+            const path = this.itemUrls.visualize;
             const redirectParams = {
                 path: path,
                 title: title,
diff --git a/client/src/components/History/Content/Dataset/DatasetDetails.vue b/client/src/components/History/Content/Dataset/DatasetDetails.vue
index ebb632d7290..5e67cc59a35 100644
--- a/client/src/components/History/Content/Dataset/DatasetDetails.vue
+++ b/client/src/components/History/Content/Dataset/DatasetDetails.vue
@@ -21,7 +21,11 @@
                         <span class="value">{{ result.misc_info }}</span>
                     </div>
                 </div>
-                <DatasetActions :item="result" :show-highlight="showHighlight" @toggleHighlights="toggleHighlights" />
+                <DatasetActions
+                    :item="result"
+                    :show-highlight="showHighlight"
+                    :item-urls="itemUrls"
+                    @toggleHighlights="toggleHighlights" />
                 <pre v-if="result.peek" class="dataset-peek p-1" v-html="result.peek" />
             </div>
         </div>
@@ -94,6 +98,7 @@ export default {
     props: {
         dataset: { type: Object, required: true },
         showHighlight: { type: Boolean, default: false },
+        itemUrls: { type: Object, required: true },
     },
     computed: {
         stateText() {

From 1638dc0210c9a04d6cab9d5823694efa2377d95b Mon Sep 17 00:00:00 2001
From: davelopez <46503462+davelopez@users.noreply.github.com>
Date: Thu, 14 Jul 2022 11:41:20 +0200
Subject: [PATCH 2/5] Add HREF to dataset download

---
 .../History/Content/Dataset/DatasetDownload.vue        | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/client/src/components/History/Content/Dataset/DatasetDownload.vue b/client/src/components/History/Content/Dataset/DatasetDownload.vue
index b0288e1d69f..14455e47d8e 100644
--- a/client/src/components/History/Content/Dataset/DatasetDownload.vue
+++ b/client/src/components/History/Content/Dataset/DatasetDownload.vue
@@ -14,12 +14,15 @@
         <template v-slot:button-content>
             <span class="fa fa-save" />
         </template>
-        <b-dropdown-item v-localize @click.stop="onDownload(downloadUrl)"> Download Dataset </b-dropdown-item>
+        <b-dropdown-item v-localize :href="downloadUrl" @click.prevent.stop="onDownload(downloadUrl)">
+            Download Dataset
+        </b-dropdown-item>
         <b-dropdown-item
             v-for="(metaFile, index) of metaFiles"
             :key="index"
             :data-description="`download ${metaFile.file_type}`"
-            @click.stop="onDownload(metaDownloadUrl, metaFile.file_type)">
+            :href="metaDownloadUrl + metaFile.file_type"
+            @click.prevent.stop="onDownload(metaDownloadUrl, metaFile.file_type)">
             Download {{ metaFile.file_type }}
         </b-dropdown-item>
     </b-dropdown>
@@ -29,7 +32,8 @@
         title="Download"
         size="sm"
         variant="link"
-        @click.stop="onDownload(downloadUrl)">
+        :href="downloadUrl"
+        @click.prevent.stop="onDownload(downloadUrl)">
         <span class="fa fa-save" />
     </b-button>
 </template>

From 9feebb88cb4ad82aaf90d9b5b03b3925c00b8e5a Mon Sep 17 00:00:00 2001
From: davelopez <46503462+davelopez@users.noreply.github.com>
Date: Thu, 14 Jul 2022 12:54:58 +0200
Subject: [PATCH 3/5] Fix tours selectors

The buttons are now considered links so better use the class to select them since it will be less prone to change than the title.
---
 .../components/History/Content/ContentOptions.vue   | 10 +++++-----
 client/src/utils/navigation/navigation.yml          |  5 ++---
 config/plugins/tours/core.galaxy_ui.yaml            | 12 ++++++------
 config/plugins/tours/core.history.yaml              | 13 ++++++-------
 config/plugins/tours/core.windows.yaml              |  2 +-
 5 files changed, 20 insertions(+), 22 deletions(-)

diff --git a/client/src/components/History/Content/ContentOptions.vue b/client/src/components/History/Content/ContentOptions.vue
index 0e25a4eb405..52be3890cb9 100644
--- a/client/src/components/History/Content/ContentOptions.vue
+++ b/client/src/components/History/Content/ContentOptions.vue
@@ -4,7 +4,7 @@
             v-if="isDataset"
             :disabled="displayDisabled"
             :title="displayButtonTitle"
-            class="px-1"
+            class="display-btn px-1"
             size="sm"
             variant="link"
             :href="itemUrls.display"
@@ -15,7 +15,7 @@
             v-if="isHistoryItem"
             :disabled="editDisabled"
             :title="editButtonTitle"
-            class="px-1"
+            class="edit-btn px-1"
             size="sm"
             variant="link"
             :href="itemUrls.edit"
@@ -24,7 +24,7 @@
         </b-button>
         <b-button
             v-if="isHistoryItem && !isDeleted"
-            class="px-1"
+            class="delete-btn px-1"
             title="Delete"
             size="sm"
             variant="link"
@@ -33,7 +33,7 @@
         </b-button>
         <b-button
             v-if="isHistoryItem && isDeleted"
-            class="px-1"
+            class="undelete-btn px-1"
             title="Undelete"
             size="sm"
             variant="link"
@@ -42,7 +42,7 @@
         </b-button>
         <b-button
             v-if="isHistoryItem && !isVisible"
-            class="px-1"
+            class="unhide-btn px-1"
             title="Unhide"
             size="sm"
             variant="link"
diff --git a/client/src/utils/navigation/navigation.yml b/client/src/utils/navigation/navigation.yml
index 94f68cae284..6ac9c5d544f 100644
--- a/client/src/utils/navigation/navigation.yml
+++ b/client/src/utils/navigation/navigation.yml
@@ -287,9 +287,8 @@ history_panel:
     options_use_legacy_history: 'a[data-description="switch to legacy history view"]'
 
     collection_menu_button: '.collection-menu'
-    collection_menu_edit_attributes:
-      type: xpath
-      selector: '//button[@title="Edit attributes"]'
+    collection_menu_edit_attributes: '.edit-btn'
+
     new_history_button: '.history-new-button'
     multi_view_button: '.history-view-multi-button'
     histories_operation_menu: '[data-description="history options"]'
diff --git a/config/plugins/tours/core.galaxy_ui.yaml b/config/plugins/tours/core.galaxy_ui.yaml
index adcdf20176a..b1a1f8f5551 100644
--- a/config/plugins/tours/core.galaxy_ui.yaml
+++ b/config/plugins/tours/core.galaxy_ui.yaml
@@ -92,29 +92,29 @@ steps:
               grey this means you are queued and need to wait until your tool can be started. If your dataset turns into red, an error has occurred. Please report the bug to the Galaxy team with the bug report button."
 
     - title: "View dataset"
-      element: "#current-history-panel div.content-item button[title='Display']"
+      element: "#current-history-panel div.content-item .display-btn"
       intro: "View your dataset by clicking the eye button."
 
     - title: "Rename dataset"
-      element: "#current-history-panel div.content-item button[title='Edit attributes']"
+      element: "#current-history-panel div.content-item .edit-btn"
       intro: "Rename your dataset by clicking the pencil button."
 
     - title: "Dataset information"
       element: "div.content-item .content-title"
       intro: "This is your dataset. You can get more informations and options like different visualizations by clicking on it."
       postclick: true
-  
+
     - title: "Remove dataset"
-      element: "#current-history-panel div.content-item button[title='Delete']"
+      element: "#current-history-panel div.content-item .delete-btn"
       intro: "Delete your dataset by clicking the trash-button."
 
     - title: "Dataset information"
-      element: "#current-history-panel div.content-item button[title='Dataset Details']"
+      element: "#current-history-panel div.content-item .params-btn"
       intro: "Clicking on your dataset provides you with more information regarding your dataset (e.g. filetype or size)."
       preclick: true
 
     - title: "Re-run tool"
-      element: "#current-history-panel div.content-item button[title='Run Job Again']"
+      element: "#current-history-panel div.content-item .rerun-btn"
       intro: "By clicking the reload button, you can re-run your tool again (e.g. with different parameters or on another dataset)."
 
     - title: "Panel collapse"
diff --git a/config/plugins/tours/core.history.yaml b/config/plugins/tours/core.history.yaml
index aa52569fdd3..c29ce1c3c1a 100644
--- a/config/plugins/tours/core.history.yaml
+++ b/config/plugins/tours/core.history.yaml
@@ -47,26 +47,26 @@ steps:
       element: "#current-history-panel div.content-item span.datatype"
       intro: "Galaxy has assigned a datatype to your dataset during upload, which you can see here."
 
-    - element: "#current-history-panel div.content-item button[title='Download']"
+    - element: "#current-history-panel div.content-item .download-btn"
       title: "Download your dataset"
       intro: "You can download every dataset by using the floppy disc symbol."
 
-    - element: "#current-history-panel div.content-item button[title='Dataset Details']"
+    - element: "#current-history-panel div.content-item .params-btn"
       title: "Even more information"
       intro: "Get an overview of all metadata associated with your dataset by using the Information symbol."
       preclick: true
 
-    - element: "#current-history-panel div.content-item button[title='Display']"
+    - element: "#current-history-panel div.content-item .display-btn"
       title: "Inspect your data"
       intro: "The eye symbol can be used to look at your data."
       preclick: true
 
-    - element: "#current-history-panel div.content-item button[title='Edit attributes']"
+    - element: "#current-history-panel div.content-item .edit-btn"
       title: "Edit metadata"
       intro: "With the pencil button you can edit metadata attributes of your dataset, like the associated filetype or the dataset name."
       preclick: true
 
-    - element: "#current-history-panel div.content-item button[title='Delete']"
+    - element: "#current-history-panel div.content-item .delete-btn"
       title: "Remove datasets"
       intro: "You can remove a dataset from the history with the trash can symbol."
       postclick: true
@@ -76,7 +76,7 @@ steps:
       intro: "By default your history will hide all deleted datasets from you. You can visualize them by filtering."
       textinsert: "deleted:true"
 
-    - element: "#current-history-panel div.content-item button[title='Undelete']"
+    - element: "#current-history-panel div.content-item .undelete-btn"
       title: "Undeleting a dataset"
       intro: |
             Galaxy datasets are only marked as deleted and can be recovered by clicking this link.
@@ -95,4 +95,3 @@ steps:
 
     - title: "Enjoy your Galaxy Histories"
       intro: "Thanks for taking this tour! Happy research with Galaxy!"
-
diff --git a/config/plugins/tours/core.windows.yaml b/config/plugins/tours/core.windows.yaml
index f2a5b6ad19c..7d3268c10bd 100644
--- a/config/plugins/tours/core.windows.yaml
+++ b/config/plugins/tours/core.windows.yaml
@@ -54,7 +54,7 @@ steps:
     - element: "#right"
       intro: "This is your history. It contains all datasets you are currently working with including our uploaded table."
 
-    - element: "#current-history-panel div.content-item button[title='Display']"
+    - element: "#current-history-panel div.content-item .display-btn"
       intro: "Clicking the eye-icon usually displays a dataset in the center panel."
       postclick: true
 

From 23f190bd2400b49d7676055037eef0ecbea5fe86 Mon Sep 17 00:00:00 2001
From: davelopez <46503462+davelopez@users.noreply.github.com>
Date: Fri, 15 Jul 2022 13:18:38 +0200
Subject: [PATCH 4/5] Fix history item action URLs with prefix

Declare relative URLs only and then prefix the root when necessary.
---
 .../History/Content/ContentItem.vue           | 16 ++++++--------
 .../History/Content/ContentOptions.vue        | 11 ++++++++--
 .../Content/Dataset/DatasetActions.vue        | 22 ++++++++++++++-----
 3 files changed, 33 insertions(+), 16 deletions(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index f8b4f8bc533..ba7a9be6227 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -101,12 +101,9 @@ import { JobStateSummary } from "./Collection/JobStateSummary";
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { faArrowCircleUp, faMinusCircle, faCheckCircle } from "@fortawesome/free-solid-svg-icons";
-import { getAppRoot } from "onload/loadConfig";
 
 library.add(faArrowCircleUp, faMinusCircle, faCheckCircle);
 
-const root = getAppRoot();
-
 export default {
     components: {
         CollectionDescription,
@@ -173,19 +170,20 @@ export default {
         isCollection() {
             return "collection_type" in this.item;
         },
+        /** Relative URLs for history item actions */
         itemUrls() {
             const id = this.item.id;
             if (this.isCollection) {
                 return {
-                    edit: `${root}collection/edit/${id}`,
+                    edit: `collection/edit/${id}`,
                 };
             }
             return {
-                display: `${root}datasets/${id}/display/?preview=True`,
-                edit: `${root}datasets/edit?dataset_id=${id}`,
-                showDetails: `${root}datasets/${id}/details`,
-                reportError: `${root}datasets/error?dataset_id=${id}`,
-                rerun: `${root}tool_runner/rerun?id=${id}`,
+                display: `datasets/${id}/display/?preview=True`,
+                edit: `datasets/edit?dataset_id=${id}`,
+                showDetails: `datasets/${id}/details`,
+                reportError: `datasets/error?dataset_id=${id}`,
+                rerun: `tool_runner/rerun?id=${id}`,
                 visualize: `visualizations?dataset_id=${id}`,
             };
         },
diff --git a/client/src/components/History/Content/ContentOptions.vue b/client/src/components/History/Content/ContentOptions.vue
index 52be3890cb9..4c708261858 100644
--- a/client/src/components/History/Content/ContentOptions.vue
+++ b/client/src/components/History/Content/ContentOptions.vue
@@ -7,7 +7,7 @@
             class="display-btn px-1"
             size="sm"
             variant="link"
-            :href="itemUrls.display"
+            :href="displayUrl"
             @click.prevent.stop="$emit('display')">
             <icon icon="eye" />
         </b-button>
@@ -18,7 +18,7 @@
             class="edit-btn px-1"
             size="sm"
             variant="link"
-            :href="itemUrls.edit"
+            :href="editUrl"
             @click.prevent.stop="$emit('edit')">
             <icon icon="pen" />
         </b-button>
@@ -53,6 +53,7 @@
 </template>
 
 <script>
+import { prependPath } from "utils/redirect.js";
 export default {
     props: {
         isDataset: { type: Boolean, required: true },
@@ -81,6 +82,12 @@ export default {
         editDisabled() {
             return ["discarded", "new", "upload", "queued", "running", "waiting"].includes(this.state);
         },
+        displayUrl() {
+            return prependPath(this.itemUrls.display);
+        },
+        editUrl() {
+            return prependPath(this.itemUrls.edit);
+        },
     },
 };
 </script>
diff --git a/client/src/components/History/Content/Dataset/DatasetActions.vue b/client/src/components/History/Content/Dataset/DatasetActions.vue
index a140fae183f..95dd7f7f86c 100644
--- a/client/src/components/History/Content/Dataset/DatasetActions.vue
+++ b/client/src/components/History/Content/Dataset/DatasetActions.vue
@@ -8,7 +8,7 @@
                     title="Error"
                     size="sm"
                     variant="link"
-                    :href="itemUrls.reportError"
+                    :href="reportErrorUrl"
                     @click.prevent.stop="onError">
                     <span class="fa fa-bug" />
                 </b-button>
@@ -28,7 +28,7 @@
                     title="Dataset Details"
                     size="sm"
                     variant="link"
-                    :href="itemUrls.showDetails"
+                    :href="showDetailsUrl"
                     @click.prevent.stop="onInfo">
                     <span class="fa fa-info-circle" />
                 </b-button>
@@ -38,7 +38,7 @@
                     title="Run Job Again"
                     size="sm"
                     variant="link"
-                    :href="itemUrls.rerun"
+                    :href="rerunUrl"
                     @click.prevent.stop="onRerun">
                     <span class="fa fa-redo" />
                 </b-button>
@@ -48,7 +48,7 @@
                     title="Visualize"
                     size="sm"
                     variant="link"
-                    :href="itemUrls.visualize"
+                    :href="visualizeUrl"
                     @click.prevent.stop="onVisualize">
                     <span class="fa fa-bar-chart-o" />
                 </b-button>
@@ -72,7 +72,7 @@
 <script>
 import { legacyNavigationMixin } from "components/plugins/legacyNavigation";
 import { copy as sendToClipboard } from "utils/clipboard";
-import { absPath } from "utils/redirect";
+import { absPath, prependPath } from "utils/redirect.js";
 import { downloadUrlMixin } from "./mixins.js";
 import DatasetDownload from "./DatasetDownload";
 
@@ -108,6 +108,18 @@ export default {
             // TODO: Check hasViz, if visualizations are activated in the config
             return !this.item.purged && ["ok", "failed_metadata", "error"].includes(this.item.state);
         },
+        reportErrorUrl() {
+            return prependPath(this.itemUrls.reportError);
+        },
+        showDetailsUrl() {
+            return prependPath(this.itemUrls.showDetails);
+        },
+        rerunUrl() {
+            return prependPath(this.itemUrls.rerun);
+        },
+        visualizeUrl() {
+            return prependPath(this.itemUrls.visualize);
+        },
     },
     methods: {
         onCopyLink() {

From 95c2efb83be06055bf314610ede23979a5ee3aaf Mon Sep 17 00:00:00 2001
From: davelopez <46503462+davelopez@users.noreply.github.com>
Date: Fri, 15 Jul 2022 13:22:35 +0200
Subject: [PATCH 5/5] Fix prefix duplication in `absPath` function

Also enhance code documentation a bit
---
 client/src/utils/redirect.js | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/client/src/utils/redirect.js b/client/src/utils/redirect.js
index a5dd4adcc18..92bd34d39c4 100644
--- a/client/src/utils/redirect.js
+++ b/client/src/utils/redirect.js
@@ -10,15 +10,33 @@ export function reloadPage() {
     window.location.reload();
 }
 
-// Prepends configured appRoot to given url
 const slashCleanup = /(\/)+/g;
+/**
+ * Prepends the configured app root to given url
+ * @param {String} path
+ * @returns The relative URL path with the configured appRoot.
+ */
 export function prependPath(path) {
     const root = getAppRoot();
     return `${root}/${path}`.replace(slashCleanup, "/");
 }
 
+/**
+ * Returns the absolute URL path for this server given a relative path.
+ * @param {String} path
+ * @returns The absolute URL path.
+ */
 export function absPath(path) {
-    const relativePath = prependPath(path);
+    const relativePath = hasRoot(path) ? path : prependPath(path);
     const server = window.location.origin;
     return `${server}/${relativePath}`.replace(slashCleanup, "/");
 }
+
+/**
+ * Checks if the path already has the app root.
+ * @param {String} path
+ * @returns true if the given path starts with the app root.
+ */
+function hasRoot(path) {
+    return path.startsWith(getAppRoot());
+}