Build an observable from a simple english requirement
Having built all the event streams we need, we can now assemble them and generate the observable equivalent of our main requirement sentence: “When the loader needs to show, show the loader, until it’s time to hide it”.
Instructor: [00:00] We started from some very low-level terms like task starting or ending and we went up our floors tackling one small problem at a time creating higher- and higher-level abstractions that eventually brought us to being able to solve our top-level requirement. We now have all the pieces we need for this. Let's go and assemble it.
[00:19] I'll add the comment for this new layer as well. When the spinner needs to show, show the spinner. Remember, we consider this to be an observable that when activated shows the spinner. We're not going to worry yet about how that's going to work.
[00:35] When a task starts, switch to displaying the spinner until, and I'll pipe this to our take until, until it's time to hide it. We don't really care what or when this observable emits. This is meant to be a top-level overview of how everything is wired up. We don't really need to reuse it, but we do want to activate it. I'll just subscribe to it in here.
[01:02] The moment somebody imports this file, this observable will be activated. Yes, it will live on for the duration of our app. We never unsubscribe from it. But that's something we're OK with because we do want this to keep tracking tasks for the lifetime of our app.
[01:16] To recap, we've marked our low-level building blocks and we kept assembling them into more powerful building blocks. We also made sure not to dump everything in the same stream and instead obstruct the obstructions that make sense on their own.
[01:32] Not only does this keep our RxJS code more readable, almost flowing like an English sentence, but it also allows us to reuse some of these should we need to do so later, and we will need to.