RxJS: Breaking out of the `repeat` operator

[pure grove]

Here is an oversimplified use of mousedown -> mousemove-> mouseup events chain: https://stackblitz.com/edit/rxjs-f4wjhz?file=index.ts. The actual code in my project contains much more, so I narrowed it down to the point where I need help with. In the code above, there's a repeat() operator at the end of the pipe. So basically this never ends, unless I use some operators which put a stop to this chain. Take a look at this Lockscreen example at https://stackblitz.com/edit/rxjs-lockscreen?file=index.ts. Here they've used both toArray and switchMap operators to check the selection against a predefined value. However, I don't have such case in my project.

Note: the chain shown in the Lockscreen example is pretty much close to what I have in my project, minus the predefined array of numbers.
Any idea on which operator (or combination of operators) to use here?

[lusty mountain]

So in which scenario do you want to stop repeating? Like, what happens that should make it stop?

[pure grove]

I'd like to tap into the mouseup event. But I can't seem to find a way without using toArray and switchMap operators. Moreover, in the Lockscreen example, any operator that comes after the last switchMap is executed for every value emitted by that operator - but I'd like to execute some code once - after the mouseup event fires.

[lusty mountain]

Then why not just listen to mouseup

What's the repeat for?

Also, this usually works better if you describe the behavior you want rather than the operators you picked

[pure grove]

Well... If you ask that... It's a long story...
I've been replicating this library into my project: https://github.com/tympanix/pattern-lock-js. I can't find any alternative library which does the same as that one and is implemented in Angular. While doing so, I stumbled upon that Lockscreen example, which pretty much does what I need. But the library I want in my project and the example I have is a bit different in the end - but the starting matches. So I'm trying to get inspiration from the example to implement the library in my project.

[rocky skiff]

Hey, don't know if it could be of any help for you since I'm not sure I fully understood your need but here I forked your example to handle a few things https://stackblitz.com/edit/rxjs-xdnga9?file=index.ts

[pure grove]

You're repeating it exactly 4 times, which isn't my case. Users can try as many times as they can. Looks like toArray has very important impact on breaking out of repeat, since it converts all emissions to an array when the source is completed. However, in my project, I got rid of the repeat operator (hence getting back the access to the complete function), and moved the repeat thing inside a button (means users can retry by clicking on a button and the whole process will start all over again).

[rocky skiff]

then you could simply remove that repeat

or use it with the RepeatConfig, with a repeat({ delay: () => repeat$$ }) where repeat$$ is a subject

[pure grove]

Yeah that's what I did. 😄

[rocky skiff]

And is what I sent you usefull or did I misunderstood your need?

[pure grove]

You used a fixed number of repeat and suggested a config which uses a subject. Neither of those actually fits my needs. This is pretty much close to what I wanted: https://stackblitz.com/edit/rxjs-lockscreen?file=index.ts

[rocky skiff]

I used the fixed number simply to show some possibilities, but I don't understand what is the thing you still need 😅

Why would you need a toArray? What do you expect with that?

Record the number of tries?

[pure grove]

In the example above, it accumulates all emissions and checks those with a predefined set of values. I don't have that in my project.

[pure grove]

This is what I need:
https://github.com/tympanix/pattern-lock-js

[rocky skiff]

Yeah, got it, but at what step are you? What made you send your request? the entire thing?

[pure grove]

I'm trying to replicate that in Angular, since I couldn't find any other Angular library which does the same thing. But I couldn't come up with the working RxJS chain of operators. Then I found that that example in my previous message and I took inspiration from that. There the author used repeat operator at the end, to basically repeat the whole process all over. But the way he broke out of that (by using toArray and switchMap) wasn't compatible with my use case. That's why I asked if there were any other ways to break out of repeat with unknown numbers of operation.