Is it possible to add a new table inside and expanded row of expandable table

[petertodorov]

Hi there,
a question related to an issue I face.
I am trying to add a whole new Rsuite table (a Child table) as a content of an expanded row of another Rsuite table (the Parent table).
I am doing this via renderRowExpanded
The problem I have is that the Child table is being rendered but all the styles are messed up see the attached video and I cannot find the reason for this.

I was wondering if anyone has faced a similar issue and if you have any ideas on how I can solve this?
Thanks in advance

p.s and quick update:
just found out that the Child table has doubling in the classNames (e.g. rs-table-table rs-table-table-hover instead of the proper ones) which I believe causes the issue, but have no idea what is the reason for this!?!
https://user-images.githubusercontent.com/15709255/163581610-841d0e6b-b610-4c88-8c21-6892348f8b9b.mov

[simonguo]

Hi @petertodorov
Table does not currently support nested Table. If the column structure of the expanded row is consistent with the parent, consider using Tree Table.

[petertodorov]

@simonguo thanks for the reply.
Meanwhile, a kind of solution (which might be quite hacky though) was found. If you pass a
prop classPrefix="rs-table" to the table, the issue with doubling of the '-table' in the classNames is avoided. Thus a nested table can be added inside an expandable row...nevertheless I am not sure if this is not a misuse of the prop.

[simonguo]

classPrefix is designed to resolve css naming conflicts. As well as secondary packaging capabilities based on again.

This usage scenario of table nesting should be able to solve the problem, but it requires you to duplicate the style of the table and change the css name. This solution is not tested by us, you can try it out and give us feedback.

[jiabin-pki]

When I hover the parent table's row, the expand table will be selected. How to avoid it?

[jiabin-pki]