ngOnInit()

in web/frontend/src/app/shared/right-pane/message-info/message-info.component.ts [96:225]


  ngOnInit() {
    this.tab$ = this.appStore.pipe(
      select(getActiveTab),
      filter((t) => !!t),
    );

    this.canShowOrderBook$ = this.tab$.pipe(
      map((tab) => tab.chartType?.includes(ChartTypes.PRICES_L2)),
    );

    this.tab$
      .pipe(
        distinctUntilChanged((t1, t2) => t1.id === t2.id),
        takeUntil(this.destroy$),
      )
      .subscribe(() => {
        this.tabSwitching$.next(true);
        this.hideOrderBook$.next(true);
      });

    this.message$ = this.tabStorageService.flow<HasRightPanel>('rightPanel').getData(['selectedMessage'])

    this.props$ = combineLatest([
      this.message$,
      this.messageInfoService.onColumns(),
      this.globalFiltersService.getFilters(),
    ]).pipe(
      map(([data, columns]) => {
        return this.getProps(data.selectedMessage, columns)
          .filter(prop => prop.key !== 'time' && !(prop.key === 'nanoTime' && !prop.value));
      })
    );

    this.editorValue$ = this.message$.pipe(
      map((message) => JSON.stringify(message.selectedMessage, null, '\t')),
    );

    const storageMessageView$ = this.tabStorageService
      .flow<HasRightPanel>('rightPanel')
      .getData(['messageView'])
      .pipe(map((data) => data?.messageView || 'view'));

    storageMessageView$.pipe(takeUntil(this.destroy$)).subscribe((messageView) => {
      this.viewControl.patchValue(messageView, {emitEvent: false});
    });

    this.viewControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((messageView) => {
      this.tabSwitching$.next(true);
      this.hideOrderBook$.next(true);
      this.tabStorageService.flow<HasRightPanel>('rightPanel').updateDataSync((data) => ({...data, messageView}));
    });

    this.orderBookStreams$ = this.tab$.pipe(map((tab) => [tab.stream]));
    this.orderBookSymbol$ = this.message$.pipe(map((message) => message.selectedMessage?.symbol));
    combineLatest([
      this.message$.pipe(filter((data) => !!data.selectedMessage)),
      storageMessageView$,
    ])
      .pipe(
        filter(([message, view]) => view === 'orderBook'),
        withLatestFrom(this.tab$),
      )
      .pipe(
        debounceTime(100),
        switchMap(([[message], tab]) => {
          this.tabSwitching$.next(false);

          if (message.selectedMessage.symbol !== this.feedSymbol$.getValue()) {
            this.hideOrderBook$.next(true);
            this.orderBookFeed$.next(null);
          }
          const params = {
            streams: [tab.stream],
            symbol: message.selectedMessage?.symbol,
            types: tab.filter.filter_types || null,
            symbols: tab.symbol ? [tab.symbol] : tab.filter.filter_symbols || null,
            from: message.from,
            offset: message.rowIndex,
            reverse: tab.reverse,
          };

          if (tab.space !== undefined) {
            params['space'] = tab.space;
          }
          return this.httpClient
            .post<IL2Package>('/order-book', params)
            .pipe(map((feed) => ({feed, symbol: message.selectedMessage?.symbol})));
        }),
        takeUntil(this.destroy$),
      )
      .subscribe(({feed, symbol}) => {
        this.feedSymbol$.next(symbol);
        this.orderBookFeed$.next(feed);
      });

    this.showOrderBook$ = combineLatest([
      this.orderBookStreams$,
      this.orderBookSymbol$,
      this.orderBookFeed$,
    ]).pipe(map(([streams, symbols, feed]) => !!streams && !!symbols && !!feed?.entries.length));

    this.showOrderBook$.pipe(takeUntil(this.destroy$)).subscribe((show) => {
      if (!show) {
        this.hideOrderBook$.next(true);
      }
    });

    this.showLoader$ = combineLatest([this.orderBookFeed$, this.hideOrderBook$]).pipe(
      map(([feed, hide]) => (feed === null && !!hide) || (!!hide && !!feed?.entries.length)),
      startWith(true),
    );

    this.orderBookNoData$ = this.orderBookFeed$.pipe(map((feed) => feed?.entries.length === 0));
    this.orderBookError$ = this.orderBookFeed$.pipe(
      map((feed) => {
        return feed?.entries.length === 0 ? feed['error'] || 'rightPanel.noMessageSelected' : null;
      }),
    );

    this.feedFiltered$ = combineLatest([
      this.orderBookFeed$,
      this.orderBookSymbol$,
      this.feedSymbol$,
    ]).pipe(
      debounceTime(0),
      filter(([feed]) => !!feed),
      filter(([feed, symbol, gotSymbol]) => symbol === gotSymbol),
      map(([feed, symbol]) => feed),
    );
  }