Skip to content

Waiters composition #12

@pwlmc

Description

@pwlmc

I've been using the library for a while and I noticed that I could simplify my code with something like composing of the waiters. For example, given that I have two waiters bar and baz, I would like to have foo waiter that is waiting if one of bar or baz is waiting.

Motivation

Now, first I was thinking about adding array argument support to isWaiting so that I could call isWaiting(["foo", "bar"]) or a bit more explicit convenience function isAnyWaiting(["foo", "bar"]).

But after looking into my code I realized it's not enough. In my case, I have some big component
Foo rendering smaller components Bar and Baz that wait on each other. That works fine with current API. It gets more convoluted when you would like to have some other component Qux that doesn't exactly want to know about the lower-level ones but needs to know if Foo or any of it's children waits. So currently in Qux you would need to write

const isFooWaiting = isWaiting("baz") && isWaiting("baz")

That's not ideal because Qux needs to know too much about Foo internals.

Proposal

Create a separate method that will create a new waiter if one of the child waiters is waiting. It could be similar in usage to createWaitingContext:

const { compose } = useWait();
const { isWaiting } = compose("Foo", ["Bar", "Baz"])
  • Foo is a waiter, you can check if it's waiting with isWaiting("Foo")
  • Foo is always waiting if Bar or Baz is waiting.
  • the open question is should you be able to manually start and end a composed waiter?

Anternative idea

Maybe instead adding a compose method, we could compose Waiter providers? It's just an idea, I don't know if it's possible or makes sense but provier could have an optional name and be a child of another warapper like this?

<Waiter>
  <Waiter name="foo">
    // ...
  </Waiter>
</Waiter>

Then if the inner's anyWaiting() is true, foo is waiting in the outer waiter?
Again, it's just an idea.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions