From c9173a873940b9f5e5be467fbdda2751d137a48a Mon Sep 17 00:00:00 2001
From: Maurice Hildebrandt <hello@mauricehildebrandt.ch>
Date: Tue, 10 Aug 2021 14:33:18 +0200
Subject: [PATCH 1/6] Show custom Bard buttons in blueprint editor

Custom buttons, that have been added to bard using

  Statamic.$bard.buttons( ... )

will now be shown in the Blueprint editor, to enable or
disable them for a specific field.
---
 .../bard/BardButtonsSettingFieldtype.vue       | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue b/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
index 79b19e852c3..89f6bbe3893 100644
--- a/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
+++ b/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
@@ -58,7 +58,23 @@ export default {
     methods: {
 
         initButtons() {
-            let available = addButtonHtml(availableButtons());
+            // Get all default buttons first
+            let available = availableButtons();
+
+            // Add custom buttons from a project or addon
+            this.$bard.buttonCallbacks.map(callback => {
+                let returned = callback(available);
+
+                // No return value means they intend to manipulate the
+                // buttons object manually. Just continue on.
+                if (!returned) return;
+
+                available = available.concat(
+                    Array.isArray(returned) ? returned : [returned]
+                );
+            })
+
+            available = addButtonHtml(available);
 
             let buttons = available.map(button => {
                 button.enabled = this.data.includes(button.name);

From 2c42bc52558ef3d01d798a7626a71b139e0bcfff Mon Sep 17 00:00:00 2001
From: Maurice Hildebrandt <hello@mauricehildebrandt.ch>
Date: Tue, 10 Aug 2021 14:50:37 +0200
Subject: [PATCH 2/6] Make bard hide custom buttons that have not been selected

Custom buttons that have not been selected in the blueprint editor
to be available for that field will now get hidden. However, this will
only happen if you return an array of button in the $bard.buttons callback
and not if you manipulate the buttons array directly.

The Statamic.$bard.buttons callback handler receives a new property `selectedButtons`.
This array of strings contains the selected buttons of the current field. The argument
will be undefined when being called from the blueprint editor, so that you can
distinguish whether you should add a button or not.

Example:

Statamic.$bard.buttons((buttons, selectedButtons) => {
    if (!selectedButtons || selectedButtons.includes('lead')) {
        buttons.push({
            name: 'lead',
            text: 'Lead Text',
            command: 'lead',
            icon: 'lead',
            component: LeadButton,
        });
    }
});

However, if you simply return an array of buttons bard will take care of the visible
state itself. This is meant for backwards compatibility reasons.
---
 .../components/fieldtypes/bard/BardFieldtype.vue   | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/resources/js/components/fieldtypes/bard/BardFieldtype.vue b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
index cdcbd01da2d..199440c819d 100644
--- a/resources/js/components/fieldtypes/bard/BardFieldtype.vue
+++ b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
@@ -1,6 +1,6 @@
 <template>
 
-    <div 
+    <div
         class="bard-fieldtype-wrapper"
         :class="{'bard-fullscreen': fullScreenMode }"
         @dragstart.stop="ignorePageHeader(true)"
@@ -394,13 +394,17 @@ export default {
 
             // Get the configured buttons and swap them with corresponding objects
             let buttons = selectedButtons.map(button => {
-                return _.findWhere(availableButtons(), { name: button.toLowerCase() })
-                    || button;
+                return _.findWhere(availableButtons(), { name: button.toLowerCase() }) || button;
             });
 
             // Let addons add, remove, or control the position of buttons.
             this.$bard.buttonCallbacks.forEach(callback => {
-                let returned = callback(buttons);
+                // Let's pass two variables to the callback:
+                // buttons: Can be used to manipulate the array per reference. The callback can also simply return
+                //          a single or an array of buttons.
+                // selectedButtons: An array of strings of the buttons that have been selected to be available in this
+                //                  specific field.
+                const returned = callback(buttons, selectedButtons);
 
                 // No return value means they intend to manipulate the
                 // buttons object manually. Just continue on.
@@ -408,7 +412,7 @@ export default {
 
                 buttons = buttons.concat(
                     Array.isArray(returned) ? returned : [returned]
-                );
+                ).filter(button => selectedButtons.includes(button.name));
             });
 
             // Remove any non-objects. This would happen if you configure a button name that doesn't exist.

From 1fcf733e905b49ee0928b2fdba5f5991827c3b0c Mon Sep 17 00:00:00 2001
From: Maurice Hildebrandt <hello@mauricehildebrandt.ch>
Date: Tue, 10 Aug 2021 14:58:28 +0200
Subject: [PATCH 3/6] Improve bard settings styling to support much more
 buttons

---
 resources/sass/components/fieldtypes/bard.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/sass/components/fieldtypes/bard.scss b/resources/sass/components/fieldtypes/bard.scss
index 6581f51f918..d1e6168ae2d 100644
--- a/resources/sass/components/fieldtypes/bard.scss
+++ b/resources/sass/components/fieldtypes/bard.scss
@@ -31,7 +31,7 @@
 }
 
 .bard-fixed-toolbar {
-    @apply .bg-white .shadow-none rounded-t .border-b .text-sm flex items-start justify-between;
+    @apply .bg-white .shadow-none rounded-t .border-b .text-sm flex flex-wrap items-start justify-start;
     position: sticky;
     padding: 4px 8px;
     z-index: 5;

From c225383feff2cfba5cbdce59b36d5d6bf7284e6d Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Wed, 24 Nov 2021 13:20:21 -0500
Subject: [PATCH 4/6] revert css change

---
 resources/sass/components/fieldtypes/bard.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/sass/components/fieldtypes/bard.scss b/resources/sass/components/fieldtypes/bard.scss
index 6aabcc5a48d..178eb9d17d1 100644
--- a/resources/sass/components/fieldtypes/bard.scss
+++ b/resources/sass/components/fieldtypes/bard.scss
@@ -31,7 +31,7 @@
 }
 
 .bard-fixed-toolbar {
-    @apply .bg-white .shadow-none rounded-t .border-b .text-sm flex flex-wrap items-start justify-start;
+    @apply .bg-white .shadow-none rounded-t .border-b .text-sm flex items-start justify-between;
     position: sticky;
     padding: 4px 8px;
     z-index: 5;

From a572e5991133d3a9306408c73d51ee6a29982806 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Wed, 24 Nov 2021 13:49:06 -0500
Subject: [PATCH 5/6] Implement in a more BC way

---
 .../bard/BardButtonsSettingFieldtype.vue      |  7 +++++-
 .../fieldtypes/bard/BardFieldtype.vue         | 23 ++++++++++---------
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue b/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
index 89f6bbe3893..53ccdacb996 100644
--- a/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
+++ b/resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue
@@ -63,7 +63,12 @@ export default {
 
             // Add custom buttons from a project or addon
             this.$bard.buttonCallbacks.map(callback => {
-                let returned = callback(available);
+                // Since the developer uses the same callback to add buttons to the field itself, and for the
+                // button configurator, we need to make the button conditional when on the Bard fieldtype,
+                // but not here. Here we want to just show them all, so the user is able to toggle it.
+                const buttonFn = (button) => button;
+
+                let returned = callback(available, buttonFn);
 
                 // No return value means they intend to manipulate the
                 // buttons object manually. Just continue on.
diff --git a/resources/js/components/fieldtypes/bard/BardFieldtype.vue b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
index 4a44b2fecbe..dc6812f8c3b 100644
--- a/resources/js/components/fieldtypes/bard/BardFieldtype.vue
+++ b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
@@ -401,20 +401,21 @@ export default {
 
             // Let addons add, remove, or control the position of buttons.
             this.$bard.buttonCallbacks.forEach(callback => {
-                // Let's pass two variables to the callback:
-                // buttons: Can be used to manipulate the array per reference. The callback can also simply return
-                //          a single or an array of buttons.
-                // selectedButtons: An array of strings of the buttons that have been selected to be available in this
-                //                  specific field.
-                const returned = callback(buttons, selectedButtons);
+                // Since the developer uses the same callback to add buttons to the field itself, and for the
+                // button configurator, we need to make the button conditional when on the Bard fieldtype
+                // but not in the button configurator. So here we'll filter it out if it's not selected.
+                const buttonFn = (button) => selectedButtons.includes(button.name) ? button : null;
 
-                // No return value means they intend to manipulate the
-                // buttons object manually. Just continue on.
-                if (! returned) return;
+                const addedButtons = callback(buttons, buttonFn);
+
+                // No return value means either they literally returned nothing, with the intention
+                // of manipulating the buttons object manually. Or, they used the button() and
+                // the button was not configured in the field so it was stripped out.
+                if (! addedButtons) return;
 
                 buttons = buttons.concat(
-                    Array.isArray(returned) ? returned : [returned]
-                ).filter(button => selectedButtons.includes(button.name));
+                    Array.isArray(addedButtons) ? addedButtons.filter(button => !!button) : [addedButtons]
+                );
             });
 
             // Remove any non-objects. This would happen if you configure a button name that doesn't exist.

From f1dfc112ec5a1c1fee60d83d6257dd81edaf2661 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Wed, 24 Nov 2021 14:12:40 -0500
Subject: [PATCH 6/6] Filter after, so if buttons are spliced into the buttons
 array manually and they return null, they'll get filtered out too

---
 resources/js/components/fieldtypes/bard/BardFieldtype.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/fieldtypes/bard/BardFieldtype.vue b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
index dc6812f8c3b..0c4020af13f 100644
--- a/resources/js/components/fieldtypes/bard/BardFieldtype.vue
+++ b/resources/js/components/fieldtypes/bard/BardFieldtype.vue
@@ -414,10 +414,13 @@ export default {
                 if (! addedButtons) return;
 
                 buttons = buttons.concat(
-                    Array.isArray(addedButtons) ? addedButtons.filter(button => !!button) : [addedButtons]
+                    Array.isArray(addedButtons) ? addedButtons : [addedButtons]
                 );
             });
 
+            // Remove any nulls. This could happen if a developer-added button was not specified in this field's buttons array.
+            buttons = buttons.filter(button => !!button);
+
             // Remove any non-objects. This would happen if you configure a button name that doesn't exist.
             buttons = buttons.filter(button => typeof button != 'string');