From 6700e7870036dbf771d1a297ceb7c9ef8ba88cce Mon Sep 17 00:00:00 2001 From: Rob Date: Mon, 24 Feb 2025 10:41:04 +0000 Subject: [PATCH 1/2] feat: useTreeData add replaceAll --- packages/@react-stately/data/docs/useListData.mdx | 6 ++++++ packages/@react-stately/data/src/useTreeData.ts | 10 +++++++++- .../@react-stately/data/test/useTreeData.test.js | 15 +++++++++++++++ 3 files changed, 30 insertions(+), 1 deletion(-) diff --git a/packages/@react-stately/data/docs/useListData.mdx b/packages/@react-stately/data/docs/useListData.mdx index c902a0812ed..f463ea4018a 100644 --- a/packages/@react-stately/data/docs/useListData.mdx +++ b/packages/@react-stately/data/docs/useListData.mdx @@ -150,3 +150,9 @@ list.move('Snake', 0); ```tsx list.update('Snake', {name: 'Rattle Snake'}); ``` + +### Replacing the tree + +``` +list.replaceAll([{name: 'Fox', children: [{name: 'Rabbit'}]}]) +``` \ No newline at end of file diff --git a/packages/@react-stately/data/src/useTreeData.ts b/packages/@react-stately/data/src/useTreeData.ts index 5bcaa98b9f3..d8f13969556 100644 --- a/packages/@react-stately/data/src/useTreeData.ts +++ b/packages/@react-stately/data/src/useTreeData.ts @@ -50,7 +50,12 @@ export interface TreeData { * @param key - The key of the item to retrieve. */ getItem(key: Key): TreeNode | undefined, - + + /** + * Replace the whole tree. + * @param newItems - The new items to replace the tree with. + */ + replaceAll(newItems: T[]): void, /** * Inserts an item into a parent node as a child. * @param parentKey - The key of the parent item to insert into. `null` for the root. @@ -257,6 +262,9 @@ export function useTreeData(options: TreeOptions): TreeData getItem(key: Key) { return nodeMap.get(key); }, + replaceAll(newItems: T[]) { + setItems(buildTree(newItems, new Map())); + }, insert(parentKey: Key | null, index: number, ...values: T[]) { setItems(({items, nodeMap: originalMap}) => { let {items: newNodes, nodeMap: newMap} = buildTree(values, originalMap, parentKey); diff --git a/packages/@react-stately/data/test/useTreeData.test.js b/packages/@react-stately/data/test/useTreeData.test.js index eaffc8ad200..b6b1447e005 100644 --- a/packages/@react-stately/data/test/useTreeData.test.js +++ b/packages/@react-stately/data/test/useTreeData.test.js @@ -745,4 +745,19 @@ describe('useTreeData', function () { expect(result.current.items[1].key).toEqual('Emily'); expect(result.current.items.length).toEqual(2); }); + + it('Should replace the tree with new nodes', function () { + const initialItems = [...initial, {name: 'Emily'}, {name: 'Eli'}]; + let {result} = renderHook(() => + useTreeData({initialItems, getChildren, getKey}) + ); + act(() => { + result.current.replaceAll([{name: 'Robert', children: [{name: 'Linh'}]}, {name: 'Stanley'}]); + }); + expect(result.current.items[0].key).toEqual('Robert'); + + expect(result.current.items[0].children[0].key).toEqual('Linh'); + expect(result.current.items[1].key).toEqual('Stanley'); + expect(result.current.items.length).toEqual(2); + }); }); From 296cc635037df9067619ce6eca4df55f36adb41b Mon Sep 17 00:00:00 2001 From: Rob Date: Fri, 7 Mar 2025 10:24:23 +0000 Subject: [PATCH 2/2] update replaceAll to setRootItems --- packages/@react-stately/data/src/useTreeData.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/@react-stately/data/src/useTreeData.ts b/packages/@react-stately/data/src/useTreeData.ts index d8f13969556..84b0ce1097f 100644 --- a/packages/@react-stately/data/src/useTreeData.ts +++ b/packages/@react-stately/data/src/useTreeData.ts @@ -55,7 +55,7 @@ export interface TreeData { * Replace the whole tree. * @param newItems - The new items to replace the tree with. */ - replaceAll(newItems: T[]): void, + setRootItems(newItems: T[]): void, /** * Inserts an item into a parent node as a child. * @param parentKey - The key of the parent item to insert into. `null` for the root. @@ -262,7 +262,7 @@ export function useTreeData(options: TreeOptions): TreeData getItem(key: Key) { return nodeMap.get(key); }, - replaceAll(newItems: T[]) { + setRootItems(newItems: T[]) { setItems(buildTree(newItems, new Map())); }, insert(parentKey: Key | null, index: number, ...values: T[]) {