From edfa43fee2e43b039823bb75ef6192caa4a160c8 Mon Sep 17 00:00:00 2001
From: Matt Blenkinsop <matt.blenkinsop@openfifth.co.uk>
Date: Wed, 9 Apr 2025 15:32:50 +0100
Subject: [PATCH] Bug 38201: Extend additional toolbar buttons

Signed-off-by: Michaela Sieber <michaela.sieber@kit.edu>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
---
 .../prog/js/vue/components/BaseResource.vue   | 94 +++++++++++++------
 .../ERM/EHoldingsLocalTitleResource.vue       | 52 +++-------
 .../prog/js/vue/components/ResourceList.vue   |  3 +-
 .../prog/js/vue/components/ResourceShow.vue   |  3 +-
 .../prog/js/vue/components/Toolbar.vue        | 12 ++-
 5 files changed, 90 insertions(+), 74 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/BaseResource.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/BaseResource.vue
index 1d1e5b200d..99241dc8aa 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/BaseResource.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/BaseResource.vue
@@ -7,6 +7,15 @@
         }"
         @select-resource="$emit('select-resource', $event)"
     >
+        <template #toolbar="{ resource }">
+            <Toolbar
+                v-if="!embedded"
+                :buttons="toolbarButtons"
+                :component="'list'"
+                :resource="resource"
+                :i18n="i18n"
+            />
+        </template>
         <template #filters="{ table }">
             <ResourceListFilters
                 v-if="optionalResourceProps.resourceListFiltersRequired"
@@ -24,7 +33,16 @@
             ...passCommonProps(),
             ...optionalResourceProps,
         }"
-    />
+    >
+        <template #toolbar="{ resource }">
+            <Toolbar
+                :buttons="toolbarButtons"
+                :component="'show'"
+                :resource="resource"
+                :i18n="i18n"
+            />
+        </template>
+    </ResourceShow>
     <ResourceFormAdd
         v-if="['add', 'edit'].includes(routeAction)"
         v-bind="{
@@ -43,6 +61,7 @@ import ResourceListFilters from "./ResourceListFilters.vue";
 import ResourceShow from "./ResourceShow.vue";
 import ResourceFormAdd from "./ResourceFormAdd.vue";
 import ResourceList from "./ResourceList.vue";
