From b5be7d397124ac871c8faa1c338080f2f8264e97 Mon Sep 17 00:00:00 2001 From: squidfunk Date: Sun, 26 Apr 2020 17:22:55 +0200 Subject: [PATCH] Added search status to observable --- .../javascripts/components/search/_/index.ts | 52 ++++++++++++++++--- .../components/search/query/react/index.ts | 2 +- .../components/search/result/_/index.ts | 4 +- .../javascripts/components/toc/_/index.ts | 2 +- src/assets/javascripts/index.ts | 2 +- 5 files changed, 51 insertions(+), 11 deletions(-) diff --git a/src/assets/javascripts/components/search/_/index.ts b/src/assets/javascripts/components/search/_/index.ts index 7e7833afc..c75f287a3 100644 --- a/src/assets/javascripts/components/search/_/index.ts +++ b/src/assets/javascripts/components/search/_/index.ts @@ -21,9 +21,20 @@ */ import { Observable, OperatorFunction, combineLatest, pipe } from "rxjs" -import { map, switchMap } from "rxjs/operators" +import { + filter, + map, + mapTo, + startWith, + switchMap +} from "rxjs/operators" -import { SearchResult } from "integrations/search" +import { WorkerHandler } from "browser" +import { + SearchMessage, + SearchResult, + isSearchReadyMessage +} from "integrations/search" import { SearchQuery } from "../query" @@ -31,10 +42,20 @@ import { SearchQuery } from "../query" * Types * ------------------------------------------------------------------------- */ +/** + * Search status + */ +export type SearchStatus = + | "waiting" /* Search waiting for initialization */ + | "ready" /* Search ready */ + +/* ------------------------------------------------------------------------- */ + /** * Search */ export interface Search { + status: SearchStatus /* Search status */ query: SearchQuery /* Search query */ result: SearchResult[] /* Search result list */ } @@ -59,18 +80,35 @@ interface MountOptions { /** * Mount search from source observable * + * @param handler - Worker handler * @param options - Options * * @return Operator function */ export function mountSearch( + { rx$ }: WorkerHandler, { query$, reset$, result$ }: MountOptions ): OperatorFunction { return pipe( - switchMap(() => combineLatest([query$, result$, reset$]) - .pipe( - map(([query, result]) => ({ query, result })) - ) - ) + switchMap(() => { + + /* Compute search status */ + const status$ = rx$ + .pipe( + filter(isSearchReadyMessage), + mapTo("ready"), + startWith("waiting") + ) as Observable + + /* Combine into single observable */ + return combineLatest([status$, query$, result$, reset$]) + .pipe( + map(([status, query, result]) => ({ + status, + query, + result + })) + ) + }) ) } diff --git a/src/assets/javascripts/components/search/query/react/index.ts b/src/assets/javascripts/components/search/query/react/index.ts index baa6c70f6..97e693f68 100644 --- a/src/assets/javascripts/components/search/query/react/index.ts +++ b/src/assets/javascripts/components/search/query/react/index.ts @@ -78,7 +78,7 @@ export function watchSearchQuery( /* Intercept focus events */ const focus$ = watchElementFocus(el) - /* Combine into a single observable */ + /* Combine into single observable */ return combineLatest([value$, focus$]) .pipe( map(([value, focus]) => ({ value, focus })) diff --git a/src/assets/javascripts/components/search/result/_/index.ts b/src/assets/javascripts/components/search/result/_/index.ts index d42e9520b..3f7b2dfd9 100644 --- a/src/assets/javascripts/components/search/result/_/index.ts +++ b/src/assets/javascripts/components/search/result/_/index.ts @@ -27,6 +27,7 @@ import { filter, map, pluck, + startWith, switchMap } from "rxjs/operators" @@ -85,7 +86,8 @@ export function mountSearchResult( .pipe( filter(isSearchResultMessage), pluck("data"), - applySearchResult(el, { query$, fetch$ }) + applySearchResult(el, { query$, fetch$ }), + startWith([]) ) }) ) diff --git a/src/assets/javascripts/components/toc/_/index.ts b/src/assets/javascripts/components/toc/_/index.ts index c59aee846..600b28dca 100644 --- a/src/assets/javascripts/components/toc/_/index.ts +++ b/src/assets/javascripts/components/toc/_/index.ts @@ -119,7 +119,7 @@ export function mountTableOfContents( applyAnchorList(els) ) - /* Combine into a single hot observable */ + /* Combine into single hot observable */ return combineLatest([sidebar$, anchors$]) .pipe( map(([sidebar, anchors]) => ({ sidebar, anchors })) diff --git a/src/assets/javascripts/index.ts b/src/assets/javascripts/index.ts index cdc6648b8..c066e64a2 100644 --- a/src/assets/javascripts/index.ts +++ b/src/assets/javascripts/index.ts @@ -280,7 +280,7 @@ export function initialize(config: unknown) { const search$ = useComponent("search") .pipe( - mountSearch({ query$, reset$, result$ }), + mountSearch(worker, { query$, reset$, result$ }), shareReplay(1) )