@pega/dx-component-builder-sdk 0.24.7 → 0.25.6

package/tests/assets/sdk-a/components/createAll/override-sdk/template/field-group-template/field-group-template.component.html

@@ -1,5 +1,5 @@
 <div id="field-group">
-  <h3 *ngIf="showLabel$" className="label" style="font-weight: bold">
+  <h3 *ngIf="showLabel$" class="field-group-template-header" style="font-weight: bold">
     {{ label$ }}
   </h3>
   <div *ngIf="readonlyMode; else editable">
@@ -11,23 +11,23 @@
   </div>
   <ng-template #editable>
     <div *ngIf="children && children.length > 0">
-      <div *ngFor="let kid of children; let i = index">
+      <div class="field-group-template-item" *ngFor="let child of children; let i = index">
         <div class="header-div">
           <div style="width: 80%">
-            <b>{{ kid.name }}</b>
+            <b>{{ child.name }}</b>
           </div>
-          <div *ngIf="allowAddEdit !== false" style="width: 20%; text-align: right">
+          <div *ngIf="allowDelete && child.allowRowDelete" style="width: 20%; text-align: right">
             <button id="delete-button" mat-icon-button (click)="deleteFieldGroupItem(i)">
               <img class="psdk-utility-card-action-svg-icon" src="{{ menuIconOverride$ }}" />
             </button>
           </div>
         </div>
 
-        <div *ngIf="kid.children.getPConnect().getRawMetadata().type.toLowerCase() == 'region'">
-          <component-mapper name="Region" [props]="{ pConn$: kid.children.getPConnect(), formGroup$ }"></component-mapper>
+        <div *ngIf="child.children.getPConnect().getRawMetadata().type.toLowerCase() == 'region'">
+          <component-mapper name="Region" [props]="{ pConn$: child.children.getPConnect(), formGroup$ }"></component-mapper>
         </div>
       </div>
-      <button *ngIf="allowAddEdit !== false" mat-button color="primary" style="font-size: 16px" (click)="addFieldGroupItem()">+ Add</button>
     </div>
+    <button *ngIf="allowAdd" mat-button color="primary" style="font-size: 16px" (click)="addFieldGroupItem()">{{ getAddBtnLabel() }}</button>
   </ng-template>
 </div>

package/tests/assets/sdk-a/components/createAll/override-sdk/template/field-group-template/field-group-template.component.scss

@@ -6,3 +6,11 @@
   display: flex;
   align-items: center;
 }
+
+.field-group-template-header {
+  margin-left: 0;
+}
+
+.field-group-template-item {
+  padding-block: 1rem;
+}

