[DataGridPremium] Fix aggregated values sorting

packages/x-data-grid-premium/src/hooks/features/aggregation/wrapColumnWithAggregation.tsx

@@ -46,6 +46,27 @@ type ColumnPropertyWrapper<P extends WrappableColumnProperty> = (params: {
   ) => GridAggregationLookup[GridRowId][string] | null;
 }) => GridBaseColDef[P];
 
+const getAggregationValueWrappedValueGetter: ColumnPropertyWrapper<'valueGetter'> = ({
+  value: valueGetter,
+  getCellAggregationResult,
+}) => {
+  const wrappedValueGetter: GridBaseColDef['valueGetter'] = (value, row, column, apiRef) => {
+    const rowId = gridRowIdSelector(apiRef, row);
+    const cellAggregationResult = rowId ? getCellAggregationResult(rowId, column.field) : null;
+    if (cellAggregationResult != null) {
+      return cellAggregationResult?.value ?? null;
+    }
+
+    if (valueGetter) {
+      return valueGetter(value, row, column, apiRef);
+    }
+
+    return row[column.field];
+  };
+
+  return wrappedValueGetter;
+};
+
 const getAggregationValueWrappedValueFormatter: ColumnPropertyWrapper<'valueFormatter'> = ({
   value: valueFormatter,
   aggregationRule,
@@ -248,6 +269,7 @@ export const wrapColumnWithAggregationValue = (
     }
   };
 
+  wrapColumnProperty('valueGetter', getAggregationValueWrappedValueGetter);
   wrapColumnProperty('valueFormatter', getAggregationValueWrappedValueFormatter);
   wrapColumnProperty('renderCell', getAggregationValueWrappedRenderCell);
   wrapColumnProperty('renderHeader', getWrappedRenderHeader);

packages/x-data-grid-premium/src/tests/aggregation.DataGridPremium.test.tsx

@@ -232,6 +232,37 @@ describe('<DataGridPremium /> - Aggregation', () => {
       ]);
     });
 
+    it('should apply sorting on the aggregated values', async () => {
+      const { user } = render(
+        <Test
+          initialState={{
+            rowGrouping: { model: ['category1'] },
+            aggregation: { model: { id: 'sum' } },
+          }}
+        />,
+      );
+      expect(getColumnValues(1)).to.deep.equal([
+        '10' /* Agg "Cat A" */,
+        '5' /* Agg "Cat B" */,
+        '15' /* Agg root */,
+      ]);
+
+      const header = getColumnHeaderCell(1);
+      await user.click(header);
+
+      expect(getColumnValues(1)).to.deep.equal(
+        ['5' /* Agg "Cat B" */, '10' /* Agg "Cat A" */, '15' /* Agg root */],
+        'sorted asc',
+      );
+
+      await user.click(header);
+
+      expect(getColumnValues(1)).to.deep.equal(
+        ['10' /* Agg "Cat A" */, '5' /* Agg "Cat B" */, '15' /* Agg root */],
+        'sorted desc',
+      );
+    });
+
     describe('prop: getAggregationPosition', () => {
       it('should not aggregate groups if props.getAggregationPosition returns null', () => {
         render(