Position of items in DetailList - Grouped is not changing when increasing the level of group in fluentui

[sauravlikhar]

I want to create one list of nested grouped rows using DetailList in fluentui mentioned here

When we increase the level of any group item it is getting shifted to right by one level. I want the items also to be shifted inside this group.

This is the snapshot when I increased the level of groupred0 to 2 enter image description here

I want the row items 'a' and 'b' to be aligned with 'Color: "red"(2)' because in my use case there will be multiple groups nested like a file directory structure.

I also can not use the groupedlist of fluentui mentioned here

Because it does not have the option for the list columns header as in the DetailsList.

[micahgodbolt]

unfortunately this is not how DetailsList works as each cell needs to line up with the headers at the top.

[sauravlikhar]

Can I use GroupedList for my use case with the column headers? As it has indentation with multiple levels.