statelyai / xstate

Actor-based state management & orchestration for complex app logic.
https://stately.ai/docs
MIT License
27.21k stars 1.26k forks source link

fix(vue): triggerRef in the update selected function #5095

Open Hebilicious opened 1 month ago

Hebilicious commented 1 month ago

fix #5091

I'm 100% sure this is not the best way to do this, but this works on my end ... So I will need to investigate this further. Will let this open as a draft for now.

changeset-bot[bot] commented 1 month ago

⚠️ No Changeset found

Latest commit: f2a9a5fe0a7db73205ed46a1050f395c2f071f2f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Andarist commented 1 month ago

Please add a test case verifying the fixed behavior.

Hebilicious commented 1 month ago

Please add a test case verifying the fixed behavior.

Hi @Andarist

Due to the tests failing, I went ahead and investigated in depth, and found out that the issue wasn't related to xstate, but to the way vue works with Map objects (realised that the issue was happening with Map only). So as far as I know this is not related to xstate. And doing something like useSelector(myRef, s => [...s.context.myMap.values()]) would properly update. I will investigate more on the vue side and try to reproduce the issue without xstate.

On another note, I did some performance adjustements: I've noticed that useSelector is called in useActor, which is not necessary. Additionally it might be better to suggest using vue native computed to derive state, as it will not create an extra watcher and simply automatically update given that snapshot from useActor is a vue ref. Assuming a nested list scenario, useSelector could create a lot of watchers which is not necessary if the user just want to read the context (assuming this is the primary use of useSelector).

Should I update this PR with the performance adjustement and some suggested doc updates ?

Andarist commented 1 month ago

I'd prefer new dedicated PRs instead of repurposing this one