+import Toolbar from "./Toolbar.vue";
 
 export default {
     components: {
@@ -50,6 +69,7 @@ export default {
         ResourceShow,
         ResourceFormAdd,
         ResourceList,
+        Toolbar,
     },
     setup(props) {
         const { setConfirmationDialog, setMessage, setError, setWarning } =
@@ -115,7 +135,6 @@ export default {
                 getResourceShowURL: this.getResourceShowURL,
                 hasAdditionalFields: this.hasAdditionalFields,
                 getFieldGroupings: this.getFieldGroupings,
-                getToolbarButtons: this.getToolbarButtons,
                 resourceAttrs: this.resourceAttrs,
                 listComponent: this.listComponent,
                 resourceNamePlural: this.resourceNamePlural,
@@ -356,33 +375,39 @@ export default {
          *
          * @return {Object} keys must be "list", "show" or "edit", values are functions.
          */
-        getToolbarButtons() {
+        defaultToolbarButtons(resource, i18n) {
             return {
-                list: () => {
-                    return [
-                        {
-                            action: "add",
-                            onClick: () => this.goToResourceAdd(),
-                            title: __("New %s").format(
-                                this.i18n.displayNameLowerCase
-                            ),
-                        },
-                    ];
-                },
-                show: resource => {
-                    return [
-                        {
-                            action: "edit",
-                            onClick: () => this.goToResourceEdit(resource),
-                            title: __("Edit"),
-                        },
-                        {
-                            action: "delete",
-                            onClick: () => this.doResourceDelete(resource),
-                            title: __("Delete"),
-                        },
-                    ];
-                },
+                list: [
+                    {
+                        action: "add",
+                        onClick: () => this.goToResourceAdd(),
+                        title: i18n.newLabel,
+                    },
+                ],
+                show: [
+                    {
+                        action: "edit",
+                        onClick: () => this.goToResourceEdit(resource),
+                        title: __("Edit"),
+                    },
+                    {
+                        action: "delete",
+                        onClick: () => this.doResourceDelete(resource),
+                        title: __("Delete"),
+                    },
+                ],
+            };
+        },
+        /**
+         * Returns a default empty set of additional buttons
+         * Additional buttons should be added in the resource specific component
+         *
+         * @returns {Object}
+         */
+        additionalToolbarButtons() {
+            return {
+                list: [],
+                show: [],
             };
         },
         /**
@@ -532,6 +557,19 @@ export default {
                 return this.resourceName + "s";
             return this.resourceName;
         },
+        toolbarButtons() {
+            const defaultToolbarButtons = this.defaultToolbarButtons;
+            const additionalToolbarButtons = this.additionalToolbarButtons;
+
+            return (resource, component, i18n) => {
+                const defaultButtons = defaultToolbarButtons(resource, i18n);
+                const additionalButtons = additionalToolbarButtons(resource);
+                return [
+                    ...(defaultButtons[component] || []),
+                    ...(additionalButtons[component] || []),
+                ];
+            };
+        },
     },
     created() {
         if (this.resourceAttrs) {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitleResource.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitleResource.vue
index 6019e0f3cf..7581af8dbc 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitleResource.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitleResource.vue
@@ -17,44 +17,20 @@ export default {
         const vendorStore = inject("vendorStore");
         const { vendors } = storeToRefs(vendorStore);
 
-        function getToolbarButtons() {
+        function additionalToolbarButtons() {
             return {
-                list: () => {
-                    return [
-                        {
-                            action: "add",
-                            onClick: () => this.goToResourceAdd(),
-                            title: __("New %s").format(
-                                this.i18n.displayNameLowerCase
-                            ),
-                        },
-                        {
-                            to: { name: "EHoldingsLocalTitlesFormImport" },
-                            icon: "plus",
-                            title: __("Import from list"),
-                        },
-                        {
-                            to: { name: "EHoldingsLocalTitlesKBARTImport" },
-                            icon: "plus",
-                            title: __("Import from KBART file"),
-                        },
-                    ];
-                },
-
-                show: resource => {
-                    return [
-                        {
-                            action: "edit",
-                            onClick: () => this.goToResourceEdit(resource),
-                            title: __("Edit"),
-                        },
-                        {
-                            action: "delete",
-                            onClick: () => this.doResourceDelete(resource),
-                            title: __("Delete"),
-                        },
-                    ];
-                },
+                list: [
+                    {
+                        to: { name: "EHoldingsLocalTitlesFormImport" },
+                        icon: "plus",
+                        title: __("Import from list"),
+                    },
+                    {
+                        to: { name: "EHoldingsLocalTitlesKBARTImport" },
+                        icon: "plus",
+                        title: __("Import from KBART file"),
+                    },
+                ],
             };
         }
 
@@ -84,7 +60,7 @@ export default {
                 av_title_publication_types,
                 eholdings_titles_table_settings,
                 vendors,
-                getToolbarButtons,
+                additionalToolbarButtons,
             }),
         };
     },
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceList.vue
index 96984867eb..463cdcacc7 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceList.vue
@@ -1,8 +1,7 @@
 <template>
     <div v-if="!initialized">{{ $__("Loading") }}</div>
     <div v-else :id="`${resourceNamePlural}_list`">
-        <Toolbar v-if="!embedded" :buttons="getToolbarButtons().list()">
-        </Toolbar>
+        <slot name="toolbar" />
         <template v-if="resourceCount > 0">
             <slot name="filters" :table="table" />
         </template>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceShow.vue
index 860dc036f2..c032cc5394 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ResourceShow.vue
@@ -1,8 +1,7 @@
 <template>
     <div v-if="!initialized">{{ $__("Loading") }}</div>
     <div v-else :id="`${resourceNamePlural}_show`">
-        <Toolbar :buttons="getToolbarButtons().show(resource)"></Toolbar>
-
+        <slot name="toolbar" :resource="{ resource }" />
         <h2>
             {{ i18n.displayName + " #" + resource[idAttr] }}
         </h2>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Toolbar.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Toolbar.vue
index cd414e7dc3..7d4aedc426 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Toolbar.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Toolbar.vue
@@ -4,7 +4,10 @@
         :class="sticky ? 'btn-toolbar sticky' : 'btn-toolbar'"
         ref="toolbar"
     >
-        <template v-for="(button, i) in buttons">
+        <template
+            :key="`toolbar-button-${i}`"
+            v-for="(button, i) in buttons(resource, component, i18n)"
+        >
             <ToolbarButton
                 :action="button.action"
                 @click="button.onClick"
@@ -20,9 +23,10 @@
 import ToolbarButton from "./ToolbarButton.vue";
 export default {
     props: {
-        buttons: {
-            type: Array,
-        },
+        buttons: Function,
+        component: String,
+        resource: Object,
+        i18n: Object,
     },
     components: { ToolbarButton },
     name: "Toolbar",