@pega/dx-component-builder-sdk 24.1.10 → 24.1.12

package/tests/assets/sdk-a/components/create/override-sdk/field/time/time.component.html

@@ -12,6 +12,7 @@
           type="time"
           [value]="value$"
           [required]="bRequired$"
+          [attr.data-test-id]="testId"
           [formControl]="fieldControl"
           (change)="fieldOnChange($event)"
           (blur)="fieldOnBlur($event)"

package/tests/assets/sdk-a/components/create/override-sdk/field/time/time.component.ts

@@ -36,6 +36,7 @@ export class TimeComponent implements OnInit, OnDestroy {
   bVisible$ = true;
   displayMode$?: string = '';
   controlName$: string;
+  testId = '';
   bHasForm$ = true;
   componentReference = '';
   helperText: string;
@@ -100,6 +101,7 @@ export class TimeComponent implements OnInit, OnDestroy {
     // moved this from ngOnInit() and call this from there instead...
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as TimeProps;
 
+    this.testId = this.configProps$.testId;
     this.label$ = this.configProps$.label;
     this.displayMode$ = this.configProps$.displayMode;
 

package/tests/assets/sdk-a/components/create/override-sdk/field/url/url.component.html

@@ -12,6 +12,7 @@
           type="url"
           [value]="value$"
           [required]="bRequired$"
+          [attr.data-test-id]="testId"
           [formControl]="fieldControl"
           (change)="fieldOnChange($event)"
           (blur)="fieldOnBlur($event)"

package/tests/assets/sdk-a/components/create/override-sdk/field/url/url.component.ts

@@ -36,6 +36,7 @@ export class UrlComponent implements OnInit, OnDestroy {
   bVisible$ = true;
   displayMode$?: string = '';
   controlName$: string;
+  testId = '';
   bHasForm$ = true;
   componentReference = '';
   helperText: string;
@@ -106,6 +107,7 @@ export class UrlComponent implements OnInit, OnDestroy {
       this.value$ = this.configProps$.value;
     }
 
+    this.testId = this.configProps$.testId;
     this.label$ = this.configProps$.label;
     this.displayMode$ = this.configProps$.displayMode;
     this.helperText = this.configProps$.helperText;

package/tests/assets/sdk-a/components/create/override-sdk/field/user-reference/user-reference.component.html

@@ -1,48 +1,53 @@
 <div class="psdk-user-reference">
-  <div *ngIf="type === 'operator'">
-    <component-mapper name="Operator" [props]="{ pConn$ }"></component-mapper>
-  </div>
-  <div [formGroup]="formGroup$" *ngIf="type === 'dropdown'">
-    <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
-      <mat-select
-        [value]="value$"
-        [required]="bRequired$"
-        [formControl]="fieldControl"
-        [attr.data-test-id]="testId"
-        (selectionChange)="fieldOnChange($event)"
-      >
-        <mat-option *ngFor="let opt of options$" [value]="opt.key">
-          {{ opt.value }}
-        </mat-option>
-      </mat-select>
-      <mat-label>{{ label$ }}</mat-label>
-      <mat-error *ngIf="fieldControl.invalid">
-        {{ getErrorMessage() }}
-      </mat-error>
-    </mat-form-field>
-  </div>
-  <div [formGroup]="formGroup$" *ngIf="type === 'searchbox'">
-    <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
-      <mat-label>{{ label$ }}</mat-label>
-      <input
-        matInput
-        [placeholder]="placeholder"
-        [formControl]="fieldControl"
-        [value]="value$"
-        [required]="bRequired$"
-        [matAutocomplete]="auto"
-        [attr.data-test-id]="testId"
-        (change)="fieldOnChange($event)"
-        (blur)="fieldOnBlur($event)"
-      />
-      <mat-autocomplete #auto="matAutocomplete">
-        <mat-option *ngFor="let opt of options$" [value]="opt.value">
-          <span>{{ opt.value }}</span>
-        </mat-option>
-      </mat-autocomplete>
-      <mat-error *ngIf="fieldControl.invalid">
-        {{ getErrorMessage() }}
-      </mat-error>
-    </mat-form-field>
+  <div *ngIf="displayMode$; else noDisplayMode">
+    <component-mapper name="FieldValueList" [props]="{ label$, value$, displayMode$ }"></component-mapper>
   </div>
+  <ng-template #noDisplayMode>
+    <div *ngIf="type === 'operator'">
+      <component-mapper name="Operator" [props]="{ pConn$ }"></component-mapper>
+    </div>
+    <div [formGroup]="formGroup$" *ngIf="type === 'dropdown'">
+      <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
+        <mat-select
+          [value]="value$"
+          [required]="bRequired$"
+          [formControl]="fieldControl"
+          [attr.data-test-id]="testId"
+          (selectionChange)="fieldOnChange($event)"
+        >
+          <mat-option *ngFor="let opt of options$" [value]="opt.key">
+            {{ opt.value }}
+          </mat-option>
+        </mat-select>
+        <mat-label>{{ label$ }}</mat-label>
+        <mat-error *ngIf="fieldControl.invalid">
+          {{ getErrorMessage() }}
+        </mat-error>
+      </mat-form-field>
+    </div>
+    <div [formGroup]="formGroup$" *ngIf="type === 'searchbox'">
+      <mat-form-field class="psdk-full-width" subscriptSizing="dynamic" [hintLabel]="helperText">
+        <mat-label>{{ label$ }}</mat-label>
+        <input
+          matInput
+          [placeholder]="placeholder"
+          [formControl]="fieldControl"
+          [value]="value$"
+          [required]="bRequired$"
+          [matAutocomplete]="auto"
+          [attr.data-test-id]="testId"
+          (change)="fieldOnChange($event)"
+          (blur)="fieldOnBlur($event)"
+        />
+        <mat-autocomplete #auto="matAutocomplete">
+          <mat-option *ngFor="let opt of filteredOptions | async" [value]="opt.value">
+            <span>{{ opt.value }}</span>
+          </mat-option>
+        </mat-autocomplete>
+        <mat-error *ngIf="fieldControl.invalid">
+          {{ getErrorMessage() }}
+        </mat-error>
+      </mat-form-field>
+    </div>
+  </ng-template>
 </div>

package/tests/assets/sdk-a/components/create/override-sdk/field/user-reference/user-reference.component.ts

@@ -10,6 +10,7 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { Utils } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 import { PConnFieldProps } from '@pega/angular-sdk-components';
+import { map, Observable, startWith } from 'rxjs';
 
 const OPERATORS_DP = 'D_pyGetOperatorsForCurrentApplication';
 const DROPDOWN_LIST = 'Drop-down list';
@@ -57,6 +58,9 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
   testId: string;
   helperText: string;
   placeholder: string;
+  displayMode$?: string;
+  filteredOptions: Observable<any[]>;
+  filterValue = '';
 
   fieldControl = new FormControl('', null);
 
@@ -65,19 +69,24 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
     private utils: Utils
   ) {}
 
-  ngOnInit(): void {
+  async ngOnInit(): Promise<void> {
     // First thing in initialization is registering and subscribing to the AngularPConnect service
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
 
     this.controlName$ = this.angularPConnect.getComponentID(this);
 
-    this.checkAndUpdate();
+    await this.checkAndUpdate();
 
     if (this.formGroup$) {
       // add control to formGroup
       this.formGroup$.addControl(this.controlName$, this.fieldControl);
       this.fieldControl.setValue(this.value$);
     }
+
+    this.filteredOptions = this.fieldControl.valueChanges.pipe(
+      startWith(''),
+      map(value => this._filter(value || ''))
+    );
   }
 
   ngOnDestroy() {
@@ -105,32 +114,38 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
   }
 
   // Callback passed when subscribing to store change
-  onStateChange() {
-    this.checkAndUpdate();
+  async onStateChange() {
+    await this.checkAndUpdate();
+  }
+
+  private _filter(value: string): string[] {
+    const filterVal = (value || this.filterValue).toLowerCase();
+    return this.options$?.filter(option => option.value?.toLowerCase().includes(filterVal));
   }
 
-  checkAndUpdate() {
+  async checkAndUpdate() {
     // Should always check the bridge to see if the component should
     // update itself (re-render)
     const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
 
     // ONLY call updateSelf when the component should update
     if (bUpdateSelf) {
-      this.updateSelf();
+      await this.updateSelf();
     }
   }
 
-  updateSelf() {
+  async updateSelf() {
     const props = this.pConn$.getConfigProps() as UserReferenceProps;
     this.testId = props.testId;
 
-    const { label, displayAs, value, showAsFormattedText, helperText, placeholder } = props;
+    const { label, displayAs, value, showAsFormattedText, helperText, placeholder, displayMode } = props;
 
     this.label$ = label;
     this.showAsFormattedText$ = showAsFormattedText;
     this.displayAs$ = displayAs;
     this.helperText = helperText;
     this.placeholder = placeholder || '';
+    this.displayMode$ = displayMode;
 
     const { readOnly, required } = props;
     [this.bReadonly$, this.bRequired$] = [readOnly, required].map(prop => prop === true || (typeof prop === 'string' && prop === 'true'));
@@ -158,18 +173,18 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
       const queryPayload = {
         dataViewName: OPERATORS_DP
       };
-      PCore.getRestClient()
-        .invokeRestApi('getListData', { queryPayload } as any, '') // 3rd arg empty string until typedef marked correctly
-        .then((resp: any) => {
+      try {
+        const resp: any = await PCore.getRestClient().invokeRestApi('getListData', { queryPayload } as any, ''); // 3rd arg empty string until typedef marked correctly
+        if (resp?.data) {
           const ddDataSource = resp.data.data.map(listItem => ({
             key: listItem.pyUserIdentifier,
             value: listItem.pyUserName
           }));
           this.options$ = ddDataSource;
-        })
-        .catch(err => {
-          console.log(err);
-        });
+        }
+      } catch (error) {
+        console.log(error);
+      }
     }
   }
 
@@ -177,6 +192,9 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
     if (event?.value === 'Select') {
       event.value = '';
     }
+    if (event?.target) {
+      this.filterValue = (event.target as HTMLInputElement).value;
+    }
     this.angularPConnectData.actions?.onChange(this, event);
   }
 

package/tests/assets/sdk-a/components/create/override-sdk/infra/assignment/assignment.component.ts

@@ -38,7 +38,6 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   newPConn$: any;
   containerName$: string;
 
-  bIsRefComponent = false;
   bInitialized = false;
 
   templateName$: string;
@@ -60,6 +59,8 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   cancelAssignment: any;
   cancelCreateStageAssignment: any;
   showPage: any;
+  approveCase: any;
+  rejectCase: any;
 
   // itemKey: string = "";   // JA - this is what Nebula/Constellation uses to pass to finishAssignment, navigateToStep
 
@@ -127,45 +128,19 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   updateChanges() {
-    this.bIsRefComponent = this.checkIfRefComponent(this.pConn$);
-
-    this.ngZone.run(() => {
-      // pConn$ may be a 'reference' component, so normalize it
-      // this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-      this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
-
-      //  If 'reference' so we need to get the children of the normalized pConn
-      if (this.bIsRefComponent) {
-        // this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
-        this.arChildren$ = ReferenceComponent.normalizePConnArray(this.newPConn$.getChildren());
-      }
-    });
-
-    this.createButtons();
-  }
+    // pConn$ may be a 'reference' component, so normalize it
+    this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
 
-  checkIfRefComponent(thePConn: any): boolean {
-    let bReturn = false;
-    if (thePConn && thePConn.getComponentName() == 'reference') {
-      bReturn = true;
+    if (this.arChildren$) {
+      this.createButtons();
     }
-
-    return bReturn;
   }
 
   initComponent() {
-    this.bIsRefComponent = this.checkIfRefComponent(this.pConn$);
-
     // pConn$ may be a 'reference' component, so normalize it
     // this.pConn$ = ReferenceComponent.normalizePConn(this.pConn$);
     this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
 
-    // If 'reference' so we need to get the children of the normalized pConn
-    if (this.bIsRefComponent) {
-      // this.arChildren$ = ReferenceComponent.normalizePConnArray(this.pConn$.getChildren());
-      this.arChildren$ = ReferenceComponent.normalizePConnArray(this.newPConn$.getChildren());
-    }
-
     // prevent re-intializing with flowContainer update unless an action is taken
     this.bReInit = false;
     this.bHasNavigation$ = false;
@@ -205,8 +180,12 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
     this.showPage = actionsAPI.showPage.bind(actionsAPI);
 
     this.cancelCreateStageAssignment = actionsAPI.cancelCreateStageAssignment.bind(actionsAPI);
+    this.approveCase = actionsAPI.approveCase?.bind(actionsAPI);
+    this.rejectCase = actionsAPI.rejectCase?.bind(actionsAPI);
 
-    this.createButtons();
+    if (this.arChildren$) {
+      this.createButtons();
+    }
   }
 
   createButtons() {
@@ -353,8 +332,8 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
           savePromise
             .then(() => {
+              // @ts-ignore - Property 'c11nEnv' is private and only accessible within class 'CaseInfo'.
               const caseType = this.pConn$.getCaseInfo().c11nEnv.getValue(PCore.getConstants().CASE_INFO.CASE_TYPE_ID);
-              // @ts-ignore - second parameter “payload” for publish method should be optional
               PCore.getPubSubUtils().publish('cancelPressed');
               this.onSaveActionSuccess({ caseType, caseID, assignmentID });
             })
@@ -369,12 +348,9 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
         case 'cancelAssignment':
           this.bReInit = true;
           this.erService.sendMessage('dismiss', '');
-          // @ts-ignore - Property 'isAssignmentInCreateStage' is private and only accessible within class 'CaseInfo'
           const isAssignmentInCreateStage = this.pConn$.getCaseInfo().isAssignmentInCreateStage();
           const isLocalAction =
-            // @ts-ignore - Property 'isLocalAction' is private and only accessible within class 'CaseInfo'.
             this.pConn$.getCaseInfo().isLocalAction() ||
-            // @ts-ignore - second parameter pageReference for getValue method should be optional
             (PCore.getConstants().CASE_INFO.IS_LOCAL_ACTION && this.pConn$.getValue(PCore.getConstants().CASE_INFO.IS_LOCAL_ACTION));
           // check if create stage (modal)
           if (isAssignmentInCreateStage && this.isInModal$ && !isLocalAction) {
@@ -394,14 +370,12 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
             // publish before cancel pressed, because
             // cancel assignment happens "after" cancel assignment happens
-            // @ts-ignore - second parameter “payload” for publish method should be optional
             PCore.getPubSubUtils().publish('cancelPressed');
 
             const cancelPromise = this.cancelAssignment(this.itemKey$);
             cancelPromise
               .then(() => {
                 this.psService.sendMessage(false);
-                // @ts-ignore - second parameter “payload” for publish method should be optional
                 PCore.getPubSubUtils().publish(PCore.getConstants().PUB_SUB_EVENTS.EVENT_CANCEL);
               })
               .catch(() => {
@@ -411,11 +385,23 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
           }
           break;
 
+        case 'rejectCase': {
+          const rejectPromise = this.rejectCase(this.itemKey$);
+
+          rejectPromise
+            .then(() => {})
+            .catch(() => {
+              this.psService.sendMessage(false);
+              this.snackBar.open(`${this.localizedVal('Rejection failed!', this.localeCategory)}`, 'Ok');
+            });
+
+          break;
+        }
+
         default:
           break;
       }
     } else if (sButtonType == 'primary') {
-      // eslint-disable-next-line sonarjs/no-small-switch
       switch (sAction) {
         case 'finishAssignment':
           this.erService.sendMessage('publish', '');
@@ -437,6 +423,19 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
             this.erService.sendMessage('show', this.localizedVal('Please fix errors on form.', this.localeCategory));
           }
           break;
+
+        case 'approveCase': {
+          const approvePromise = this.approveCase(this.itemKey$);
+
+          approvePromise
+            .then(() => {})
+            .catch(() => {
+              this.psService.sendMessage(false);
+              this.snackBar.open(`${this.localizedVal('Approve failed!', this.localeCategory)}`, 'Ok');
+            });
+
+          break;
+        }
         default:
           break;
       }

package/tests/assets/sdk-a/components/create/override-sdk/infra/dashboard-filter/dashboard-filter.component.html

@@ -0,0 +1,35 @@
+<div
+  [ngClass]="{
+    'psdk-block-style': inlineProps.filterPosition === 'block-start'
+  }"
+>
+  <div *ngFor="let kid of children">
+    <div *ngIf="kid.type === 'DateTime'" [formGroup]="filtersFormGroup$">
+      <mat-form-field class="psdk-full-width">
+        <mat-label>{{ kid.label }}</mat-label>
+        <mat-date-range-input [rangePicker]="picker">
+          <input matStartDate placeholder="Start date" formControlName="start" />
+          <input matEndDate placeholder="End date" formControlName="end" (dateChange)="dateRangeChangeHandler(kid)" />
+        </mat-date-range-input>
+        <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+        <mat-date-range-picker #picker></mat-date-range-picker>
+      </mat-form-field>
+    </div>
+    <div *ngIf="kid.c11nEnv">
+      <span (input)="updateTmpData({ event: $event, field: kid })">
+        <component-mapper
+          [name]="kid.c11nEnv.getPConnect().getComponentName()"
+          [props]="{
+            pConn$: kid.c11nEnv.getPConnect(),
+            formGroup$: filtersFormGroup$
+          }"
+          errorMsg="Dashboard filter wants component not yet available: {{ kid.c11nEnv.getPConnect().getComponentName() }}"
+        >
+        </component-mapper>
+      </span>
+    </div>
+  </div>
+  <div>
+    <button mat-button color="primary" (click)="clearFilters()">Clear All</button>
+  </div>
+</div>

package/tests/assets/sdk-a/components/create/override-sdk/infra/dashboard-filter/dashboard-filter.component.scss

@@ -0,0 +1,14 @@
+.psdk-full-width {
+  width: 100%;
+}
+
+.psdk-block-style {
+  display: grid;
+  direction: column-reverse;
+  gap: 1rem;
+  grid-template-columns: repeat(7, 1fr);
+}
+
+::ng-deep .mat-mdc-form-field-subscript-wrapper {
+  height: 0;
+}

package/tests/assets/sdk-a/components/create/override-sdk/infra/dashboard-filter/dashboard-filter.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+
+import { DashboardFilterComponent } from './dashboard-filter.component';
+
+describe('DashboardFilterComponent', () => {
+  let component: DashboardFilterComponent;
+  let fixture: ComponentFixture<DashboardFilterComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [DashboardFilterComponent]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DashboardFilterComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/tests/assets/sdk-a/components/create/override-sdk/infra/dashboard-filter/dashboard-filter.component.ts

@@ -0,0 +1,89 @@
+import { Component, OnInit, Input, forwardRef } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatNativeDateModule } from '@angular/material/core';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatButtonModule } from '@angular/material/button';
+import { debounceTime } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import { ComponentMapperComponent } from '@pega/angular-sdk-components';
+import { getFilterExpression, getFormattedDate, createFilter, combineFilters } from '@pega/angular-sdk-components';
+
+@Component({
+  selector: 'app-dashboard-filter',
+  templateUrl: './dashboard-filter.component.html',
+  styleUrls: ['./dashboard-filter.component.scss'],
+  standalone: true,
+  imports: [
+    CommonModule,
+    MatFormFieldModule,
+    ReactiveFormsModule,
+    MatDatepickerModule,
+    MatButtonModule,
+    MatNativeDateModule,
+    forwardRef(() => ComponentMapperComponent)
+  ]
+})
+export class DashboardFilterComponent implements OnInit {
+  @Input() pConn$: typeof PConnect;
+  @Input() filtersFormGroup$: FormGroup;
+  @Input() inlineProps;
+  @Input() children;
+
+  arChildren$: any[];
+  private filterChangeSubject = new Subject<string>();
+
+  constructor() {
+    this.filterChangeSubject.pipe(debounceTime(500)).subscribe(val => this.fireFilterChange(val));
+  }
+
+  ngOnInit() {
+    if (this.filtersFormGroup$ != null) {
+      this.filtersFormGroup$.addControl('start', new FormControl(null));
+      this.filtersFormGroup$.addControl('end', new FormControl(null));
+    }
+  }
+
+  clearFilters() {
+    this.filtersFormGroup$.reset();
+    PCore.getPubSubUtils().publish(PCore.getConstants().PUB_SUB_EVENTS.EVENT_DASHBOARD_FILTER_CLEAR_ALL);
+  }
+
+  updateTmpData(filterData) {
+    this.filterChangeSubject.next(filterData);
+  }
+
+  dateRangeChangeHandler(field) {
+    const { filterId, name } = field;
+    const start = (this.filtersFormGroup$.get('start') as FormControl).value;
+    const end = (this.filtersFormGroup$.get('end') as FormControl).value;
+    if (start && end) {
+      let startDate = getFormattedDate(start);
+      let endDate = getFormattedDate(end);
+
+      if (startDate && endDate) {
+        startDate = `${startDate}T00:00:00`;
+        endDate = `${endDate}T00:00:00`;
+        const startFilter = createFilter(startDate, name, 'GT');
+        const endFilter = createFilter(endDate, name, 'LT');
+
+        const filterData = {
+          filterId,
+          filterExpression: combineFilters([startFilter, endFilter], null)
+        };
+        PCore.getPubSubUtils().publish(PCore.getConstants().PUB_SUB_EVENTS.EVENT_DASHBOARD_FILTER_CHANGE, filterData);
+      }
+    }
+  }
+
+  fireFilterChange(data: any) {
+    const { event, field } = data;
+    const filterData = {
+      filterId: field.filterId,
+      filterExpression: getFilterExpression(event.target.value, field.name, field.metadata)
+    };
+
+    PCore.getPubSubUtils().publish(PCore.getConstants().PUB_SUB_EVENTS.EVENT_DASHBOARD_FILTER_CHANGE, filterData);
+  }
+}

package/tests/assets/sdk-a/components/create/override-sdk/infra/defer-load/defer-load.component.ts

@@ -44,7 +44,8 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
 
   ngOnInit(): void {
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
-    this.loadActiveTab();
+    // The below call is causing an error while creating/opening a case, hence commenting it out
+    // this.loadActiveTab();
   }
 
   ngOnDestroy(): void {
@@ -56,7 +57,6 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
   onStateChange() {
     // Should always check the bridge to see if the component should
     // update itself (re-render)
-    // @ts-ignore - second parameter pageReference for getValue method should be optional
     const theRequestedAssignment = this.pConn$.getValue(PCore.getConstants().CASE_INFO.ASSIGNMENT_LABEL);
     if (theRequestedAssignment !== this.currentLoadedAssignment) {
       this.currentLoadedAssignment = theRequestedAssignment;
@@ -65,7 +65,6 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   ngOnChanges() {
-    // @ts-ignore - second parameter pageReference for getValue method should be optional
     this.loadViewCaseID = this.pConn$.getValue(this.constants.PZINSKEY) || this.pConn$.getValue(this.constants.CASE_INFO.CASE_INFO_ID);
     let containerItemData;
     const targetName = this.pConn$.getTarget();
@@ -91,7 +90,6 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
 
   getViewOptions = () => ({
     viewContext: this.resourceType,
-    // @ts-ignore - parameter “contextName” for getDataObject method should be optional
     pageClass: this.loadViewCaseID ? '' : this.pConn$.getDataObject().pyPortal.classID,
     container: this.isContainerPreview ? 'preview' : null,
     containerName: this.isContainerPreview ? 'preview' : null,
@@ -138,9 +136,8 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
         this.pConn$
           .getActionsApi()
           .showData(this.name, dataContext, dataContextParameters, {
-            // @ts-ignore - skipSemanticUrl should be boolean type
             skipSemanticUrl: true,
-            // @ts-ignore
+            // @ts-ignore - Object literal may only specify known properties, and 'isDeferLoaded' does not exist in type '{ containerName: string; skipSemanticUrl: boolean; }'
             isDeferLoaded: true
           })
           .then(data => {
@@ -160,8 +157,8 @@ export class DeferLoadComponent implements OnInit, OnDestroy, OnChanges {
     } else {
       this.pConn$
         .getActionsApi()
-        .refreshCaseView(encodeURI(this.loadViewCaseID), this.name, null)
-        .then(data => {
+        .refreshCaseView(encodeURI(this.loadViewCaseID), this.name, '')
+        .then((data: any) => {
           this.onResponse(data.root);
         });
     }