Use TeleportController to re-render slim header's buttons on results …

…refresh

Fixes wagtail#11726

CHANGELOG.txt

@@ -24,6 +24,7 @@ Changelog
  * Fix: Resolve issue with unwanted padding in chooser modal listings (Sage Abdullah)
  * Fix: Ensure form builder emails that have date or datetime fields correctly localize dates based on the configured `LANGUAGE_CODE` (Mark Niehues)
  * Fix: Ensure the Stimulus `UnsavedController` checks for nested removal/additions of inputs so that the unsaved warning shows in more valid cases when editing a page (Karthik Ayangar)
+ * Fix: Ensure `get_add_url()` is always used to re-render the add button when the listing is refreshed in viewsets (Sage Abdullah)
  * Docs: Add contributing development documentation on how to work with a fork of Wagtail (Nix Asteri, Dan Braghis)
  * Docs: Make sure the settings panel is listed in tabbed interface examples (Tibor Leupold)
  * Docs: Update content and page names to their US spelling instead of UK spelling (Victoria Poromon)

docs/releases/6.1.md

@@ -37,6 +37,7 @@ depth: 1
  * Resolve issue with unwanted padding in chooser modal listings (Sage Abdullah)
  * Ensure form builder emails that have date or datetime fields correctly localize dates based on the configured `LANGUAGE_CODE` (Mark Niehues)
  * Ensure the Stimulus `UnsavedController` checks for nested removal/additions of inputs so that the unsaved warning shows in more valid cases when editing a page (Karthik Ayangar)
+ * Ensure `get_add_url()` is always used to re-render the add button when the listing is refreshed in viewsets (Sage Abdullah)
 
 
 ### Documentation

wagtail/admin/templates/wagtailadmin/generic/index_results.html

@@ -12,6 +12,14 @@
         </template>
     {% endif %}
 
+    {% if render_buttons_fragment %}
+        <template data-controller="w-teleport" data-w-teleport-target-value="#w-slim-header-buttons" data-w-teleport-reset-value="true">
+            {% for button in header_buttons %}
+                {% component button %}
+            {% endfor %}
+        </template>
+    {% endif %}
+
     {% if is_searching and view.show_other_searches %}
         <div class="nice-padding">
             {% search_other %}

wagtail/admin/templates/wagtailadmin/shared/headers/slim_header.html

@@ -50,7 +50,7 @@ <h1 class="w-sr-only">
                         {% if actions or block_actions %}
                             {# Actions divider #}
                             <div class="w-w-px w-h-[30px] w-ml-auto sm:w-ml-0 w-bg-border-furniture"></div>
-                            <div class="w-flex w-items-center w-ml-3">
+                            <div id="w-slim-header-buttons" class="w-flex w-items-center w-ml-3">
                                 {% firstof actions block_actions %}
                             </div>
                         {% endif %}

wagtail/admin/views/generic/base.py

@@ -442,5 +442,8 @@ def get_context_data(self, *args, **kwargs):
             and self.filters
             and self.results_only
         )
+        context["render_buttons_fragment"] = (
+            context.get("header_buttons") and self.results_only
+        )
 
         return context

wagtail/admin/views/generic/models.py

@@ -334,7 +334,6 @@ def header_buttons(self):
                     self.add_item_label,
                     url=self.add_url,
                     icon_name="plus",
-                    attrs={"data-w-link-reflect-keys-value": '["locale"]'},
                 )
             )
         return buttons
@@ -349,10 +348,6 @@ def header_more_buttons(self):
                     url=self.xlsx_export_url,
                     icon_name="download",
                     priority=90,
-                    attrs={
-                        "data-controller": "w-link",
-                        "data-w-link-preserve-keys-value": '["export"]',
-                    },
                 )
             )
             buttons.append(
@@ -361,10 +356,6 @@ def header_more_buttons(self):
                     url=self.csv_export_url,
                     icon_name="download",
                     priority=100,
-                    attrs={
-                        "data-controller": "w-link",
-                        "data-w-link-preserve-keys-value": '["export"]',
-                    },
                 )
             )
 

wagtail/admin/widgets/button.py

@@ -109,9 +109,8 @@ def __init__(
         attrs = attrs.copy()
         attrs.update(
             {
-                "data-controller": "w-tooltip w-link",
+                "data-controller": "w-tooltip",
                 "data-w-tooltip-content-value": label,
-                "data-action": "w-swap:reflect@document->w-link#setParams",
                 "aria-label": label,
             }
         )

wagtail/snippets/tests/test_viewset.py

@@ -1536,3 +1536,35 @@ def test_index_view_get_add_url_is_respected_with_i18n(self):
         soup = self.get_soup(response.content)
         links = soup.find_all("a", attrs={"href": add_url})
         self.assertEqual(len(links), 1)
+
+    def test_index_results_view_get_add_url_teleports_to_header(self):
+        response = self.client.get(self.get_url("list_results"))
+        add_url = self.get_url("add") + "?customised=param"
+        soup = self.get_soup(response.content)
+        template = soup.find(
+            "template",
+            {
+                "data-controller": "w-teleport",
+                "data-w-teleport-target-value": "#w-slim-header-buttons",
+            },
+        )
+        self.assertIsNotNone(template)
+        links = template.find_all("a", attrs={"href": add_url})
+        self.assertEqual(len(links), 1)
+
+    @override_settings(WAGTAIL_I18N_ENABLED=True)
+    def test_index_results_view_get_add_url_teleports_to_header_with_i18n(self):
+        Locale.objects.create(language_code="fr")
+        response = self.client.get(self.get_url("list_results") + "?locale=fr")
+        add_url = self.get_url("add") + "?locale=fr&customised=param"
+        soup = self.get_soup(response.content)
+        template = soup.find(
+            "template",
+            {
+                "data-controller": "w-teleport",
+                "data-w-teleport-target-value": "#w-slim-header-buttons",
+            },
+        )
+        self.assertIsNotNone(template)
+        links = template.find_all("a", attrs={"href": add_url})
+        self.assertEqual(len(links), 1)