Updating selectedItems in Table component does not update

[adriantadros]

Describe the bug
I am using the aws-northstar Table component. I am trying to update the selected items in the table based on some state that is being controlled outside of the table component. When I update the selected state, I can see it is updated, however the table component ignores it and does not update the selected checkbox items in the table.

Note: if I swap the aws-northstar Table component for the @cloudscape-design/components Table component, it works fine.

Versions
@aws-northstar/ui v1.1.13

To Reproduce
CodeSandbox link to reproduce the problem

Steps to reproduce the behavior

See CodeSandbox example.

Steps to reproduce:

1. Click on checkbox items inside the table. The "selectedItems" state updates successfully.
2. Click on the test button.

Expected behaviour
Clicking on test button should override the selectedItems state and select the 3rd component in the table.

Actual behaviour
The React state for "selectedItems" is updated successfully, however the Table component ignores it and keeps the current selection.

Additional context
Using the @cloudscape-design/components Table works as expected. Swap the "Table" component in the imports in the CodeSandbox to see the difference in behavior.

[jessieweiyi]

Hi @adriantadros Thanks for reporting the bug.

Northstar's V2 Table component leverages Cloudscape's Collection hooks on handling the selectedItems updates. The input selectedItems is passed to the defaultSelectedItems of the hooks params: Items selected on the initial render. The items are matched by trackBy if defined and by reference otherwise.

It will not updated with the props change after the initial rendering.

Sorry for the confusion. We will update the docs to reflect that.