-
Notifications
You must be signed in to change notification settings - Fork 125
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
Add selectors #518
base: main
Are you sure you want to change the base?
Add selectors #518
Conversation
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's an interesting idea to have a package dedicated to the selector primitive. There might be other helpers this could include.
But right now I wouldn't advice anyone to use it with only createArraySelector
, especially when it doesn't provide too much value.
Also I'm wondering if instead of exporting a createSelector
wrapper, it would be better to just export the (key, list) => list.includes(key)
part. Then one could compose it with the selector.
import { arrayIncludes } from "@solid-primitives/selector"
const isItemSelected = createSelector(selectedItems, arrayIncludes)
* </For> | ||
*/ | ||
export function createArraySelector<T>( | ||
source: () => Array<T>, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
it should allow readonly arrays too
source: () => Array<T>, | |
source: () => readonly T[], |
*/ | ||
export function createArraySelector<T>( | ||
source: () => Array<T>, | ||
options?: { name?: string }, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Better to reuse types from solid for the options (and any other type if possible), to show where it is coming from, and remove the need for updating the types when options in solid change.
@@ -0,0 +1,57 @@ | |||
{ | |||
"name": "@solid-primitives/selectors", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
prefer selector
singular to match the rest of the packages
{(item) => <li classList={{ active: isSelected(item) }}>{item}</li>} | ||
</For> | ||
``` | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Worth adding that it doesn't work when mutating the array:
https://playground.solidjs.com/anonymous/bfeda055-2f2c-465e-b438-ea9d671a4eb8
{(item) => <li classList={{ active: isSelected(item) }}>{item}</li>} | ||
</For> | ||
``` | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Worth showing that the implementation is basically an alias to createSelector
with Array.includes
const createArraySelector = source => createSelector(source, (key, list) => list.includes(key))
I don't want anyone to get an impression that it's not possible to do this with createSelector
Using
createSelector
is good for a single values. I found that there are a lot of use cases for array selectors. I have been using this on a few projects and I think it would be a good addition to the library.Extending with a comparator function (instead of
b.includes(a)
) to support objects could be possible, but I decided to keep it simple. At that point it might be better to just create a custom selector directly.