From 4cbd480e55b48c2b4c70536e8c18011f830579ce Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 2 Oct 2024 15:45:26 -0500
Subject: [PATCH] replace `Edit` button with `Import` on
 `WorkflowInvocationHeader`

Fixes https://github.com/galaxyproject/galaxy/issues/18896
---
 .../WorkflowInvocationHeader.vue              | 47 ++++++++++++++++++-
 client/src/stores/workflowStore.ts            |  1 +
 2 files changed, 47 insertions(+), 1 deletion(-)

diff --git a/client/src/components/WorkflowInvocationState/WorkflowInvocationHeader.vue b/client/src/components/WorkflowInvocationState/WorkflowInvocationHeader.vue
index f01618d86582..97a6b5bc0c42 100644
--- a/client/src/components/WorkflowInvocationState/WorkflowInvocationHeader.vue
+++ b/client/src/components/WorkflowInvocationState/WorkflowInvocationHeader.vue
@@ -1,13 +1,21 @@
 <script setup lang="ts">
 import { faClock } from "@fortawesome/free-regular-svg-icons";
-import { faArrowLeft, faEdit, faHdd, faSitemap } from "@fortawesome/free-solid-svg-icons";
+import { faArrowLeft, faEdit, faHdd, faSitemap, faUpload } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BButton, BButtonGroup } from "bootstrap-vue";
+import { computed } from "vue";
 
 import type { WorkflowInvocationElementView } from "@/api/invocations";
+import { Toast } from "@/composables/toast";
 import { useWorkflowInstance } from "@/composables/useWorkflowInstance";
+import { getAppRoot } from "@/onload";
+import { useUserStore } from "@/stores/userStore";
 import localize from "@/utils/localization";
+import { errorMessageAsString } from "@/utils/simple-error";
 
+import { copyWorkflow } from "../Workflow/workflows.services";
+
+import AsyncButton from "../Common/AsyncButton.vue";
 import Heading from "../Common/Heading.vue";
 import SwitchToHistoryLink from "../History/SwitchToHistoryLink.vue";
 import UtcDate from "../UtcDate.vue";
@@ -23,6 +31,31 @@ const props = defineProps<Props>();
 
 const { workflow } = useWorkflowInstance(props.invocation.workflow_id);
 
+const userStore = useUserStore();
+const owned = computed(() => {
+    if (userStore.currentUser && workflow.value) {
+        return userStore.currentUser.username === workflow.value.owner;
+    } else {
+        return false;
+    }
+});
+
+async function onImport() {
+    if (!workflow.value || !workflow.value.owner) {
+        return;
+    }
+    try {
+        await copyWorkflow(workflow.value.id, workflow.value.owner);
+        Toast.success(
+            localize("Click here to view the imported workflow in the workflows list"),
+            localize("Workflow imported successfully"),
+            `${getAppRoot()}workflows/list`
+        );
+    } catch (error) {
+        Toast.error(errorMessageAsString(error), localize("Failed to import workflow"));
+    }
+}
+
 function getWorkflowName(): string {
     return workflow.value?.name || "...";
 }
@@ -69,6 +102,7 @@ function getWorkflowName(): string {
                 </div>
                 <BButtonGroup vertical>
                     <BButton
+                        v-if="owned"
                         v-b-tooltip.hover.noninteractive.html
                         :title="
                             !workflow.deleted
@@ -82,6 +116,17 @@ function getWorkflowName(): string {
                         <FontAwesomeIcon :icon="faEdit" />
                         <span v-localize>Edit</span>
                     </BButton>
+                    <AsyncButton
+                        v-else
+                        v-b-tooltip.hover.noninteractive
+                        size="sm"
+                        :disabled="userStore.isAnonymous"
+                        :title="localize('Import this workflow')"
+                        :icon="faUpload"
+                        variant="outline-primary"
+                        :action="onImport">
+                        <span v-localize>Import</span>
+                    </AsyncButton>
                     <WorkflowRunButton
                         :id="workflow.id || ''"
                         :title="
diff --git a/client/src/stores/workflowStore.ts b/client/src/stores/workflowStore.ts
index 2cd194a093c1..604acaabc9a5 100644
--- a/client/src/stores/workflowStore.ts
+++ b/client/src/stores/workflowStore.ts
@@ -13,6 +13,7 @@ export interface Workflow {
     latest_id?: string;
     version: number;
     deleted?: boolean;
+    owner?: string;
 }
 
 export const useWorkflowStore = defineStore("workflowStore", () => {