ngOnInit()

in web/frontend/src/app/shared/right-pane/streams-props/streams-props.component.ts [89:231]


  ngOnInit() {
    this.tabSettings$ = this.appStore.pipe(select(getActiveTabSettings));
    this.notView$ = this.appStore.pipe(select(getActiveTab)).pipe(map(tab => !tab?.isView));
    this.isWriter$ = this.permissionsService.isWriter();

    this.tabSettings$
      .pipe(takeUntil(this.destroy$))
      .subscribe((settings: TabSettingsModel) => (this.tabSettings = settings));

    const routeParams$ = this.route.params as Observable<{stream: string; symbol: string}>;
    this.isSymbol$ = routeParams$.pipe(map((tab) => !!tab.symbol));

    this.isSymbol$.pipe(
      filter(isSymbol => !!isSymbol),
      switchMap(() => this.propsSubject),
      takeUntil(this.destroy$)
      ).subscribe(props => {
        this.streamProps = props.filter(prop => !prop.key.includes('symbol'));
        this.symbolProps = props.filter(prop => prop.key.includes('symbol'));
      })

    const props$ = routeParams$.pipe(
      switchMap((tab) => {
        return tab.symbol
          ? this.symbolsService.getProps(tab.stream, tab.symbol)
          : this.streamsService.getProps(tab.stream);
      }),
      shareReplay(1),
    );

    const props = combineLatest([this.globalFiltersService.getFilters(), props$]).pipe(
      distinctUntilChanged(equal),
      filter(([filters, props]) => !!props),
      map(([filters, props]: [GlobalFilters, fromStreamProps.State]) => {
        return this.formatProps(JSON.parse(JSON.stringify(props)).props, filters);
      }),
    );

    this.form = this.fb.group({
      key: [''],
      name: [''], 
      description: '',
    });

    this.periodicityForm = this.fb.group({
      intervalNumber: '',
      timeUnit: '',
      type: '',
    });

    props.pipe(
      tap(props => {
        this.streamId = props.find(item => item.key === 'key')?.value;
        if (!this.streamId) {
          this.errorMessages = null;
        }
        this.props = props;
        this.propsSubject.next(props);
        this.updateFormData();
      }),
      switchMap(() => this.periodicityForm.get('type').valueChanges),
      takeUntil(this.destroy$)
    )
    .subscribe(value => {
      const periodicityProps = this.props.find(prop => prop.key === 'periodicity').children;
      const intervalIndex = periodicityProps.findIndex(child => child.key === 'interval');

      if (value === 'Regular' && this.periodisityType !== value.toUpperCase()) {
        this.periodicityForm.patchValue({ intervalNumber: 1, timeUnit: 'Day' }, );
        periodicityProps[intervalIndex] = {
          ...periodicityProps[intervalIndex],
          value: '1 DAY'
        }
      }
      this.updateValidationErrors('interval', '');
      this.updateValidationErrors('timeUnit', '');
      this.periodisityType = value?.toUpperCase();
      if (!['REGULAR', 'IRREGULAR', 'STATIC'].includes(this.periodisityType)) {
        this.updateValidationErrors('interval', "Periodicity type must be 'Regular', 'Irregular' or 'Static'");
      }
    });

    this.periodicityForm.get('intervalNumber').valueChanges
      .pipe(takeUntil(this.destroy$))
      .subscribe(value => {
        this.updateValidationErrors('interval', '');
        if (value === null) {
          this.updateValidationErrors('interval', 'Periodicity Interval is required');
        } else if (value !== null && value < 1) {
          this.updateValidationErrors('interval', 'Periodicity Interval cannot be less than 1');
        } else if (value !== null && value % 1) {
          this.updateValidationErrors('interval', 'Periodicity Interval must be an integer');
        }
        if (this.periodisityType !== 'REGULAR') {
          this.updateValidationErrors('interval', '');
        }
      });

    this.periodicityForm.get('timeUnit').valueChanges
      .pipe(takeUntil(this.destroy$))
      .subscribe(value => {
        this.updateValidationErrors('timeUnit', '');
        if (!value) {
          this.updateValidationErrors('timeUnit', 'Time Unit is required');
        }
        if (this.periodisityType !== 'REGULAR') {
          this.updateValidationErrors('timeUnit', '');
        }
      });

    ['name', 'key'].forEach(key => {
      this.form.get(key).valueChanges
        .pipe(takeUntil(this.destroy$))
        .subscribe(value => {
          this.updateValidationErrors(key, '');
          if (!value && this.streamId) {
            this.updateValidationErrors(key, `${key} is required`);
          }
        })
    })

    const info$ = this.appStore.pipe(
      select(getActiveTab),
      filter(t => !!t),
      distinctUntilChanged((t1, t2) => t1.id === t2.id),
      switchMap(tab => this.viewsService.get(tab.streamName)),
    );

    this.infoFormatted$ = combineLatest([
      info$,
      this.globalFiltersService.getFilters(),
    ]).pipe(map(([info, filters]) => {
      return {
        ...info,
        lastTimestampFormatted: info.lastTimestamp > 0 ? formatHDate(
          new Date(info.lastTimestamp).toISOString(),
          filters.dateFormat,
          filters.timeFormat,
          filters.timezone,
        ) : null,
      };
    }));
  }