[FIX] web: format correctly aggregate values in grouped list views

Steps:
  - Go to Employees/Reporting/skills

The first group has a Level Progress of `0.84444` which is not a valid
percentage, it should be `84.44%`

This fix calls the correct format function to display correctly the
aggregate values depending on their widget or type instead of just
displaying the raw aggregate value.

(https://pad.odoo.com/p/wowl_views:
[GMF] Employee : Skills report, group sum should be % https://tinyurl.com/262ec37z)

closes odoo/odoo#98207

Signed-off-by: FrancoisGe <fge@odoo.com>

addons/web/static/src/views/list/list_renderer.js

@@ -527,6 +527,17 @@ export class ListRenderer extends Component {
         return aggregates;
     }
 
+    formatAggregateValue(group, column) {
+        const { widget, type, rawAttrs } = column;
+        const aggregateValue = group.aggregates[column.name];
+        const formatter = formatters.get(widget, false) || formatters.get(type, false);
+        const formatOptions = {
+            digits: rawAttrs.digits ? JSON.parse(rawAttrs.digits) : undefined,
+            escape: true,
+        };
+        return formatter ? formatter(aggregateValue, formatOptions) : aggregateValue;
+    }
+
     getGroupLevel(group) {
         return this.props.list.groupBy.length - group.list.groupBy.length - 1;
     }

addons/web/static/src/views/list/list_renderer.xml

@@ -160,7 +160,7 @@
                 <Pager t-props="getGroupPagerProps(group)"/>
             </th>
             <td t-on-keydown.synthetic="(ev) => this.onCellKeydown(ev, group)" t-foreach="getAggregateColumns(group)" t-as="column" t-key="column.id" class="o_list_number">
-                <t t-esc="group.aggregates[column.name]"/>
+                <t t-esc="formatAggregateValue(group, column)"/>
             </td>
             <t t-set="groupPagerColspan" t-value="getGroupPagerCellColspan(group)"/>
             <th t-on-keydown.synthetic="(ev) => this.onCellKeydown(ev, group)" t-if="groupPagerColspan > 0" t-att-colspan="groupPagerColspan"/>

addons/web/static/tests/views/list_view_tests.js

@@ -14619,4 +14619,21 @@ QUnit.module("Views", (hooks) => {
 
         assert.containsN(target, ".o_data_row", 3);
     });
+
+    QUnit.test("Formatted group operator", async function (assert) {
+        serverData.models.foo.records[0].qux = 0.4;
+        serverData.models.foo.records[1].qux = 0.2;
+        serverData.models.foo.records[2].qux = 0.01;
+        serverData.models.foo.records[3].qux = 0.48;
+        await makeView({
+            type: "list",
+            resModel: "foo",
+            serverData,
+            arch: '<tree><field name="qux" widget="percentage"/></tree>',
+            groupBy: ["bar"],
+        });
+        const [td1, td2] = target.querySelectorAll("td.o_list_number");
+        assert.strictEqual(td1.textContent, "48%");
+        assert.strictEqual(td2.textContent, "61%");
+    });
 });