Skip to content

feat: Tree multiple level loading support and only count "items" for collection size #8349

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

Open
wants to merge 24 commits into
base: main
Choose a base branch
from

Conversation

LFDanLu
Copy link
Member

@LFDanLu LFDanLu commented Jun 4, 2025

Closes RSP Component Milestones (view)

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Test Tree multiloading stories in RAC storybook. Also test all collections that support loading indicators (Table, Listbox, GridList, Tree, ComboBox, Picker, etc) and make sure that the virtualized items have the proper aria-rowcount/posinset/etc. Loaders shouldn't be counted as items/rows. Sanity check that other collections work fine virtualized/non-virtualized and that empty states/initial load states still render as expected

🧢 Your Project:

RSP

@rspbot
Copy link

rspbot commented Jun 5, 2025

Build successful! 🎉

@rspbot
Copy link

rspbot commented Jun 5, 2025

Build successful! 🎉

@rspbot
Copy link

rspbot commented Jun 17, 2025

Build successful! 🎉

@LFDanLu LFDanLu changed the title feat: Tree multiple level loading support feat: Tree multiple level loading support and only count "items" for collection size Jun 17, 2025
@rspbot
Copy link

rspbot commented Jun 17, 2025

Build successful! 🎉

snowystinger
snowystinger previously approved these changes Jun 23, 2025
@snowystinger
Copy link
Member

looks like you have some conflicts, happy to help resolve

@rspbot
Copy link

rspbot commented Jun 23, 2025

Build successful! 🎉

@rspbot
Copy link

rspbot commented Jun 23, 2025

Build successful! 🎉

devongovett
devongovett previously approved these changes Jun 23, 2025
Copy link
Member

@devongovett devongovett left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

approving for testing

setSize = getLastItem(siblings)!.index + 1;
let lastItemOfParent = getLastItem(siblings)!;
// Don't include loaders as part of the item count, to be revisited when we support focusing the loaders
// Also assumes only one loader per tree parent row
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and assumes the loader is the last child. doesn't the tree item content node also count as a child of tree items? would it be safer to just count all the item children?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah, thats true. Counting just the items should work, will update

let loaderNodeIndex = collectionNodes.indexOf(loaderNode);
// Subtract by an additional 1 since we've already added the current item's height to y
y += (loaderNodeIndex - lastProcessedIndex - 1) * rowHeight;
let loader = this.buildChild(loaderNode, this.padding, y, null);
nodes.push(loader);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Doesn't this potentially reorder the loaders? This would put them all at the end, even if they were somewhere else within the collection originally.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we only hit this point if we past the virtualizer's requested rect though right? At that point we only need/want to build and persist the loaders, and the order of these remaining loaders should be correct provided that iterating over the collection provides the nodes in their proper order

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

my mental model for this flow is essentially:

  1. Iterate through the collection from the top.
  2. From y=0 to y=requestedRect.y, we build every loader and estimate the y increase for items
  3. From y=requestedRect.y to y=requestedRect.maxY, we build all loaders and items. Note that the loaders are removed from loaderNodes if they are built in step 2 or 3
  4. From y=requestedRect.maxY onwards, build the remaining loaders, increasing y with an estimated rowHeight * number of items between each loader and its next loader

so theoretically the order of the loaders should be preserved right?

@rspbot
Copy link

rspbot commented Jun 23, 2025

Build successful! 🎉

snowystinger
snowystinger previously approved these changes Jun 23, 2025
@rspbot
Copy link

rspbot commented Jun 24, 2025

Build successful! 🎉

@rspbot

This comment was marked as resolved.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants