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),
);
}