Best practice for extracting reusable getters for Svelte stores

Viewed 175

Extracting update functions for stores is easy, but is there an easy way to extract getters. I'm trying to do something like this where I can reuse a getter function in multiple places. I guess my only 2 solutions are creating a derived store for every getter or combining stores into 1 custom store?

export function enableAll () {
    if (enableAllAllowed()) {
        storeA.update(current => { ...current, enabled: true });
        storeB.update(current => { ...current, enabled: true });
        storeC.update(current => { ...current, enabled: true });
    }
}

export function enableAllAllowed () {
    return get(StoreA).available && get(StoreB).available && get(StoreC).available && get(StoreD).canEnableAll;
}

<Component1>
   <button disabled={!enableAllAllowed()} on:click={enableAll}>
       Enable All
   </button>
</Component1>

<Component2>
   <button disabled={!enableAllAllowed()} on:click={enableAll}>       
       Enable All
   </button>
</Component2>
0 Answers
Related