-
Notifications
You must be signed in to change notification settings - Fork 55
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
Feat/solid bindings #88
base: main
Are you sure you want to change the base?
Conversation
use solid/store.createMutable to wire up reactivity
to enable idiomatic use of objects and arrays in solid's Flow-Components an array of parseYjsReturnValue is returned when the object is accessed with a symbol that is not $reactiveproxy, $reactive or $skipreactive.
@bigmistqke I'd love to merge this, but my knowledge of solidjs is limited. I'm trying to add a unit test to see if we can test whether nested updates trigger effects (see my latest commit). I'm probably doing something wrong when bootstrapping Solid unit tests. Would you have some time to have a look? I now also commented out your Proxy trap, I'd like to test this later by creating a separate unit test with a For-construct (but we should first get a basic unit test working). Thanks again for your contribution |
looking back at this pr... it really shouldn't be merged yet, was too optimistic lol.
|
Alright!
|
Regarding 1: Apparently Solid will soon support |
that is very exciting news, thanks for sharing. |
Just reinstalled with npm instead of pnpm and that did the job 😊 the updated test is passing now. |
this PR adds solid-bindings to SyncedStore.
The PR is quite minimal: Solid's createMutable proved to be an excellent candidate for wiring SyncedStore's reactivity with Solid.
Besides that I introduced an extra proxy-trap (i think, not sure about the terminology) in the array-getter.
Instead of mapping (like react), solid has control flow-components to deal with arrays (and objects with solid-primitive's Entries):
a react's
store.todos.map(todo => todo.title)
would be idiomatically written in solid like<For each={store.todos}>{todo => todo.title}</For>
.<For each={store.todos}>
was currently not working, as store.todos returned a reference to the Yjs-object (I assume) instead of the array of proxies. A spread was needed<For each={[...store.todos]}>
which I believe would be cause of confusion and bugs when being used in a solid codebase.An extra proxy-trap is introduced to allow an idiomatic use of arrays and objects in Solid's control flow components: in the Proxy-getter of array we check if the array is being accessed with a symbol that isn't one of SyncedStore's
if (typeof p === "symbol" && p !== $reactiveproxy && p !== $reactive && p !== $skipreactive)
. If this is the case we return a map of the YjsReturnValues.With this proxy-trap SyncedStore's store behaves very similar to createMutable (besides the fact that you can not set arrays directly in SyncedStore's store) and all control flow-components behave as you would expect.
I am unsure if this proxy-trap has any implications for other frameworks.