react-wait
react-wait copied to clipboard
Waiters composition
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 withisWaiting("Foo")
-
Foo
is always waiting ifBar
orBaz
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.
On second thought, maybe adding support for wildcards to isWaiting
would be enough and a lot simpler solution.
With wildcards, you could have your own waiters naming convention, eg. foo_a
, foo_b
, etc. and then call isWaiting("foo_*")
to check if any of them is waiting?
anyWaiting()
could be then written as isWaiting("*")
.
I think I like this one the most, @f ?