private gridIsReady()

in web/frontend/src/app/pages/streams/modules/monitor-log/components/monitor-log-grid/monitor-log-grid.component.ts [211:412]


  private gridIsReady(readyEvent: GridReadyEvent) {
    this.readyApi = {...readyEvent};
    this.gridReady$.next(readyEvent);
    this.gridService.setTooltipDelay(readyEvent);
    
    const tab$ = this.appStore.pipe(
      select(getActiveOrFirstTab),
      filter((tab: TabModel) => tab && tab.monitor),
      distinctUntilChanged((prevTabModel: TabModel, nextTabModel: TabModel) => {
        const PREV = new TabModel(prevTabModel);
        const NEXT = new TabModel(nextTabModel);
        delete PREV.tabSettings;
        delete NEXT.tabSettings;
        return Diff(PREV, NEXT);
      }),
    );
    
    this.appStore
      .pipe(
        select(getActiveTabFilters),
        filter((filter) => !!filter),
        takeUntil(this.destroy$),
      )
      .subscribe((filter: FilterModel) => {
        this.tabFilter = {...filter};
      });
    
    this.schema$ = tab$.pipe(
      tap(() => {
        this.loaded$.next(false);
        this.error$.next(null);
      }),
      switchMap(tab => this.schemaService.getSchema(tab.stream, null, true).pipe(
        catchError(e => {
          this.error$.next(e);
          return of(null);
        }),
        filter(s => !!s),
      )),
      tap(() => this.loaded$.next(true)),
    );
    
    this.schema$.pipe(
      switchMap(schema => this.tabName$.pipe(filter(t => !!t)).pipe(map(tabName => [schema, tabName]), take(1))),
      takeUntil(this.destroy$),
    ).subscribe(([schema, tabName]) => {
      if (!schema.types) {
        return;
      }
      
      this.schemaMap = this.streamModelsService.getSchemaMap(schema.all);
      
      if (schema.types?.length) {
        this.schema = [...schema.types];
      }
      const hideAllColumns = false;
      const props = [
        columnsVisibleColumn(),
        {
          headerName: 'Symbol',
          field: 'symbol',
          tooltipField: 'symbol',
          pinned: 'left',
          filter: false,
          sortable: false,
          width: 100,
          headerTooltip: 'Symbol',
        },
        {
          headerName: 'Timestamp',
          field: 'timestamp',
          pinned: 'left',
          filter: false,
          sortable: false,
          sort: 'desc',
          comparator: (valueA, valueB, nodeA, nodeB, isInverted) => {
            let VALUE = new Date(valueA).getTime() - new Date(valueB).getTime();
            if (isInverted) VALUE = -1 * VALUE;
            if (VALUE > 0) {
              return -1;
            } else if (VALUE === 0) {
              return 0;
            }
            return 1;
          },
          width: 180,
          headerTooltip: 'Timestamp',
          cellRenderer: (params: ICellRendererParams) => this.gridService.dateFormat(params, params.data?.nanoTime, true),
          tooltipValueGetter: (params: ICellRendererParams) => this.gridService.dateFormat(params, params.data?.nanoTime, true),
        },
        {
          headerName: 'Type',
          field: '$type',
          pinned: 'left',
          filter: false,
          sortable: false,
          headerTooltip: 'Type',
          hide: true,
        },
        ...this.gridService.columnFromSchema(
          this.streamModelsService.getSchemaForColumns(
            schema.types,
            schema.all,
          ),
          hideAllColumns,
        ),
      ];
      readyEvent.api.setColumnDefs(null);
      readyEvent.api.setColumnDefs(props);
      this.gridStateLS = gridStateLSInit(readyEvent.columnApi, tabName, this.gridStateLS);
      this.gridContextMenuService.addColumnSizeMenuItems(() => this.gridStateLS, () => this.subIsInited, tabName);
  
      this.messageInfoService.setGridApi(this.readyApi);
      
      if (
        this.tabFilter &&
        this.tabFilter.filter_types &&
        this.readyApi &&
        this.readyApi.columnApi &&
        this.readyApi.columnApi.getAllColumns() &&
        this.readyApi.columnApi.getAllColumns().length
      ) {
        const columns = [...this.readyApi.columnApi.getAllColumns()];
        const filter_types_arr = this.tabFilter.filter_types;
        const columnsVisible = [];
        for (let j = 0; j < filter_types_arr.length; j++) {
          for (let i = 0; i < columns.length; i++) {
            if (
              String(columns[i]['colId']).indexOf(
                String(filter_types_arr[j]).replace(/\./g, '-'),
              ) !== -1
            ) {
              columnsVisible.push(columns[i]['colId']);
            } else if (
              columns[i]['colId'] !== '0' &&
              columns[i]['colId'] !== 'symbol' &&
              columns[i]['colId'] !== 'timestamp'
            ) {
              this.readyApi.columnApi.setColumnVisible(columns[i]['colId'], false);
            }
          }
        }
        for (const col of columnsVisible) {
          this.readyApi.columnApi.setColumnVisible(col, true);
        }
      }
    });
    
    tab$
      .pipe(takeUntil(this.destroy$), distinctUntilChanged())
      .subscribe((tab: TabModel) => {
        this.tabData = tab;
        if (tab.symbol) {
          this.symbolName = tab.symbol;
        }
        if (tab.id) {
          this.tabName$.next(tab.stream + tab.id);
        }
        if (this.subscribeTimer) {
          clearTimeout(this.subscribeTimer);
          delete this.subscribeTimer;
        }
        this.cleanWebsocketSubscription();
        
        this.subscribeTimer = setTimeout(() => {
          const socketData: WSLiveModel = {
            fromTimestamp: null,
          };
          
          if (tab.symbol) {
            socketData.symbols = [tab.symbol];
          }
          if (tab.space) {
            socketData.space = tab.space;
          }
          
          if (tab.filter.filter_symbols && tab.filter.filter_symbols.length) {
            socketData.symbols = tab.filter.filter_symbols;
          }
          if (tab.filter.filter_types && tab.filter.filter_types.length) {
            socketData.types = tab.filter.filter_types;
          }
          
          this.monitorLogGridDataService?.destroy();
          
          this.subIsInited = true;
          this.monitorLogGridDataService
            .getSubscription(
              `/user/topic/monitor/${escape(tab.stream)}`,
              socketData,
              this.schemaMap,
            )
            .pipe(takeUntil(this.destroy$))
            .subscribe(({data, newDataLength}) => {
              this.readyApi.api.setRowData(data);
              if (newDataLength) {
                this.flashRows(this.readyApi.api, newDataLength);
              }
            });
        }, 500);
      });
  }