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

package/tests/assets/sdk-a/components/create/override-sdk/template/simple-table-manual/simple-table-manual.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 { FormGroup } from '@angular/forms';
@@ -18,11 +17,10 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { DatapageService } from '@pega/angular-sdk-components';
 import { getReferenceList } from '@pega/angular-sdk-components';
 import { buildFieldsForTable, filterDataByCommonFields, filterDataByDate, getContext } from './helpers';
+import { evaluateAllowRowAction } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 import { getSeconds } from '@pega/angular-sdk-components';
 
-declare const window: any;
-
 interface SimpleTableManualProps {
   // If any, enter additional props that only exist on this component
   visibility?: boolean;
@@ -37,7 +35,9 @@ interface SimpleTableManualProps {
   contextClass?: string;
   propertyLabel?: string;
   fieldMetadata?: any;
+  allowActions?: any;
   allowTableEdit?: boolean;
+  allowRowDelete?: any;
   editMode?: string;
   addAndEditRowsWithin?: any;
   viewForAddAndEditModal?: any;
@@ -45,6 +45,7 @@ interface SimpleTableManualProps {
   displayMode?: string;
   useSeparateViewForEdit: any;
   viewForEditModal: any;
+  targetClassLabel: string;
 }
 
 class Group {
@@ -103,6 +104,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   showAddRowButton: boolean;
   prevReferenceList: any[] = [];
   elementsData: MatTableDataSource<any>;
+  originalElementsData: MatTableDataSource<any>;
   rawFields: any;
   label?: string = '';
   searchIcon$: string;
@@ -158,14 +160,17 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   settingsSvgIcon$: string;
 
   isInitialized = false;
-
+  targetClassLabel: string;
+  localizedVal = PCore.getLocaleUtils().getLocaleValue;
+  localeCategory = 'SimpleTable';
   constructor(
     private angularPConnect: AngularPConnectService,
-    private utils: Utils,
+    public utils: Utils,
     private dataPageService: DatapageService
   ) {}
 
   ngOnInit(): void {
+    this.elementsData = new MatTableDataSource<any>([]);
     this.isInitialized = true;
     // First thing in initialization is registering and subscribing to the AngularPConnect service
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
@@ -219,7 +224,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     //  but getRawMetadata() has each child.config with datasource and value showing their unresolved values (ex: "@P thePropName")
     //  We need to use the prop name as the "glue" to tie the Angular Material table dataSource, displayColumns and data together.
     //  So, in the code below, we'll use the unresolved config.value (but replacing the space with an underscore to keep things happy)
-    const rawMetadata: any = this.pConn$.getRawMetadata();
+    const rawMetadata = this.pConn$.getRawMetadata();
 
     // Adapted from Nebula
     const {
@@ -227,7 +232,9 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
       renderMode,
       children, // destructure children into an array var: "resolvedFields"
       presets,
+      allowActions,
       allowTableEdit,
+      allowRowDelete,
       label: labelProp,
       propertyLabel,
       fieldMetadata,
@@ -237,15 +244,26 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
       editModeConfig,
       displayMode,
       useSeparateViewForEdit,
-      viewForEditModal
+      viewForEditModal,
+      targetClassLabel
     } = this.configProps$;
 
+    const simpleTableManualProps: any = {};
+    if (this.checkIfAllowActionsOrRowEditingExist(allowActions) && editMode) {
+      simpleTableManualProps.hideAddRow = allowActions?.allowAdd === false;
+      simpleTableManualProps.hideDeleteRow = allowActions?.allowDelete === false;
+      simpleTableManualProps.hideEditRow = allowActions?.allowEdit === false;
+      simpleTableManualProps.disableDragDrop = allowActions?.allowDragDrop === false;
+    } else if (allowTableEdit === false) {
+      simpleTableManualProps.hideAddRow = true;
+      simpleTableManualProps.hideDeleteRow = true;
+      simpleTableManualProps.disableDragDrop = true;
+    }
+
     this.referenceListStr = getContext(this.pConn$).referenceListStr;
     this.label = labelProp || propertyLabel;
     this.parameters = fieldMetadata?.datasource?.parameters;
-
-    const hideAddRow = allowTableEdit === false;
-    const hideDeleteRow = allowTableEdit === false;
+    this.targetClassLabel = targetClassLabel;
     let { contextClass } = this.configProps$;
     this.referenceList = referenceList;
     if (!contextClass) {
@@ -262,7 +280,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     //    config.value (ex: "@P .DeclarantChoice") or
     //    config.datasource (ex: "@ASSOCIATED .DeclarantChoice")
     //  Neither of these appear in the resolved (this.configProps$)
-    const rawConfig = rawMetadata?.config;
+    const rawConfig: any = rawMetadata?.config;
     const rawFields = rawConfig?.children?.[0]?.children || rawConfig?.presets?.[0].children?.[0]?.children;
     this.rawFields = rawFields;
     // At this point, fields has resolvedFields and rawFields we can use
@@ -282,10 +300,10 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     this.readOnlyMode = renderMode === 'ReadOnly';
     this.editableMode = renderMode === 'Editable';
     const isDisplayModeEnabled = displayMode === 'DISPLAY_ONLY';
-    this.showAddRowButton = !this.readOnlyMode && !hideAddRow;
+    this.showAddRowButton = !this.readOnlyMode && !simpleTableManualProps.hideAddRow;
     this.allowEditingInModal =
       (editMode ? editMode === 'modal' : addAndEditRowsWithin === 'modal') && !(renderMode === 'ReadOnly' || isDisplayModeEnabled);
-    const showDeleteButton = this.editableMode && !hideDeleteRow;
+    const showDeleteButton = this.editableMode && !simpleTableManualProps.hideDeleteRow && evaluateAllowRowAction(allowRowDelete, this.rowData);
     this.defaultView = editModeConfig ? editModeConfig.defaultView : viewForAddAndEditModal;
     this.bUseSeparateViewForEdit = editModeConfig ? editModeConfig.useSeparateViewForEdit : useSeparateViewForEdit;
     this.editView = editModeConfig ? editModeConfig.editView : viewForEditModal;
@@ -324,7 +342,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     });
 
     // for adding rows to table when editable and not modal view
-    if (this.prevReferenceList.length !== this.referenceList.length && this.editableMode && !this.allowEditingInModal) {
+    if (this.prevReferenceList.length !== this.referenceList.length) {
       this.buildElementsForTable();
     }
 
@@ -351,11 +369,14 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     //  ties the 3 data structures together.
   }
 
+  checkIfAllowActionsOrRowEditingExist(newflagobject) {
+    return (newflagobject && Object.keys(newflagobject).length > 0) || this.pConn$.getComponentConfig().allowRowEdit;
+  }
+
   initializeDefaultPageInstructions() {
     if (this.isInitialized) {
       this.isInitialized = false;
       if (this.allowEditingInModal) {
-        // @ts-ignore - An argument for 'uniqueField' was not provided.
         this.pConn$.getListActions().initDefaultPageInstructions(
           this.pConn$.getReferenceList(),
           this.fieldDefs.filter(item => item.name).map(item => item.name)
@@ -373,8 +394,8 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   }
 
   sortCompare(a, b): number {
-    let aValue = a[this.compareRef];
-    let bValue = b[this.compareRef];
+    let aValue = a[0][this.compareRef];
+    let bValue = b[0][this.compareRef];
 
     if (this.compareType == 'Date' || this.compareType == 'DateTime') {
       aValue = getSeconds(aValue);
@@ -497,17 +518,20 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     // run through list of elements in path, if menu not in th path, then want to
     // hide (toggle) the menu
     const eventPath = event.path;
-    for (let eventIndex = 0; eventIndex < eventPath.length; eventIndex++) {
-      if (
-        eventPath[eventIndex].className == 'psdk-modal-file-top' ||
-        eventPath[eventIndex].tagName == 'BUTTON' ||
-        eventPath[eventIndex].tagName == 'MAT-OPTION' ||
-        eventPath[eventIndex].tagName == 'MAT-INPUT'
-      ) {
-        bInPopUp = true;
-        break;
+    if (eventPath) {
+      for (let eventIndex = 0; eventIndex < eventPath.length; eventIndex++) {
+        if (
+          eventPath[eventIndex].className == 'psdk-modal-file-top' ||
+          eventPath[eventIndex].tagName == 'BUTTON' ||
+          eventPath[eventIndex].tagName == 'MAT-OPTION' ||
+          eventPath[eventIndex].tagName == 'MAT-INPUT'
+        ) {
+          bInPopUp = true;
+          break;
+        }
       }
     }
+
     if (!bInPopUp) {
       // this.bShowFilterPopover$ = false;
 
@@ -626,7 +650,8 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     }
   }
 
-  filterData(item: any) {
+  filterData(element: any) {
+    const item = element[0];
     let bKeep = true;
     for (const filterObj of this.filterByColumns) {
       if (filterObj.containsFilterValue != '' || filterObj.containsFilter == 'null' || filterObj.containsFilter == 'notnull') {
@@ -640,6 +665,8 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
             bKeep = filterDataByCommonFields(item, filterObj);
             break;
         }
+      } else if (filterObj.containsFilterValue === '') {
+        bKeep = true;
       }
 
       // if don't keep stop filtering
@@ -652,14 +679,22 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
   }
 
   filterSortGroupBy() {
-    let theData = this.originalData.slice();
+    let theData = this.originalData.slice().map((item, index) => {
+      return [item, index];
+    });
 
     // last filter config data is global
     theData = theData.filter(this.filterData.bind(this));
 
     // last sort config data is global
     theData.sort(this.sortCompare.bind(this));
-    this.rowData.data = theData;
+    this.rowData.data = theData.map(item => item[0]);
+
+    const newElements: any = new Array(this.rowData.data.length);
+    theData.forEach((item, index) => {
+      newElements[index] = this.originalElementsData[item[1]];
+    });
+    this.elementsData = newElements;
   }
 
   _headerSortClick(event, columnData) {
@@ -918,19 +953,19 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
         .getActionsApi()
         .openEmbeddedDataModal(
           this.defaultView,
-          this.pConn$,
+          this.pConn$ as any,
           this.referenceListStr,
           this.referenceList.length,
-          PCore.getConstants().RESOURCE_STATUS.CREATE
+          PCore.getConstants().RESOURCE_STATUS.CREATE,
+          this.targetClassLabel
         );
     } else {
-      // @ts-ignore - second parameter "pageRef" is optional for insert method
       this.pConn$.getListActions().insert({ classID: this.contextClass }, this.referenceList.length);
     }
 
     this.pConn$.clearErrorMessages({
-      property: (this.pConn$.getStateProps() as any)?.referenceList?.substring(1)
-    } as any);
+      property: this.pConn$.getStateProps()?.referenceList?.substring(1)
+    });
   }
 
   editRecord(data, index) {
@@ -939,16 +974,16 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
         .getActionsApi()
         .openEmbeddedDataModal(
           this.bUseSeparateViewForEdit ? this.editView : this.defaultView,
-          this.pConn$,
+          this.pConn$ as any,
           this.referenceListStr,
           index,
-          PCore.getConstants().RESOURCE_STATUS.UPDATE
+          PCore.getConstants().RESOURCE_STATUS.UPDATE,
+          this.targetClassLabel
         );
     }
   }
 
   deleteRecord(index) {
-    // @ts-ignore - second parameter "pageRef" is optional for deleteEntry method
     this.pConn$.getListActions().deleteEntry(index);
   }
 
@@ -958,6 +993,10 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
     this.referenceList.forEach((element, index) => {
       const data: any = [];
       this.rawFields?.forEach(item => {
+        item = {
+          ...item,
+          config: { ...item.config, label: '', displayMode: this.readOnlyMode || this.allowEditingInModal ? 'DISPLAY_ONLY' : undefined }
+        };
         const referenceListData = getReferenceList(this.pConn$);
         const isDatapage = referenceListData.startsWith('D_');
         const pageReferenceValue = isDatapage ? `${referenceListData}[${index}]` : `${this.pConn$.getPageReference()}${referenceListData}[${index}]`;
@@ -975,6 +1014,7 @@ export class SimpleTableManualComponent implements OnInit, OnDestroy {
       });
       eleData.push(data);
     });
+    this.originalElementsData = eleData;
     this.elementsData = eleData;
   }
 }

package/tests/assets/sdk-a/components/create/override-sdk/template/simple-table-select/simple-table-select.component.ts

@@ -57,7 +57,7 @@ export class SimpleTableSelectComponent implements OnInit, OnDestroy {
   }
 
   updateSelf() {
-    const theConfigProps: any = this.pConn$.getConfigProps();
+    const theConfigProps = this.pConn$.getConfigProps();
     this.label = theConfigProps.label;
     this.renderMode = theConfigProps.renderMode;
     this.showLabel = theConfigProps.showLabel;
@@ -71,7 +71,7 @@ export class SimpleTableSelectComponent implements OnInit, OnDestroy {
       this.propsToUse.label = '';
     }
     const { MULTI } = PCore.getConstants().LIST_SELECTION_MODE;
-    const { selectionMode, selectionList }: any = this.pConn$.getConfigProps();
+    const { selectionMode, selectionList } = this.pConn$.getConfigProps();
     const isMultiSelectMode = selectionMode === MULTI;
     if (isMultiSelectMode && this.renderMode === 'ReadOnly') {
       this.showSimpleTableManual = true;
@@ -137,7 +137,7 @@ export class SimpleTableSelectComponent implements OnInit, OnDestroy {
       parameters: this.parameters
     };
 
-    this.filters = (this.pConn$.getRawMetadata() as any).config.promotedFilters ?? [];
+    this.filters = (this.pConn$.getRawMetadata()?.config as any).promotedFilters ?? [];
 
     this.isSearchable = this.filters.length > 0;
   }

package/tests/assets/sdk-a/components/create/override-sdk/template/three-column/three-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-three-column',
@@ -10,8 +11,8 @@ import { ComponentMapperComponent } from '@pega/angular-sdk-components';
   standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class ThreeColumnComponent implements OnInit, OnChanges {
-  @Input() pConn$: typeof PConnect;
+export class ThreeColumnComponent extends FormTemplateBase implements OnInit, OnChanges {
+  @Input() override pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
   arChildren$: any[];
@@ -29,6 +30,6 @@ export class ThreeColumnComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/tests/assets/sdk-a/components/create/override-sdk/template/two-column/two-column.component.ts

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

package/tests/assets/sdk-a/components/create/override-sdk/template/two-column-tab/two-column-tab.component.ts

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

package/tests/assets/sdk-a/components/create/override-sdk/template/wide-narrow-form/wide-narrow-form.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-wide-narrow-form',
@@ -10,8 +11,8 @@ import { ComponentMapperComponent } from '@pega/angular-sdk-components';
   standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
-export class WideNarrowFormComponent implements OnInit, OnChanges {
-  @Input() pConn$: typeof PConnect;
+export class WideNarrowFormComponent extends FormTemplateBase implements OnInit, OnChanges {
+  @Input() override pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
   arChildren$: any[];
@@ -29,6 +30,6 @@ export class WideNarrowFormComponent implements OnInit, OnChanges {
   }
 
   updateSelf() {
-    this.arChildren$ = this.pConn$.getChildren() as any[];
+    this.arChildren$ = this.pConn$.getChildren();
   }
 }

package/tests/assets/sdk-a/components/create/override-sdk/template/wide-narrow-page/wide-narrow-page.component.ts

@@ -15,7 +15,7 @@ export class WideNarrowPageComponent implements OnInit, OnDestroy {
   @Input() pConn$: typeof PConnect;
   @Input() formGroup$: FormGroup;
 
-  thePConnType = '';
+  thePConnType: string | undefined = '';
 
   // Used with AngularPConnect
   angularPConnectData: AngularPConnectData = {};

package/tests/assets/sdk-a/components/create/override-sdk/template/wss-nav-bar/wss-nav-bar.component.ts

@@ -37,11 +37,11 @@ export class WssNavBarComponent implements OnInit, OnDestroy {
   navExpandCollapse$: string;
   bShowCaseTypes$ = false;
 
-  portalApp$ = '';
+  portalApp$: string | undefined = '';
   portalLogoImage$: string;
   showAppName$ = false;
 
-  portalOperator$: string;
+  portalOperator$: string | undefined;
   portalOperatorInitials$: string;
 
   actionsAPI: any;
@@ -129,7 +129,7 @@ export class WssNavBarComponent implements OnInit, OnDestroy {
 
       this.portalLogoImage$ = this.utils.getSDKStaticContentUrl().concat('assets/pzpega-logo-mark.svg');
       this.portalOperator$ = PCore.getEnvironmentInfo().getOperatorName();
-      this.portalOperatorInitials$ = this.utils.getInitials(this.portalOperator$);
+      this.portalOperatorInitials$ = this.utils.getInitials(this.portalOperator$ ?? '');
       this.showAppName$ = this.configProps$.showAppName;
 
       this.portalApp$ = PCore.getEnvironmentInfo().getApplicationLabel();

package/tests/assets/sdk-a/components/create/override-sdk/widget/attachment/attachment.component.ts

@@ -120,7 +120,7 @@ export class AttachmentComponent implements OnInit, OnDestroy {
 
   updateSelf() {
     const configProps: AttachmentProps = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as AttachmentProps;
-    const stateProps: any = this.pConn$.getStateProps();
+    const stateProps = this.pConn$.getStateProps();
     const { value, label, extensions, displayMode } = configProps;
 
     if (configProps.required != null) {
@@ -149,7 +149,7 @@ export class AttachmentComponent implements OnInit, OnDestroy {
 
     this.validateMessage = this.angularPConnectData.validateMessage;
     this.extensions$ = extensions;
-    this.valueRef = (this.pConn$.getStateProps() as any).value;
+    this.valueRef = this.pConn$.getStateProps().value;
     this.valueRef = this.valueRef.startsWith('.') ? this.valueRef.substring(1) : this.valueRef;
     this.displayMode = displayMode;
     /* this is a temporary fix because required is supposed to be passed as a boolean and NOT as a string */
@@ -277,7 +277,7 @@ export class AttachmentComponent implements OnInit, OnDestroy {
       this.updateAttachmentState(this.pConn$, this.getAttachmentKey(this.valueRef), [...currentAttachmentList, ...attachmentsList]);
       if (file.inProgress) {
         // @ts-ignore - 3rd parameter "responseEncoding" should be optional
-        PCore.getAttachmentUtils().cancelRequest(file.ID, pConn.getContextName());
+        PCore.getAttachmentUtils().cancelRequest(file.ID, this.pConn$.getContextName());
       }
     }
 
@@ -317,14 +317,13 @@ export class AttachmentComponent implements OnInit, OnDestroy {
           )} ${this.extensions$.replaceAll('.', '')}`;
         }
         if (f.props.error) {
-          const fieldName = (this.pConn$.getStateProps() as any).value;
+          const fieldName = this.pConn$.getStateProps().value;
           const context = this.pConn$.getContextName();
           PCore.getMessageManager().addMessages({
             messages: [
               {
                 type: 'error',
-                // @ts-ignore - Type '{ type: string; message: string; }' is not assignable to type 'MessagesConfigObject'.
-                message: pConn.getLocalizedValue('Error with one or more files', '', '')
+                message: this.pConn$.getLocalizedValue('Error with one or more files', '', '')
               }
             ],
             property: fieldName,
@@ -348,7 +347,7 @@ export class AttachmentComponent implements OnInit, OnDestroy {
   }
 
   clearFieldErrorMessages() {
-    const fieldName = (this.pConn$.getStateProps() as any).value;
+    const fieldName = this.pConn$.getStateProps().value;
     const context = this.pConn$.getContextName();
     PCore.getMessageManager().clearMessages({
       type: PCore.getConstants().MESSAGES.MESSAGES_TYPE_ERROR,
@@ -376,14 +375,13 @@ export class AttachmentComponent implements OnInit, OnDestroy {
             f.props.icon = this.utils.getIconFromFileType(f.type);
             f.props.name = this.pConn$.getLocalizedValue('Unable to upload file', '', '');
             f.inProgress = false;
-            const fieldName = (this.pConn$.getStateProps() as any).value;
+            const fieldName = this.pConn$.getStateProps().value;
             const context = this.pConn$.getContextName();
             // set errors to property to block submit even on errors in file upload
             PCore.getMessageManager().addMessages({
               messages: [
                 {
                   type: 'error',
-                  // @ts-ignore - Type '{ type: string; message: string; }' is not assignable to type 'MessagesConfigObject'.
                   message: this.pConn$.getLocalizedValue('Error with one or more files', '', '')
                 }
               ],

package/tests/assets/sdk-a/components/create/override-sdk/widget/feed-container/feed-container.component.ts

@@ -9,8 +9,6 @@ import isEqual from 'fast-deep-equal';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { Utils } from '@pega/angular-sdk-components';
 
-declare const window: any;
-
 @Component({
   selector: 'app-feed-container',
   templateUrl: './feed-container.component.html',
@@ -25,8 +23,8 @@ export class FeedContainerComponent implements OnInit, OnDestroy {
   // Used with AngularPConnect
   angularPConnectData: AngularPConnectData = {};
 
-  userName$: string;
-  imageKey$: string;
+  userName$: string | undefined;
+  imageKey$: string | undefined;
 
   currentUserInitials$: string;
   currentUserName$: string;
@@ -65,7 +63,7 @@ export class FeedContainerComponent implements OnInit, OnDestroy {
   ngOnInit(): void {
     this.userName$ = PCore.getEnvironmentInfo().getOperatorName();
     this.imageKey$ = PCore.getEnvironmentInfo().getOperatorImageInsKey();
-    this.updateCurrentUserName(this.userName$);
+    this.updateCurrentUserName(this.userName$ ?? '');
 
     // First thing in initialization is registering and subscribing to the AngularPConnect service
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
@@ -402,11 +400,11 @@ export class FeedContainerComponent implements OnInit, OnDestroy {
   }
 
   getMessageData() {
-    const messageIDs = (this.pConn$.getConfigProps() as any).messageIDs;
-    const userName = (this.pConn$.getConfigProps() as any).currentUser;
+    const messageIDs = this.pConn$.getConfigProps().messageIDs;
+    const userName = this.pConn$.getConfigProps().currentUser;
     const imageKey = this.pConn$.getValue('OperatorID.pyImageInsKey');
 
-    const oData: any = this.pConn$.getDataObject();
+    const oData = this.pConn$.getDataObject();
 
     if (messageIDs && messageIDs.length > 0) {
       this.pulseMessages$ = JSON.parse(JSON.stringify(oData.pulse.messages));
@@ -532,7 +530,7 @@ export class FeedContainerComponent implements OnInit, OnDestroy {
 
       // If feedAPI is defined then only post message
       if (this.feedAPI) {
-        this./* feedAPI. */ postMessage((this.pConn$.getConfigProps() as any).value, this.pulseConversation);
+        this./* feedAPI. */ postMessage(this.pConn$.getConfigProps().value, this.pulseConversation);
       } else {
         console.log("We don't support Pulse yet");
       }

package/tests/assets/sdk-a/components/create/override-sdk/widget/file-utility/file-utility.component.ts

@@ -106,7 +106,7 @@ export class FileUtilityComponent implements OnInit, OnDestroy {
     this.createModalButtons();
 
     PCore.getPubSubUtils().subscribe(
-      (PCore.getEvents().getCaseEvent() as any).CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
+      PCore.getEvents().getCaseEvent().CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
       this.updateSelf.bind(this),
       'caseAttachmentsUpdateFromCaseview'
     );
@@ -117,10 +117,7 @@ export class FileUtilityComponent implements OnInit, OnDestroy {
       this.angularPConnectData.unsubscribeFn();
     }
 
-    PCore.getPubSubUtils().unsubscribe(
-      (PCore.getEvents().getCaseEvent() as any).CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
-      'caseAttachmentsUpdateFromCaseview'
-    );
+    PCore.getPubSubUtils().unsubscribe(PCore.getEvents().getCaseEvent().CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW, 'caseAttachmentsUpdateFromCaseview');
   }
 
   // Callback passed when subscribing to store change

package/tests/assets/sdk-a/components/create/override-sdk/widget/quick-create/config-ext.json

@@ -0,0 +1,10 @@
+{
+    "componentKey": "QuickCreate",
+    "name": "QuickCreate",
+    "label": "Quick create",
+    "description": "Quick create widget",
+    "type": "Widget",
+    "subtype": "PAGE",
+    "properties": [],
+    "defaultConfig": {}
+}

package/tests/assets/sdk-a/components/create/override-sdk/widget/todo/todo.component.html

@@ -1,10 +1,9 @@
 <div class="psdk-todo">
-  <div class="psdk-todo-header">
-    <div *ngIf="showTodoList$" class="psdk-avatar">{{ this.currentUserInitials$ }}</div>
+  <div *ngIf="showTodoList$" class="psdk-todo-header">
+    <div class="psdk-avatar">{{ this.currentUserInitials$ }}</div>
     <div id="worklist" class="psdk-todo-text">{{ headerText$ }}</div>
-    <div *ngIf="showTodoList$" class="psdk-assignment-count">{{ assignmentCount$ }}</div>
+    <div class="psdk-assignment-count">{{ count }}</div>
   </div>
-  <br /><br />
   <div *ngIf="showTodoList$" class="psdk-display-divider"></div>
 
   <div class="psdk-todo-assignments">
@@ -16,9 +15,10 @@
           <div class="psdk-todo-assignment-data">
             <div class="psdk-todo-assignment-task">
               {{ localizedVal('Task in', localeCategory) }}
-              <button class="psdk-todo-id" style="cursor: pointer" (click)="clickGo(assignment)">
+              <button class="psdk-todo-id" style="cursor: pointer" (click)="clickGo(assignment)" *ngIf="!isConfirm || canPerform; else readOnlyText">
                 {{ assignment.name }} {{ getID(assignment) }}
               </button>
+              <ng-template #readOnlyText> {{ assignment.name }} {{ getID(assignment) }} </ng-template>
               <span *ngIf="assignment.status != undefined">
                 &bull; <span class="psdk-todo-assignment-status">{{ assignment?.status }}</span>
               </span>
@@ -26,7 +26,7 @@
             </div>
           </div>
         </div>
-        <div class="psdk-todo-assignment-action" *ngIf="!isConfirm || canPerform">
+        <div *ngIf="!isConfirm || canPerform" class="psdk-todo-assignment-action">
           <button mat-flat-button color="primary" (click)="clickGo(assignment)">{{ localizedVal('Go', localeCategory) }}</button>
         </div>
       </div>
@@ -35,7 +35,7 @@
   </div>
 </div>
 
-<div *ngIf="assignmentCount$ > 3">
+<div *ngIf="count > 3">
   <div *ngIf="bShowMore$; else showLess" class="psdk-todo-show-more">
     <button mat-stroked-button (click)="_showMore()">{{ showMoreLocalizedValue === 'show_more' ? 'Show more' : showMoreLocalizedValue }}</button>
   </div>