One subrow, multiple groups

[jgarplind]

Is it possible to have a (sub)row appear in multiple groups?

My use case is that the row describes an entity that can be connected to 0-3 people.

I would like to group the table data by people, and (for example) rather than having 3 groups: "person 1", "person 2", "person 1 & person 2", I would ideally want to have just 2 groups: "person 1" and "person 2", with the shared row being duplicated across the groups.

I've tried to hack around a bit, but before delving deeper I figured I would ask for some expertise here!

[jgarplind]

... maybe implementing a custom https://github.com/TanStack/table/blob/56e3197f85875f5a8b4c2c0b2fd186e77d6058fd/packages/table-core/src/utils/getGroupedRowModel.ts seems wise?

A bit daunting, to be sure, but perhaps the most clear-cut way forward.

[jgarplind]

I tried to extend getGroupedRowModel doing something like this:

function groupBy<TData extends RowData>(rows: Row<TData>[], columnId: string) {
  const groupMap = new Map<any, Row<TData>[]>();

  return rows.reduce((map, row) => {
-    const resKey = `${row.getGroupingValue(columnId)}`;
-    const previous = map.get(resKey);
-    if (!previous) {
-      map.set(resKey, [row]);
-    } else {
-      previous.push(row);
-    }
+    const resKey = `${row.getGroupingValue(columnId)}`.split(",");
+    resKey.forEach((key) => {
+      const previous = map.get(key);
+      if (!previous) {
+        map.set(key, [row]);
+      } else {
+        previous.push(row);
+      }
    });
    return map;
  }, groupMap);
}

but it crashes when running into a custom sortingFn for another row property, x. For reference, the sortingFn looks like this:

    sortingFn: (a, b) => {
      const aState = a.getValue("x");
      const bState = b.getValue("x");
      if (aState[2] === "y")
      [...]

where x is not the property the grouping is based on, and is (supposedly) known to be a tuple with 3 entries (e.g. ["y", "yy", "yyy"]).

The error message however indicates that a.getValue("x") returns undefined, hence guarding like so:

if (!a.getValue("x")) return -1;
if (!b.getValue("x")) return 1;

appears to avoid the crash.

Still, not understanding the root cause is discomforting. In particular:

• Why would my altered grouping logic cause different sorting to be applied? Without my custom grouping logic, the sortingFn for x is never even triggered (despite the table sorting order being defined as [{"id": "groupedColumn"}, {"id": "x"}]), but when my custom grouping is applied, it is clearly being executed (and causing issues).
• Why would x suddenly not be retrievable when using row.getValue("x"), even though it has been defined as an accessor column using the column helper? It does make sense that the group aggregate doesn't have a single value for x, but the subrows should.