mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 11:36:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

feature: Add support for nested object fields in Data Table

Browse source 
feature: Add support for nested object fields in Data Table
This commit is contained in:
Khiman Louer 2021-04-16 19:23:39 +02:00
commit a6c5e570f3
No known key found for this signature in database
GPG key ID: 0B94B91AB55C831D
1 changed files with 15 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/DataTable/DataTable.svelte
View file

@ -124,6 +124,14 @@
.map(({ key }, i) => ({ key, id: $headerItems[i] }))
.reduce((a, c) => ({ ...a, [c.key]: c.id }), {})
);
const resolvePath = (object, path, defaultValue) =>
path
.split(/[\.\[\]\'\"]/)
.filter((p) => p)
.reduce(
(o, p) => (o && typeof o === "object" && o[p] ? o[p] : defaultValue),
object
);
setContext("DataTable", {
sortHeader,
@ -159,7 +167,7 @@
$: headerKeys = headers.map(({ key }) => key);
$: rows = rows.map((row) => ({
...row,
cells: headerKeys.map((key) => ({ key, value: row[key] })),
cells: headerKeys.map((key) => ({ key, value: resolvePath(row, key, "") })),
}));
$: sortedRows = rows;
$: ascending = $sortHeader.sortDirection === "ascending";
@ -170,8 +178,12 @@
sortedRows = rows;
} else {
sortedRows = [...rows].sort((a, b) => {
const itemA = ascending ? a[sortKey] : b[sortKey];
const itemB = ascending ? b[sortKey] : a[sortKey];
const itemA = ascending
? resolvePath(a, sortKey, "")
: resolvePath(b, sortKey, "");
const itemB = ascending
? resolvePath(b, sortKey, "")
: resolvePath(a, sortKey, "");
if ($sortHeader.sort) return $sortHeader.sort(itemA, itemB);