feat: support for solid-js

[MAST1999]

No description provided.

[changeset-bot]

⚠️ No Changeset found

Latest commit: a00ce5c

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

[teleskop150750]

Should there be a store subscription like in other frameworks?

React

Vue main

Vue v2

Vue v3

[MAST1999]

Should there be a store subscription like in other frameworks?

There's a problem with the implementation of the useStore for both Svelte and Solid doesn't work in this use case.

Because the compiledQuery is a memo useStore doesn't subscribe to it, so when it's update it doesn't register for useStore so we don't get the updates.

We'll need a way to pass a function/getter to useStore so that it listens to signals.

[teleskop150750]

Should there be a store subscription like in other frameworks?

There's a problem with the implementation of the useStore for both Svelte and Solid doesn't work in this use case.

Because the compiledQuery is a memo useStore doesn't subscribe to it, so when it's update it doesn't register for useStore so we don't get the updates.

We'll need a way to pass a function/getter to useStore so that it listens to signals.

Please take a look at my vue 2/3 implementation

Vue v2

Vue v3

UPD

MAST1999#1

[wobsoriano]

Should there be a store subscription like in other frameworks?

There's a problem with the implementation of the useStore for both Svelte and Solid doesn't work in this use case.

Because the compiledQuery is a memo useStore doesn't subscribe to it, so when it's update it doesn't register for useStore so we don't get the updates.

We'll need a way to pass a function/getter to useStore so that it listens to signals.

Please take a look at my vue 2/3 implementation

Vue v2

Vue v3

#92 (comment)

Do you think we can open a PR to TanStack Store Vue/Solid/Svelte instead for them to accept a getter/ref instead? Or just improve it all in all?

[teleskop150750]

Should there be a store subscription like in other frameworks?

There's a problem with the implementation of the useStore for both Svelte and Solid doesn't work in this use case.

Because the compiledQuery is a memo useStore doesn't subscribe to it, so when it's update it doesn't register for useStore so we don't get the updates.

We'll need a way to pass a function/getter to useStore so that it listens to signals.

Fix link

MAST1999#1

[teleskop150750]

Should there be a store subscription like in other frameworks?

There's a problem with the implementation of the useStore for both Svelte and Solid doesn't work in this use case.

Because the compiledQuery is a memo useStore doesn't subscribe to it, so when it's update it doesn't register for useStore so we don't get the updates.

We'll need a way to pass a function/getter to useStore so that it listens to signals.

Please take a look at my vue 2/3 implementation
Vue v2
Vue v3
#92 (comment)

Do you think we can open a PR to TanStack Store Vue/Solid/Svelte instead for them to accept a getter/ref instead? Or just improve it all in all?

You can of course open a PR with something like this change. Since this package is small I don't see any restrictions for using the core version. without framework wrappers

export const useStore = (
  getStore: () => Store<any, any> | Derived<any, any>,
  selector: (v: any) => any
) => {
  let unsub = () => {}
  const state = createMemo(() => {
    const store = getStore()
    const [slice, setSlice] = createStore({
      value: selector(store.state),
    })

    unsub = store.subscribe(() => {
      const newValue = selector(store.state)
      setSlice(`value`, reconcile(newValue))
    })

    return slice
  })

  onCleanup(() => {
    unsub()
  })

  return () => state().value
}

UPD