package/tests/assets/sdk-a/components/createAll/override-sdk/template/field-group-template/field-group-template.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges } from '@angular/core';
+import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges, AfterViewInit } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
@@ -6,11 +6,14 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { buildView, getReferenceList } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
+import { evaluateAllowRowAction } from '@pega/angular-sdk-components';
 
 interface FieldGroupTemplateProps {
   // If any, enter additional props that only exist on this component
   label?: string;
-  showLabel?: boolean;
+  hideLabel?: boolean;
+  allowActions?: any;
+  allowRowDelete?: any;
   referenceList?: any[];
   contextClass: string;
   renderMode?: string;
@@ -19,6 +22,7 @@ interface FieldGroupTemplateProps {
   displayMode?: string;
   fieldHeader?: string;
   allowTableEdit: boolean;
+  targetClassLabel?: string;
 }
 
 @Component({
@@ -28,26 +32,27 @@ interface FieldGroupTemplateProps {
   standalone: true,
   imports: [CommonModule, MatButtonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges {
+export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges, AfterViewInit {
   @Input() configProps$: FieldGroupTemplateProps;
   @Input() pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
   angularPConnectData: AngularPConnectData = {};
-  inheritedProps$: object;
+
   showLabel$?: boolean = true;
   label$?: string;
   readonlyMode: boolean;
   contextClass: any;
-  referenceList: any;
-  pageReference: any;
   heading: any;
   children: any;
   menuIconOverride$: any;
-  prevRefLength: number;
-  allowAddEdit: boolean;
+  referenceListLength: number;
   fieldHeader: any;
 
+  allowAdd = true;
+  allowEdit = true;
+  allowDelete = true;
+
   constructor(
     private angularPConnect: AngularPConnectService,
     private utils: Utils
@@ -58,9 +63,21 @@ export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
     this.updateSelf();
 
-    const menuIconOverride$ = 'trash';
-    if (menuIconOverride$) {
-      this.menuIconOverride$ = this.utils.getImageSrc(menuIconOverride$, this.utils.getSDKStaticContentUrl());
+    this.menuIconOverride$ = this.utils.getImageSrc('trash', this.utils.getSDKStaticContentUrl());
+
+    const { allowActions, allowTableEdit, referenceList } = this.configProps$;
+
+    if (allowActions && Object.keys(allowActions).length > 0) {
+      this.allowAdd = allowActions.allowAdd ?? allowTableEdit ?? true;
+      this.allowEdit = allowActions.allowEdit ?? true;
+      this.allowDelete = allowActions.allowDelete ?? allowTableEdit ?? true;
+    } else {
+      this.allowAdd = allowTableEdit ?? true;
+      this.allowDelete = allowTableEdit ?? true;
+    }
+
+    if (referenceList?.length === 0 && (this.allowAdd || this.allowEdit)) {
+      this.pConn$.getListActions().insert({ classID: this.contextClass }, referenceList.length);
     }
   }
 
@@ -85,56 +102,57 @@ export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges
       const props = changes.configProps$;
       if (props.currentValue !== props.previousValue) {
         this.configProps$ = props.currentValue;
+
         if (changes?.pConn$?.currentValue) {
           this.pConn$ = changes?.pConn$?.currentValue;
         }
+
         this.updateSelf();
       }
     }
   }
 
+  ngAfterViewInit() {
+    const resolvedList = getReferenceList(this.pConn$);
+    // @ts-ignore - Expected 3 arguments, but got 1
+    this.pConn$.getListActions().initDefaultPageInstructions(resolvedList);
+  }
+
   updateSelf() {
-    this.inheritedProps$ = this.pConn$.getInheritedProps();
-    this.label$ = this.configProps$.label;
-    this.showLabel$ = this.configProps$.showLabel;
-    // label & showLabel within inheritedProps takes precedence over configProps
-    this.label$ = (this.inheritedProps$ as any).label || this.label$;
-    this.showLabel$ = (this.inheritedProps$ as any).showLabel || this.showLabel$;
-
-    this.allowAddEdit = this.configProps$.allowTableEdit;
-
-    const renderMode = this.configProps$.renderMode;
-    const displayMode = this.configProps$.displayMode;
-    this.readonlyMode = renderMode === 'ReadOnly' || displayMode === 'LABELS_LEFT';
-    this.contextClass = this.configProps$.contextClass;
-    const lookForChildInConfig = this.configProps$.lookForChildInConfig;
-    this.heading = this.configProps$.heading ?? 'Row';
-    this.fieldHeader = this.configProps$.fieldHeader;
+    const inheritedProps: any = this.pConn$.getInheritedProps();
+
+    const { label, hideLabel, allowRowDelete, referenceList, fieldHeader, renderMode, displayMode, heading, contextClass, lookForChildInConfig } =
+      this.configProps$;
+
+    // label within inheritedProps takes precedence over configProps
+    this.label$ = inheritedProps.label || label;
+
+    this.showLabel$ = referenceList?.length === 0 || !hideLabel;
+
+    this.readonlyMode = renderMode === 'ReadOnly' || displayMode === 'DISPLAY_ONLY';
+
+    this.contextClass = contextClass;
+    this.heading = heading ?? 'Row';
+    this.fieldHeader = fieldHeader;
+
     const resolvedList = getReferenceList(this.pConn$);
-    this.pageReference = `${this.pConn$.getPageReference()}${resolvedList}`;
     this.pConn$.setReferenceList(resolvedList);
+
     if (this.readonlyMode) {
-      this.pConn$.setInheritedProp('displayMode', 'LABELS_LEFT');
+      this.pConn$.setInheritedProp('displayMode', 'DISPLAY_ONLY');
     }
-    this.referenceList = this.configProps$.referenceList;
-    if (this.prevRefLength != this.referenceList.length) {
-      // eslint-disable-next-line sonarjs/no-collapsible-if
-      if (!this.readonlyMode) {
-        if (this.referenceList?.length === 0 && this.allowAddEdit !== false) {
-          this.addFieldGroupItem();
-        }
-      }
-      const children: any = [];
-      this.referenceList?.forEach((item, index) => {
-        children.push({
+
+    if (this.referenceListLength != referenceList?.length) {
+      this.children = referenceList?.map((item, index) => {
+        return {
           id: index,
           name: this.fieldHeader === 'propertyRef' ? this.getDynamicHeader(item, index) : this.getStaticHeader(this.heading, index),
-          children: buildView(this.pConn$, index, lookForChildInConfig)
-        });
+          children: buildView(this.pConn$, index, lookForChildInConfig),
+          allowRowDelete: evaluateAllowRowAction(allowRowDelete, item)
+        };
       });
-      this.children = children;
     }
-    this.prevRefLength = this.referenceList.length;
+    this.referenceListLength = referenceList?.length || 0;
   }
 
   getStaticHeader = (heading, index) => {
@@ -149,12 +167,15 @@ export class FieldGroupTemplateComponent implements OnInit, OnDestroy, OnChanges
   };
 
   addFieldGroupItem() {
-    // @ts-ignore - second parameter "pageRef" is optional for insert method
-    this.pConn$.getListActions().insert({ classID: this.contextClass }, this.referenceList.length);
+    this.pConn$.getListActions().insert({ classID: this.contextClass }, this.referenceListLength);
   }
 
   deleteFieldGroupItem(index) {
-    // @ts-ignore - second parameter "pageRef" is optional for deleteEntry method
     this.pConn$.getListActions().deleteEntry(index);
   }
+
+  getAddBtnLabel() {
+    const { targetClassLabel } = this.configProps$;
+    return targetClassLabel ? `+ Add ${targetClassLabel}` : '+ Add';
+  }
 }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/field-value-list/field-value-list.component.html

@@ -1,5 +1,5 @@
-<div *ngIf="displayMode$ === 'LABELS_LEFT'; else STACKED_LARGE_VAL" class="psdk-container-labels-left">
-  <div class="psdk-grid-label">{{ label$ }}</div>
+<div *ngIf="displayMode$ === 'DISPLAY_ONLY'; else STACKED_LARGE_VAL" [ngClass]="label$ ? 'psdk-container-labels-left' : 'psdk-container-nolabels'">
+  <div *ngIf="label$" class="psdk-grid-label">{{ label$ }}</div>
   <div class="psdk-val-labels-left">
     <ng-container *ngTemplateOutlet="valueTemplate"></ng-container>
   </div>

package/tests/assets/sdk-a/components/createAll/override-sdk/template/field-value-list/field-value-list.component.scss

@@ -4,6 +4,11 @@
   column-gap: calc(2 * 0.5rem);
   row-gap: calc(2 * 0.5rem);
   align-items: start;
+  padding-block: 8px;
+}
+.psdk-container-nolabels {
+  align-items: start;
+  padding-block: 8px;
 }
 .psdk-value {
   margin: 8px 0px;
@@ -14,5 +19,5 @@
   font-size: 1.25rem;
 }
 .psdk-val-labels-left {
-  margin: 8px 0px;
+  white-space: break-spaces;
 }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/inline-dashboard-page/inline-dashboard-page.component.ts

@@ -45,8 +45,8 @@ export class InlineDashboardPageComponent implements OnInit, OnChanges {
 
   updateSelf() {
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as InlineDashboardPageProps;
-    const arChildren$ = this.pConn$.getChildren() as any[];
-    const allFilters = (this.pConn$.getRawMetadata() as any).children[1];
+    const arChildren$ = this.pConn$.getChildren();
+    const allFilters = this.pConn$.getRawMetadata()?.children[1];
     const filterComponents = buildFilterComponents(this.pConn$, allFilters);
     this.inlineProps = this.configProps$;
     this.children[0] = arChildren$[0];

package/tests/assets/sdk-a/components/createAll/override-sdk/template/list-view/list-view.component.html

@@ -1,5 +1,8 @@
 <div class="psdk-list-header">
   <div>
+    <h3 *ngIf="label" class="label" style="font-weight: bold">
+      {{ label }} <span class="results-count">{{ getResultsText() }}</span>
+    </h3>
     <mat-form-field class="psdk-search" *ngIf="bShowSearch$">
       <mat-label><img class="psdk-icon-search" src="{{ searchIcon$ }}" /> <span class="psdk-search-label">Search</span> </mat-label>
       <input matInput id="search" (keyup)="applySearch($event)" placeholder="" />
@@ -177,7 +180,9 @@
               <tr mat-header-row *matHeaderRowDef="displayedColumns$"></tr>
             </table>
           </div>
-          <div class="psdk-no-records" *ngIf="repeatListData?.length === 0">No Records Found.</div>
+          <div class="psdk-no-records" *ngIf="repeatListData?.length === 0">
+            {{ utils.getGenericFieldsLocalizedValue('CosmosFields.fields.lists', 'No records found.') }}
+          </div>
         </div>
       </div>
     </div>

package/tests/assets/sdk-a/components/createAll/override-sdk/template/list-view/list-view.component.scss

@@ -165,3 +165,14 @@ tr.mat-mdc-row {
   background-color: transparent;
   align-items: center;
 }
+
+.results-count {
+  opacity: 0.7;
+  font-size: 0.8rem;
+  font-weight: bold;
+  margin-inline-start: 0.625rem;
+}
+
+.label {
+  margin: 8px;
+}

package/tests/assets/sdk-a/components/createAll/override-sdk/template/list-view/list-view.component.ts

@@ -1,4 +1,3 @@
-/* eslint-disable max-classes-per-file */
 import { Component, OnInit, Input, ViewChild, forwardRef, OnDestroy } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatDatepickerModule } from '@angular/material/datepicker';
@@ -22,13 +21,13 @@ import { getCurrencyOptions } from '@pega/angular-sdk-components';
 import { getLocale, getSeconds } from '@pega/angular-sdk-components';
 import { formatters } from '@pega/angular-sdk-components';
 
-import { useInit } from './listViewHelpers';
-
-declare const window: any;
+import { init } from './listViewHelpers';
 
 const SELECTION_MODE = { SINGLE: 'single', MULTI: 'multi' };
 
 interface ListViewProps {
+  inheritedProps: any;
+  title: string | undefined;
   // If any, enter additional props that only exist on this component
   globalSearch?: boolean;
   referenceList?: any;
@@ -42,6 +41,7 @@ interface ListViewProps {
   grouping: string | boolean;
   value: any;
   readonlyContextList: any;
+  label?: string;
 }
 
 export class Group {
@@ -159,10 +159,11 @@ export class ListViewComponent implements OnInit, OnDestroy {
   xRayApis = PCore.getDebugger().getXRayRuntime();
   xRayUid = this.xRayApis.startXRay();
   checkBoxValue: string;
+  label?: string = '';
 
   constructor(
     private psService: ProgressSpinnerService,
-    private utils: Utils
+    public utils: Utils
   ) {}
 
   ngOnInit(): void {
@@ -192,6 +193,18 @@ export class ListViewComponent implements OnInit, OnDestroy {
     this.arFilterMainButtons$.push({ actionID: 'submit', jsAction: 'submit', name: 'Submit' });
     this.arFilterSecondaryButtons$.push({ actionID: 'cancel', jsAction: 'cancel', name: 'Cancel' });
 
+    let title = this.configProps$?.title || this.configProps$?.label || 'List';
+    const inheritedProps = this.configProps$?.inheritedProps;
+    if (title === 'List' && inheritedProps) {
+      for (const inheritedProp of inheritedProps) {
+        if (inheritedProp?.prop === 'label') {
+          title = inheritedProp?.value;
+          break;
+        }
+      }
+    }
+    this.label = title;
+
     this.searchIcon$ = this.utils.getImageSrc('search', this.utils.getSDKStaticContentUrl());
     setTimeout(() => {
       PCore.getPubSubUtils().subscribe(
@@ -218,7 +231,7 @@ export class ListViewComponent implements OnInit, OnDestroy {
       if (!this.payload) {
         this.payload = { referenceList: this.configProps$.referenceList };
       }
-      useInit({
+      init({
         pConn$: this.pConn$,
         bInForm$: this.bInForm$,
         ...this.payload,
@@ -961,7 +974,7 @@ export class ListViewComponent implements OnInit, OnDestroy {
 
   filterDataWithDate(item, filterObj, filterValue) {
     let bKeep;
-    let value = item[filterObj.ref] != null ?? item[filterObj.ref] != '' ? getSeconds(item[filterObj.ref]) : null;
+    let value = item[filterObj.ref] != null || item[filterObj.ref] != '' ? getSeconds(item[filterObj.ref]) : null;
     filterValue = filterObj.containsFilterValue != null && filterObj.containsFilterValue != '' ? getSeconds(filterObj.containsFilterValue) : null;
 
     switch (filterObj.containsFilter) {
@@ -1380,6 +1393,11 @@ export class ListViewComponent implements OnInit, OnDestroy {
     return listFields;
   }
 
+  getResultsText() {
+    const recordsCount = this.repeatList$?.paginator?.length || 0;
+    return `${recordsCount || 0} result${recordsCount > 1 ? 's' : ''}`;
+  }
+
   getField(fieldDefs, columnId) {
     const fieldsMap = this.getFieldsMap(fieldDefs);
     return fieldsMap.get(columnId);

package/tests/assets/sdk-a/components/createAll/override-sdk/template/list-view/listViewHelpers.ts

@@ -1,9 +1,6 @@
 import { getContext, readContextResponse } from './utils';
 
-// Remove this and use "real" PCore type once .d.ts is fixed (currently shows 1 error)
-declare const PCore: any;
-
-export function useInit(props) {
+export function init(props) {
   const {
     referenceList,
     pConn$,
@@ -25,9 +22,9 @@ export function useInit(props) {
   let selectionCountThreshold;
 
   // promise to fetch metadata
-  const metaDataPromise = PCore.getAnalyticsUtils().getDataViewMetadata(referenceList, showDynamicFields);
+  const metaDataPromise = PCore.getAnalyticsUtils().getDataViewMetadata(referenceList, showDynamicFields, null);
 
-  const promisesArray = [metaDataPromise];
+  const promisesArray: any = [metaDataPromise];
 
   // promise to fetch report configured columns
   const reportColumnsPromise = PCore.getAnalyticsUtils()

package/tests/assets/sdk-a/components/createAll/override-sdk/template/list-view/utils.ts

@@ -1,8 +1,5 @@
 import { getDefaultViewMeta } from './DefaultViewMeta';
 
-// Remove this and use "real" PCore type once .d.ts is fixed (currently shows 5 errors)
-declare const PCore: any;
-
 const USER_REFERENCE = 'UserReference';
 const PAGE = '!P!';
 const PAGELIST = '!PL!';
@@ -121,7 +118,7 @@ export const isPageListInPath = (propertyName, currentClassID) => {
     return false;
   }
   const [first, ...rest] = propertyName.split('.');
-  const metadata = PCore.getMetadataUtils().getPropertyMetadata(first, currentClassID);
+  const metadata: any = PCore.getMetadataUtils().getPropertyMetadata(first, currentClassID);
   if (metadata?.type === 'Page List') {
     return true;
   }
@@ -205,7 +202,7 @@ export function getConfigEmbeddedFieldsMeta(configFields, classID) {
       if (value.includes('[')) {
         value = value.substring(0, value.indexOf('[')) + value.substring(value.indexOf(']') + 1);
       }
-      const meta = PCore.getMetadataUtils().getEmbeddedPropertyMetadata(value, classID);
+      const meta: any = PCore.getMetadataUtils().getEmbeddedPropertyMetadata(value, classID);
       meta.fieldID = field;
       configEmbeddedFieldsMeta.push(meta);
     }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/narrow-wide-form/narrow-wide-form.component.ts

@@ -29,6 +29,6 @@ export class NarrowWideFormComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/one-column/one-column.component.ts

@@ -2,6 +2,7 @@ import { Component, OnInit, Input, forwardRef, OnChanges, SimpleChanges } from '
 import { CommonModule } from '@angular/common';
 import { FormGroup } from '@angular/forms';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
+import { FormTemplateBase } from '@pega/angular-sdk-components';
 
 @Component({
   selector: 'app-one-column',
@@ -10,8 +11,8 @@ import { ComponentMapperComponent } from '@pega/angular-sdk-components';
   standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class OneColumnComponent implements OnInit, OnChanges {
-  @Input() pConn$: typeof PConnect;
+export class OneColumnComponent extends FormTemplateBase implements OnInit, OnChanges {
+  @Input() override pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
   arChildren$: any[];
@@ -29,6 +30,6 @@ export class OneColumnComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/one-column-tab/one-column-tab.component.ts

@@ -29,6 +29,6 @@ export class OneColumnTabComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/tests/assets/sdk-a/components/createAll/override-sdk/template/page/page.component.ts

@@ -34,7 +34,7 @@ export class PageComponent implements OnInit, OnDestroy {
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
 
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as PageProps;
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
 
     this.title$ = this.configProps$.title;
     const operator = this.configProps$.operator;

package/tests/assets/sdk-a/components/createAll/override-sdk/template/promoted-filters/promoted-filters.component.ts

@@ -81,7 +81,7 @@ export class PromotedFiltersComponent implements OnInit, OnDestroy {
     });
 
     const filtersWithClassID = { ...this.filtersProperties, classID: this.pageClass };
-    this.transientItemID = (this.pConn$.getContainerManager() as any).addTransientItem({ id: this.viewName, data: filtersWithClassID });
+    this.transientItemID = this.pConn$.getContainerManager().addTransientItem({ id: this.viewName, data: filtersWithClassID });
     this.processedFilters = [];
     this.filters.forEach(filter => {
       const filterClone = { ...filter };

package/tests/assets/sdk-a/components/createAll/override-sdk/template/repeating-structures/repeating-structures.component.ts

@@ -107,7 +107,7 @@ export class RepeatingStructuresComponent implements OnInit, AfterViewInit {
   openAssignment(row) {
     const { pxRefObjectClass, pzInsKey } = row;
     const sTarget = this.pConn$.getContainerName();
-    const options: any = { containerName: sTarget };
+    const options = { containerName: sTarget };
     this.pConn$
       .getActionsApi()
       .openAssignment(pzInsKey, pxRefObjectClass, options)

package/tests/assets/sdk-a/components/createAll/override-sdk/template/simple-table-manual/helpers.ts

@@ -44,18 +44,20 @@ function getFieldWidth(field, label) {
 export const getContext = thePConn => {
   const contextName = thePConn.getContextName();
   const pageReference = thePConn.getPageReference();
-  // 8.7 change = referenceList may now be in top-level of state props,
-  //  not always in config of state props
-  let { referenceList } = thePConn.getStateProps()?.config || thePConn.getStateProps();
+  const { readonlyContextList, referenceList = readonlyContextList } = thePConn.getStateProps()?.config || thePConn.getStateProps();
+
   const pageReferenceForRows = referenceList.startsWith('.') ? `${pageReference}.${referenceList.substring(1)}` : referenceList;
+  const viewName = thePConn.viewName;
 
   // removing "caseInfo.content" prefix to avoid setting it as a target while preparing pageInstructions
-  referenceList = pageReferenceForRows.replace(PCore.getConstants().CASE_INFO.CASE_INFO_CONTENT, '');
+  // skipping the removal as StateMachine itself is removing this case info prefix while preparing pageInstructions
+  // referenceList = pageReferenceForRows.replace(PCore.getConstants().CASE_INFO.CASE_INFO_CONTENT, '');
 
   return {
     contextName,
     referenceListStr: referenceList,
-    pageReferenceForRows
+    pageReferenceForRows,
+    viewName
   };
 };
 
@@ -189,8 +191,8 @@ export const createMetaForTable = (fields, renderMode) => {
 };
 
 export const filterDataByDate = (item, filterObj) => {
-  let bKeep;
-  let value = item[filterObj.ref] != null ?? item[filterObj.ref] != '' ? getSeconds(item[filterObj.ref]) : null;
+  let bKeep = true;
+  let value = item[filterObj.ref] != null || item[filterObj.ref] != '' ? getSeconds(item[filterObj.ref]) : null;
   let filterValue = filterObj.containsFilterValue != null && filterObj.containsFilterValue != '' ? getSeconds(filterObj.containsFilterValue) : null;
 
   switch (filterObj.containsFilter) {
@@ -237,7 +239,7 @@ export const filterDataByDate = (item, filterObj) => {
 };
 
 export const filterDataByCommonFields = (item, filterObj) => {
-  let bKeep;
+  let bKeep = true;
   const value = item[filterObj.ref].toLowerCase();
   const filterValue = filterObj.containsFilterValue.toLowerCase();
 

package/tests/assets/sdk-a/components/createAll/override-sdk/template/simple-table-manual/simple-table-manual.component.html

@@ -3,8 +3,8 @@
     <h3 *ngIf="label" className="label" style="font-weight: bold">
       {{ label }} <span class="results-count">{{ getResultsText() }}</span>
     </h3>
-    <table *ngIf="readOnlyMode || allowEditingInModal" mat-table [dataSource]="rowData" class="mat-elevation-z8" id="readonly-table" matSort>
-      <ng-container *ngFor="let dCol of processedFields" [matColumnDef]="dCol.config.name">
+    <table *ngIf="readOnlyMode || allowEditingInModal" mat-table [dataSource]="elementsData" class="mat-elevation-z8" id="readonly-table" matSort>
+      <ng-container *ngFor="let dCol of processedFields; let i = index" [matColumnDef]="dCol.config.name">
         <th mat-header-cell *matHeaderCellDef mat-sort-header (click)="_headerSortClick($event, dCol)" arrowPosition="before">
           <div>{{ dCol.config.label }}</div>
           <div class="psdk-mat-header-filter">
@@ -27,7 +27,16 @@
             </mat-menu>
           </div>
         </th>
-        <td mat-cell *matCellDef="let element">{{ element[dCol.config.name] || '---' }}</td>
+        <td mat-cell *matCellDef="let element">
+          <component-mapper
+            [name]="element[i].getPConnect().getComponentName()"
+            [props]="{
+              pConn$: element[i].getPConnect(),
+              formGroup$: formGroup$
+            }"
+            errorMsg="Table wants component not yet available: {{ element[i].getPConnect().getComponentName() }}"
+          ></component-mapper>
+        </td>
       </ng-container>
       <ng-container matColumnDef="DeleteIcon">
         <div *ngIf="allowEditingInModal">
@@ -47,6 +56,11 @@
       </ng-container>
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
       <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+      <tr class="mat-row psdk-no-records" *matNoDataRow>
+        <td id="no-records" class="mat-cell" [attr.colspan]="displayedColumns.length">
+          {{ utils.getGenericFieldsLocalizedValue('CosmosFields.fields.lists', 'No records found.') }}
+        </td>
+      </tr>
     </table>
     <table *ngIf="editableMode && !allowEditingInModal" mat-table [dataSource]="elementsData" class="mat-elevation-z8" id="editable-table">
       <ng-container *ngFor="let dCol of fieldDefs; let i = index">
@@ -74,11 +88,16 @@
       </ng-container>
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
       <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+      <tr class="mat-row psdk-no-records" *matNoDataRow>
+        <td id="no-records" class="mat-cell" [attr.colspan]="displayedColumns.length">
+          {{ utils.getGenericFieldsLocalizedValue('CosmosFields.fields.lists', 'No records found.') }}
+        </td>
+      </tr>
     </table>
-    <div class="psdk-no-records" id="no-records" *ngIf="editableMode && referenceList?.length === 0">No Records Found.</div>
-    <div class="psdk-no-records" id="no-records" *ngIf="readOnlyMode && rowData?.data?.length === 0">No Records Found.</div>
   </div>
-  <button *ngIf="showAddRowButton" mat-button color="primary" style="font-size: 16px" (click)="addRecord()">+ Add</button>
+  <button *ngIf="showAddRowButton" mat-button color="primary" style="font-size: 16px" (click)="addRecord()">
+    + {{ localizedVal('Add', localeCategory) }}
+  </button>
 </ng-container>
 
 <!-- pop overs for filters-->