solid icon indicating copy to clipboard operation
solid copied to clipboard

Creating Computed Stores with Arguments

Open developercbs opened this issue 2 years ago • 0 comments

Issue

The scenario I am running into is that I have a computed that looks as follows:

 computed(tableStore, (tables) => {
            return tables.filter(table => table.status === TableStatuses.ACTIVE && table.userId === userId());
        })

Now The above expects a userId(). However this is a somewhat dynamic value so I created a function in my store that looks as follows:

export const getActiveTablesByUser = <T>(userId: Accessor<T>) => {
    const store = createStore(
        computed(tableStore, (tables) => {
            return tables.filter(table => table.status === TableStatuses.ACTIVE && table.userId === userId());
        })
    );
    return store();
}

I then reference this function inside of a component:

const activeTables = () => getActiveTablesByUser(userId);

Then I can call activeTables() to get the active tables via a computed.

My issue and question is I had to work around Solid in order to get it to not complain about it possibly breaking reactivity so the only way I could find in order to do so was the above.

Is this the expected approach or should I be doing something different to allow for computed to use that userId() value?

developercbs avatar Feb 21 '23 21:02 developercbs