[DataTable] accept nested objects in "rows" array

[sillybutt0]

Currently we need to connect data in "rows" prop of DataTable component with TableHeader's "name" prop to work properly. But having nested object in "rows" array will not connect them and sort.

Example of how now works:

const data = [{email: 'test@test.com', name: 'Alex'}];

<DataTable rows={data}>
  <TableHeader name="email">Email</TableHeader>
  <TableHeader name="name">Name</TableHeader>
</DataTable>

And how does not work:

const data = [{email: 'test@test.com', profile: { name: 'Alex' }}];

<DataTable rows={data}>
  <TableHeader name="email">Email</TableHeader>
  <TableHeader name="name">Name</TableHeader>
</DataTable>

I suggest to type object keys like "profile.name" and make if work correctly with further sorting.

[vegansk]

You can use workaround:

<TableHeader name="profile" cellFormatter={(profile) => profile.name}>Name</TableHeader>