Skip to content

feat: support pick item props with config.transform #49

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 76 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,7 @@ You can provide a second argument to arrayToTree with configuration options. Rig
- `throwIfOrphans`: Option to throw an error if the array of items contains one or more items that have no parents in the array or if the array of items contains items with a circular parent/child relationship. This option has a small runtime penalty, so it's disabled by default. When enabled, the function will throw an error containing the parentIds that were not found in the items array, or in the case of only circular item relationships a generic error. The function will throw an error if the number of nodes in the tree is smaller than the number of nodes in the original array. When disabled, the function will just ignore orphans and circular relationships and not add them to the tree. Default: `false`
- `rootParentIds`: Object with parent ids as keys and `true` as values that should be considered the top or root elements of the tree. This is useful when your tree is a subset of full tree, which means there is no item whose parent id is one of `undefined`, `null` or `''`. The array you pass in will be replace the default value. `undefined` and `null` are always considered to be rootParentIds. For more details, see [#23](https://github.com/philipstanislaus/performant-array-to-tree/issues/23). Default: `{'': true}`
- `assign`: Option that enables `Object.assign` instead of the spread operator to create an item in the tree when `dataField` is `null`. This is useful if your items have a prototype that should be maintained. If enabled and `dataField` is `null`, the original node item will be used, and the `children` property will be assigned, calling any setters on that field. If `dataField` is not `null`, this option has no effect, since the original node will be used under the `dataField` of a new object. If you are unsure whether you need to enable this, it's likely fine to leave it disabled. Default: `false`
- `transform`: Option to transform the item, provide `string[]` to pick some props or `function` for fully control. Default: `undefined`

Example:

Expand Down Expand Up @@ -170,6 +171,81 @@ Which produces:
];
```

Example with transform with special keys:

```js
const tree = arrayToTree([
{ id: "4", parentId: null, custom: "abc", custom2: "other" },
{ id: "31", parentId: "4", custom: "12", custom2: "other" },
{ id: "1941", parentId: "418", custom: "de", custom2: "other" },
{ id: "1", parentId: "418", custom: "ZZZz", custom2: "other" },
{ id: "418", parentId: null, custom: "ü", custom2: "other" },
], {
transform: [ 'id', 'parentId', 'custom' ],
});
```

Which results in the following array with speical keys:

```js
[
{
data: { id: "4", parentId: null, custom: "abc" },
children: [
{ data: { id: "31", parentId: "4", custom: "12" }, children: [] },
],
},
{
data: { id: "418", parentId: null, custom: "ü" },
children: [
{ data: { id: "1941", parentId: "418", custom: "de" }, children: [] },
{ data: { id: "1", parentId: "418", custom: "ZZZz" }, children: [] },
],
},
];
```

Example with transform with custom function:

```js
const tree = arrayToTree([
{ id: "4", parentId: null, custom: "abc", custom2: "other" },
{ id: "31", parentId: "4", custom: "12", custom2: "other" },
{ id: "1941", parentId: "418", custom: "de", custom2: "other" },
{ id: "1", parentId: "418", custom: "ZZZz", custom2: "other" },
{ id: "418", parentId: null, custom: "ü", custom2: "other" },
], {
transform: (node) => {
return {
id: node.id,
parentId: node.parentId,
custom: node.custom,
custom2: node.custom + '2',
};
},
});
```

Which results in the following array with speical keys:

```js
[
{
data: { id: "4", parentId: null, custom: "abc", custom2: "abc2" },
children: [
{ data: { id: "31", parentId: "4", custom: "12", custom2: "122" }, children: [] },
],
},
{
data: { id: "418", parentId: null, custom: "ü", custom2: "ü2", },
children: [
{ data: { id: "1941", parentId: "418", custom: "de", custom2: "de2" }, children: [] },
{ data: { id: "1", parentId: "418", custom: "ZZZz", custom2: "ZZZz2" }, children: [] },
],
},
];
```

## TypeScript

This project includes types, just import the module as usual:
Expand Down
63 changes: 63 additions & 0 deletions src/arrayToTree.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -753,6 +753,69 @@ describe("arrayToTree", () => {
expect(tree[0].__proto__).to.deep.equal(Object.prototype);
expect(tree[0].legs).to.equal(undefined);
});

it("should transform with special keys", () => {
expect(
arrayToTree([
{ id: "4", parentId: null, custom: "abc", custom2: "def", custom3: 'xzy' },
{ id: "31", parentId: "4", custom: "12", custom2: "345", custom3: '678' },
{ id: "1941", parentId: "418", custom: "de", custom2: "dede", custom3: 'xxx' },
{ id: "1", parentId: "418", custom: "ZZZz", custom2: "xxx", custom3: '12365' },
{ id: "418", parentId: null, custom: "ü", custom2: "1qa", custom3: '3sa' },
], {
transform: [ 'id', 'parentId', 'custom', 'custom2' ],
})
).to.deep.equal([
{
data: { id: "4", parentId: null, custom: "abc", custom2: "def" },
children: [
{ data: { id: "31", parentId: "4", custom: "12", custom2: "345" }, children: [] },
],
},
{
data: { id: "418", parentId: null, custom: "ü", custom2: "1qa" },
children: [
{ data: { id: "1941", parentId: "418", custom: "de", custom2: "dede", }, children: [] },
{ data: { id: "1", parentId: "418", custom: "ZZZz", custom2: "xxx" }, children: [] },
],
},
]);
});

it("should transform with fn", () => {
expect(
arrayToTree([
{ id: "4", parentId: null, custom: "abc" },
{ id: "31", parentId: "4", custom: "12" },
{ id: "1941", parentId: "418", custom: "de" },
{ id: "1", parentId: "418", custom: "ZZZz" },
{ id: "418", parentId: null, custom: "ü" },
], {
transform: (node) => {
return {
id: node.id,
parentId: node.parentId,
custom: node.custom,
custom2: node.custom + '2',
}
},
})
).to.deep.equal([
{
data: { id: "4", parentId: null, custom: "abc", custom2: "abc2" },
children: [
{ data: { id: "31", parentId: "4", custom: "12", custom2: "122" }, children: [] },
],
},
{
data: { id: "418", parentId: null, custom: "ü", custom2: "ü2" },
children: [
{ data: { id: "1941", parentId: "418", custom: "de", custom2: "de2", }, children: [] },
{ data: { id: "1", parentId: "418", custom: "ZZZz", custom2: "ZZZz2" }, children: [] },
],
},
]);
});
});

describe("countNodes", () => {
Expand Down
22 changes: 19 additions & 3 deletions src/arrayToTree.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export interface Config {
rootParentIds: { [rootParentId: string]: true }; // use an object here for fast lookups
nestedIds: boolean;
assign: boolean;
transform?: string[] | ((item: Item) => Item);
}

const defaultConfig: Config = {
Expand Down Expand Up @@ -83,16 +84,19 @@ export function arrayToTree(
orphanIds.delete(itemId);
}

// transform the item data if necessary
const dataItem = conf.transform ? extractItem(item, conf.transform) : item;

// add the current item's data to the item in the lookup table
if (conf.dataField) {
lookup[itemId][conf.dataField] = item;
lookup[itemId][conf.dataField] = dataItem;
} else if (conf.assign) {
lookup[itemId] = Object.assign(item, {
lookup[itemId] = Object.assign(dataItem, {
[conf.childrenField]: lookup[itemId][conf.childrenField],
});
} else {
lookup[itemId] = {
...item,
...dataItem,
[conf.childrenField]: lookup[itemId][conf.childrenField],
};
}
Expand Down Expand Up @@ -173,3 +177,15 @@ export function countNodes(tree: TreeItem[], childrenField: string): number {
function getNestedProperty(item: Item, nestedProperty: string) {
return nestedProperty.split(".").reduce((o, i) => o && o[i], item);
}

function extractItem(item: Item, transform: string[] | ((item: Item) => Item)) {
if (Array.isArray(transform)) {
const newItem: Item = {};
for (const key of transform) {
newItem[key] = item[key];
}
return newItem;
} else {
return transform(item);
}
}