synesthesia-project/synesthesia

live: Implement config propagation utils

Opened this issue · 0 comments

s0 commented

One of the biggest parts of work to componentise existing code, or to create new components, is to link together all the config updating and propagation up & down, and respond to config change events, and pass that down to each of the individual child components.

This process could be simplified if we introduced a modular way of propagating configurations, and linking sub-configurations. We could also simplify the handling of more specific types at type boundaries (such as plugin config / input config) by doing the type checking in a single place, and just linking using unknown to reduce the need for type coercion.

It would need to:

  • accept applyConfig and

  • allow for adding children, example:

    const childConfig = c.addChild(
      // Get current value
      current => current.children[id],
      // Update current value
      (current, update) => ({
        ...current,
        children: {
          ...current.children,
          [id]: update(current.children[id])
        }),
      // Optional: delete current child (required for `.delete()`
      (current) => {
        const children = {...current.children};
        delete children[id];
        return { ...current, children};
      }
    );
  • allow for "updating" config with an updater .update(current => { /* */ }).

  • allow for "deleting" the config .delete().

  • automatically skip applying config when nothing has changed (so we don't need this logic in each component).

  • Have event listeners for delete and changed.

Then usage would just be to initialize sub-components with one of these in the constructor.