[FIX] web_responsive: Missing key in search panel filter component OWL

Fixes OCA#2653 Owl requires the presence of a t-key directive in [t-foreach](https://github.com/odoo/owl/blob/master/doc/reference/templates.md#loops) to be able to properly reconcile renderings. The owl template in `web_responsive/static/src/components/search_panel/search_panel.xml` missed the t-key directive. Hence the crash. This commit introduces this `t-key` and ensures that it is unique.
idenayer · Nov 22, 2023 · 7dd0da5 · 7dd0da5
1 parent b310f65
commit 7dd0da5
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/web_responsive/static/src/components/search_panel/search_panel.esm.js b/web_responsive/static/src/components/search_panel/search_panel.esm.js
@@ -43,6 +43,7 @@ patch(SearchPanel.prototype, "web_responsive.SearchPanelMobile", {
             }
             if (filterValues.length) {
                 selection.push({
+                    id: filter.id,
                     values: filterValues,
                     icon: filter.icon,
                     color: filter.color,

diff --git a/web_responsive/static/src/components/search_panel/search_panel.xml b/web_responsive/static/src/components/search_panel/search_panel.xml
@@ -12,7 +12,12 @@
                 <div class="d-flex flex-wrap align-items-center">
                     <i class="fa fa-fw fa-filter mr-1" />
                     <t t-set="filters" t-value="getActiveSummary()" />
-                    <span t-foreach="filters" t-as="filter" class="mx-1">
+                    <span 
+                        t-foreach="filters" 
+                        t-as="filter" 
+                        t-key="filter.id" 
+                        class="mx-1"
+                    >
                         <i
                             t-if="filter.icon"
                             t-attf-class="fa {{ filter.icon }} mr-2"