[6.x] Append to Bard Entry links

resources/js/components/fieldtypes/bard/LinkToolbar.vue

@@ -80,6 +80,15 @@
         <ui-separator :text="__('Advanced Options')" />
 
         <section class="space-y-5">
+            <!-- Append attribute -->
+            <ui-input
+                v-if="linkType === 'entry'"
+                type="text"
+                v-model="appends"
+                :prepend="__('Append')"
+                :placeholder="__('?query=params#anchor')"
+            />
+
             <!-- Title attribute -->
             <ui-input
                 type="text"
@@ -196,6 +205,7 @@ export default {
             url: {},
             urlData: {},
             itemData: {},
+            appends: null,
             title: null,
             rel: null,
             targetBlank: false,
@@ -237,6 +247,13 @@ export default {
             return this.sanitizeLink(this.url[this.linkType]);
         },
 
+        normalizedAppends() {
+            const value = this.appends;
+            if (!value) return '';
+            if (value.startsWith('?') || value.startsWith('#')) return value;
+            return value.includes('=') ? `?${value}` : `#${value}`;
+        },
+
         defaultRel() {
             let rel = [];
             if (this.config.link_noopener) rel.push('noopener');
@@ -307,7 +324,11 @@ export default {
     },
 
     watch: {
-        linkType() {
+        linkType(type) {
+            if (type != 'entry') {
+                this.appends = null;
+            }
+
             this.autofocus();
         },
 
@@ -349,8 +370,8 @@ export default {
     methods: {
         applyAttrs(attrs) {
             this.linkType = this.getLinkTypeForUrl(attrs.href);
-
-            this.url = { [this.linkType]: attrs.href };
+            this.appends = this.getAppendsForUrl(attrs.href);
+            this.url = { [this.linkType]: this.appends ? attrs.href?.replace(this.appends, '') : attrs.href };
             this.urlData = { [this.linkType]: this.getUrlDataForUrl(attrs.href) };
             this.itemData = { [this.linkType]: this.getItemDataForUrl(attrs.href) };
 
@@ -393,7 +414,7 @@ export default {
             }
 
             this.$emit('updated', {
-                href: this.href,
+                href: this.href + this.normalizedAppends,
                 rel: this.rel,
                 target: this.canHaveTarget && this.targetBlank ? '_blank' : null,
                 title: this.title,
@@ -494,14 +515,24 @@ export default {
             return this.bard.meta.linkData[ref];
         },
 
+        getAppendsForUrl(urlString) {
+            // appends is only relevant to entry links
+            if (! urlString?.includes('statamic://entry::')) {
+                return null;
+            }
+
+            return urlString.replace(urlString.split(/[?#]/)[0], '') || null;
+        },
+
         parseDataUrl(url) {
             if (!url) {
                 return {};
             }
 
+            const appends = this.getAppendsForUrl(url);
             const regex = /^statamic:\/\/((.*?)::(.*))$/;
 
-            const matches = url.match(regex);
+            const matches = (appends ? url.replace(appends, '') : url).match(regex);
             if (!matches) {
                 return {};
             }

src/Fieldtypes/Bard.php

@@ -788,7 +788,7 @@ private function extractLinkDataFromNode($node)
 
     private function getLinkDataForUrl($url)
     {
-        $ref = Str::after($url, 'statamic://');
+        $ref = str($url)->after('statamic://')->before('?')->before('#')->toString();
         [$type, $id] = explode('::', $ref, 2);
 
         $data = null;

src/Fieldtypes/Bard/LinkMark.php

@@ -62,19 +62,21 @@ protected function convertHref($href)
             return $href;
         }
 
-        $ref = Str::after($href, 'statamic://');
+        $ref = str($href)->after('statamic://')->before('?')->before('#')->toString();
 
         if (! $item = Data::find($ref)) {
             return '';
         }
 
         $selectAcrossSites = Augmentor::$currentBardConfig['select_across_sites'] ?? false;
 
+        $extras = Str::after($href, $ref);
+
         if (! $selectAcrossSites && ! $this->isApi() && $item instanceof Entry) {
-            return ($item->in(Site::current()->handle()) ?? $item)->url();
+            return ($item->in(Site::current()->handle()) ?? $item)->url().$extras;
         }
 
-        return $selectAcrossSites ? $item->absoluteUrl() : $item->url();
+        return $selectAcrossSites ? $item->absoluteUrl().$extras : $item->url().$extras;
     }
 
     private function isApi()

tests/Fieldtypes/BardTest.php

@@ -1351,6 +1351,116 @@ public function it_doesnt_localize_when_select_across_sites_setting_is_enabled()
         $this->assertEquals('<a href="http://localhost/fr/blog/one-fr">The One</a>', $augmented);
     }
 
+    #[Test]
+    public function it_preserves_query_params_on_entry_links()
+    {
+        tap(Facades\Collection::make('blog')->routes('blog/{slug}'))->save();
+        EntryFactory::collection('blog')->id('123')->slug('my-post')->data(['title' => 'My Post'])->create();
+
+        $field = (new Bard)->setField(new Field('test', ['type' => 'bard']));
+
+        $augmented = $field->augment([
+            ['type' => 'text', 'marks' => [['type' => 'link', 'attrs' => ['href' => 'statamic://entry::123?foo=bar']]], 'text' => 'Link'],
+        ]);
+
+        $this->assertEquals('<a href="/blog/my-post?foo=bar">Link</a>', $augmented);
+    }
+
+    #[Test]
+    public function it_preserves_anchors_on_entry_links()
+    {
+        tap(Facades\Collection::make('blog')->routes('blog/{slug}'))->save();
+        EntryFactory::collection('blog')->id('123')->slug('my-post')->data(['title' => 'My Post'])->create();
+
+        $field = (new Bard)->setField(new Field('test', ['type' => 'bard']));
+
+        $augmented = $field->augment([
+            ['type' => 'text', 'marks' => [['type' => 'link', 'attrs' => ['href' => 'statamic://entry::123#section']]], 'text' => 'Link'],
+        ]);
+
+        $this->assertEquals('<a href="/blog/my-post#section">Link</a>', $augmented);
+    }
+
+    #[Test]
+    public function it_preserves_query_params_and_anchors_on_entry_links()
+    {
+        tap(Facades\Collection::make('blog')->routes('blog/{slug}'))->save();
+        EntryFactory::collection('blog')->id('123')->slug('my-post')->data(['title' => 'My Post'])->create();
+
+        $field = (new Bard)->setField(new Field('test', ['type' => 'bard']));
+
+        $augmented = $field->augment([
+            ['type' => 'text', 'marks' => [['type' => 'link', 'attrs' => ['href' => 'statamic://entry::123?foo=bar#section']]], 'text' => 'Link'],
+        ]);
+
+        $this->assertEquals('<a href="/blog/my-post?foo=bar#section">Link</a>', $augmented);
+    }
+
+    #[Test]
+    public function it_preserves_appends_on_localized_entry_links()
+    {
+        $this->setSites([
+            'en' => ['url' => 'http://localhost/', 'locale' => 'en'],
+            'fr' => ['url' => 'http://localhost/fr/', 'locale' => 'fr'],
+        ]);
+
+        Facades\Site::setCurrent('fr');
+
+        tap(Facades\Collection::make('blog')->routes('blog/{slug}'))->sites(['en', 'fr'])->save();
+
+        EntryFactory::id('parent')->collection('blog')->slug('theparent')->id(123)->locale('en')->create();
+        EntryFactory::id('123-fr')->origin('123')->locale('fr')->collection('blog')->slug('one-fr')->data(['title' => 'Le One'])->create();
+
+        $field = (new Bard)->setField(new Field('test', array_merge(['type' => 'bard'], ['select_across_sites' => false])));
+
+        $augmented = $field->augment([
+            ['type' => 'text', 'marks' => [['type' => 'link', 'attrs' => ['href' => 'statamic://entry::123-fr?foo=bar#section']]], 'text' => 'The One'],
+        ]);
+
+        $this->assertEquals('<a href="/fr/blog/one-fr?foo=bar#section">The One</a>', $augmented);
+    }
+
+    #[Test]
+    public function it_preserves_appends_on_entry_links_with_select_across_sites()
+    {
+        $this->setSites([
+            'en' => ['url' => 'http://localhost/', 'locale' => 'en'],
+            'fr' => ['url' => 'http://localhost/fr/', 'locale' => 'fr'],
+        ]);
+
+        Facades\Site::setCurrent('en');
+
+        tap(Facades\Collection::make('blog')->routes('blog/{slug}'))->sites(['en', 'fr'])->save();
+
+        EntryFactory::id('parent')->collection('blog')->slug('theparent')->id(123)->locale('en')->create();
+        EntryFactory::id('123-fr')->origin('123')->locale('fr')->collection('blog')->slug('one-fr')->data(['title' => 'Le One'])->create();
+
+        $field = (new Bard)->setField(new Field('test', array_merge(['type' => 'bard'], ['select_across_sites' => true])));
+
+        $augmented = $field->augment([
+            ['type' => 'text', 'marks' => [['type' => 'link', 'attrs' => ['href' => 'statamic://entry::123-fr?foo=bar#section']]], 'text' => 'The One'],
+        ]);
+
+        $this->assertEquals('<a href="http://localhost/fr/blog/one-fr?foo=bar#section">The One</a>', $augmented);
+    }
+
+    #[Test]
+    public function it_gets_link_data_with_appends()
+    {
+        tap(Facades\Collection::make('pages')->routes('/{slug}'))->save();
+        EntryFactory::collection('pages')->id('1')->slug('about')->data(['title' => 'About'])->create();
+
+        $bard = $this->bard(['save_html' => true, 'sets' => null]);
+
+        $html = '<p><a href="statamic://entry::1?foo=bar#section">Link with appends</a></p>';
+
+        $prosemirror = (new Augmentor($this))->renderHtmlToProsemirror($html)['content'];
+
+        $this->assertEquals([
+            'entry::1' => ['title' => 'About', 'permalink' => 'http://localhost/about'],
+        ], $bard->getLinkData($prosemirror));
+    }
+
     private function bard($config = [])
     {
         return (new Bard)->setField(new Field('test', array_merge(['type' => 'bard', 'sets' => ['one' => []]], $config)));