Angular - URL State Management mapTableData.ts

  /**
   * Maps Employees to mat-table data format
   *
   * @author Pavan Kumar Jadda
   * @since 1.0.0
   */
  private mapTableData(data: UserData[]) {
    this.dataSource = new MatTableDataSource<UserData>(data);
    if (this.optionalParamsPresent()) {
      this.sort.active =
        this.route.snapshot.queryParamMap.get('sortBy') ?? 'id';
      //@ts-ignore
      this.sort.direction =
        this.route.snapshot.queryParamMap.get('sortDirection') ?? 'desc';
      this.paginator.pageIndex =
        Number.parseInt(
          this.route.snapshot.queryParamMap.get('pageIndex') as string,
          10
        ) ?? 0;
      this.paginator.pageSize =
        Number.parseInt(
          this.route.snapshot.queryParamMap.get('pageSize') as string,
          10
        ) ?? 10;
      this.searchTextControl.patchValue(
        this.route.snapshot.queryParamMap.get('searchText') ?? ''
      );
      this.dataSource.filter =
        this.route.snapshot.queryParamMap.get('searchText') ?? '';
      this.dataSource.sort = this.sort;
      this.dataSource.paginator = this.paginator;
      this.cdr.detectChanges();
    } else {
      this.dataSource.sort = this.sort;
      this.dataSource.paginator = this.paginator;
    }
  }