rxjs/operators#switchMapTo TypeScript Examples

manifest$ = merge(
  ...Object.entries({
    "**/*.scss": stylesheets$,
    "**/*.ts*":  javascripts$
  })
    .map(([pattern, observable$]) => (
      defer(() => process.argv.includes("--watch")
        ? watch(pattern, { cwd: "src" })
        : EMPTY
      )
        .pipe(
          startWith("*"),
          switchMapTo(observable$.pipe(toArray()))
        )
    ))
)
  .pipe(
    scan((prev, mapping) => (
      mapping.reduce((next, [key, value]) => (
        next.set(key, value.replace(`${base}/`, ""))
      ), prev)
    ), new Map<string, string>()),
  )

open(): void {
		scheduled([
			this.oauthService.openAuthorizeWindow<{ token: string }>().pipe(
				tap(data => this.clientService.setToken(data.token)),
				switchMap(() => this.restService.v2.GetUser('@me', { includeEditorIn: true }).pipe(
					map(res => this.clientService.pushData(res?.user ?? null))
				))
			),
			defer(() => this.oauthService.navigateTo(this.restService.v2.GetAuthURL()))
		], asyncScheduler).pipe(
			mergeAll(),
			switchMapTo(EMPTY)
		).subscribe({
			error: (err) => {
				this.dialogRef.open(ErrorDialogComponent, {
					data: {
						errorCode: err.status,
						errorMessage: err.error?.error ?? err.message,
						errorName: 'Could not sign in'
					} as ErrorDialogComponent.Data
				});
				this.logger.error('Could not sign in', err);
				this.clientService.logout();
				this.oauthService.openedWindow?.close();
			}
		});
	}

ngOnInit(): void {
		this.route.paramMap.pipe(
			takeUntil(this.destroyed),
			map(params => params.get('user') as string),
			switchMap(id => this.restService.v2.GetUser(id, {
				includeEditors: true,
				includeEditorIn: true,
				includeOwnedEmotes: true,
				includeFullEmotes: true,
				includeAuditLogs: true,
				includeStreamData: true
			}, ['banned', 'youtube_id']).pipe(
				map(res => this.dataService.add('user', res.user)[0])
			)),
			tap(user => this.user.next(user)),
			switchMap(user => scheduled([
				user.getEditors().pipe(map(editors => this.editors.next(editors))),
				user.getEditorIn().pipe(map(edited => this.edited.next(edited))),
				user.getYouTubeID().pipe(tap(ytid => this.hasYouTube.next(ytid !== null)), switchMapTo(EMPTY))
			], asyncScheduler).pipe(concatAll(), mapTo(user))),
			tap(user => {
				const appURL = this.document.location.host + this.router.serializeUrl(this.router.createUrlTree(['/users', String(user.id)]));

				this.appService.pageTitleAttr.next([ // Update page title
					{ name: 'User', value: user.getSnapshot()?.display_name ?? '' }
				]);
				const roleName = user.getSnapshot()?.role?.name;
				const roleColor = user.getSnapshot()?.role?.color;
				const emoteCount = user.getSnapshot()?.emotes.length;
				const maxEmoteCount = user.getSnapshot()?.emote_slots;
				const displayName = user.getSnapshot()?.display_name ?? '';
				this.metaService.addTags([
					// { name: 'og:title', content: this.appService.pageTitle },
					// { name: 'og:site_name', content: this.appService.pageTitle },
					{ name: 'og:description', content: `${displayName} is${!!roleName ? ` ${roleName}` : ''} on 7TV with ${emoteCount}/${maxEmoteCount} emotes enabled`},
					{ name: 'og:image', content: user.getSnapshot()?.profile_image_url ?? '' },
					{ name: 'og:image:type', content: 'image/png' },
					{ name: 'theme-color', content: (roleColor ? `#${roleColor.toString(16)}` : '#fff') }
				]);

				if (!AppComponent.isBrowser.getValue()) {
					const link = this.document.createElement('link');
					link.setAttribute('type', 'application/json+oembed');

					const query = new URLSearchParams();
					query.append('object', Buffer.from(JSON.stringify({
						title: this.appService.pageTitle,
						author_name: displayName,
						author_url: `https://${appURL}`,
						provider_name: `7TV.APP - It's like a third party thing`,
						provider_url: 'https://7tv.app'
					})).toString('base64'));
					link.setAttribute('href', `https://${environment.origin}/services/oembed?` + query.toString());
					this.document.head.appendChild(link);
				}
			})
		).subscribe({
			error: (err) => this.loggerService.error('Couldn\'t fetch user', err)
		});
	}

idle$ = createEffect(() =>
    merge(this.clicks$, this.keys$, this.mouse$).pipe(
      switchMapTo(timer(5 * 60 * 1000)), // 5 minute inactivity timeout
      map(() => UserActions.idleTimeout())
    )
  );

selectionBox: Epic = (action$, { store }) => {
	return action$.pipe(
		ofType('backgroundPointerDown'),
		// middle click is panning only
		filter(({ ev }) => !(ev.data.pointerType === 'mouse' && ev.data.button === 1)),
		filter(() => store.editor.mode === EditorMode.select),
		// it's important to use global and not original event
		// because TouchEvents don't have clientX
		pluck('ev', 'data', 'global'),
		map((global) => store.editor.screenToWorld(global)),
		tap((worldPos) => {
			store.editor.startSelectionBox(worldPos);
		}),
		switchMapTo(fromEvent<PointerEvent>(document, 'pointermove').pipe(
			map((ev) => store.editor.screenToWorld({
				x: ev.clientX - store.editor.renderZone.x,
				y: ev.clientY - store.editor.renderZone.y,
			})),
			tap((posInWorld) => {
				store.editor.updateSelectionBox(posInWorld);
			}),
			takeUntil(merge(
				fromEvent<PointerEvent>(document, 'pointerup').pipe(
					map((ev) => isShortcut(ev)),
				),
				fromMobx(() => store.editor.mode).pipe(
					filter((mode) => mode !== EditorMode.select),
					mapTo(false),
				),
			).pipe(
				tap((shortcut) => {
					const entitiesToAdd = store.level.entities.filter((entity: IEntity) => {
						if ('params' in entity && 'asSatCircle' in entity.params) {
							const tester = store.editor.selectionBoxAsSat instanceof Vector ? pointInCircle : testPolygonCircle;
							return tester(
								store.editor.selectionBoxAsSat,
								entity.params.asSatCircle
							);

							store.editor.addEntityToSelection(entity);
						}
						if ('params' in entity && 'asSatPolygons' in entity.params) {
							const tester = store.editor.selectionBoxAsSat instanceof Vector ? pointInPolygon : testPolygonPolygon;
							return entity.params.asSatPolygons
								.some((polygon: Polygon) => tester(store.editor.selectionBoxAsSat, polygon));

						}

						return false;
					});

					if (shortcut) {
						entitiesToAdd.forEach((entity: IEntity) => store.editor.addEntityToSelection(entity));
					} else {
						store.editor.setSelection(entitiesToAdd);
					}

					store.editor.endSelectionBox();
				}),
			)),
		)),
		ignoreElements(),
	);
}