Skip to content
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

Gridlist not updating #6801

Closed
erangeles opened this issue Jul 30, 2024 · 6 comments
Closed

Gridlist not updating #6801

erangeles opened this issue Jul 30, 2024 · 6 comments

Comments

@erangeles
Copy link

erangeles commented Jul 30, 2024

Provide a general summary of the issue here

Gridlist doesn't seem to re-render/update when items change while using react suspense queries, this happens under 2 scenarios

   <GridList
        disabledBehavior="selection"
      >
        {items.map((item) => (
          <GridListItem textValue={item.key}  key={item.key} data-test-id="list-item">
          ....
          )}
     </GridList>

and

   <GridList
        disabledBehavior="selection"
        items={items)
      >
        {(item) =>
          <GridListItem textValue={item.key}  key={item.key} data-test-id="list-item">
          ....
          )}
     </GridList>

Works in 1.2.1 but not in 1.3.1, could this be related to the virtualization/collection changes?

🤔 Expected Behavior?

For Gridlist to re-render when items change

😯 Current Behavior

Gridlist is not re-rendering/updating even when items change

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

https://stackblitz.com/edit/github-dnkquu?file=src%2FApp.tsx

Version

1.3.1

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

OSX

🧢 Your Company/Team

LD

🕷 Tracking Issue

No response

@erangeles
Copy link
Author

I wanted to mention that I am using react suspense to fetch items in this case, potentially related to #6182

@snowystinger
Copy link
Member

I'm not sure what exactly the issue is, but I corrected for the possible/likely duplicate keys and I'm not able to reproduce
https://codesandbox.io/p/sandbox/interesting-microservice-vw5zm4?file=%2Fsrc%2FApp.js%3A16%2C19

@erangeles
Copy link
Author

Hey @snowystinger the issue is react suspense queries and gridlist, when we don't use suspense gridlist works as intended. I'm going to redo my minimal repro.

@erangeles
Copy link
Author

@Niznikr
Copy link

Niznikr commented Jul 31, 2024

Looks like setting a key (in our case one tied to url search params since we're using useSuspenseQuery ) on the Suspense boundary itself results in the GridList re-rendering properly. Wonder what regressed from 1.2 that caused this behavior to change?

@snowystinger
Copy link
Member

Thanks for coming back with a new repro. Given how close it is to #6182 I'm going to close this issue and we can continue the conversation over there.
Thanks again

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

No branches or pull requests

3 participants