@pega/angular-sdk-overrides 0.24.9 → 0.25.2

package/lib/infra/Containers/modal-view-container/modal-view-container.component.ts

@@ -18,12 +18,10 @@ import { ReferenceComponent } from '@pega/angular-sdk-components';
   selector: 'app-modal-view-container',
   templateUrl: './modal-view-container.component.html',
   styleUrls: ['./modal-view-container.component.scss'],
-  standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
 export class ModalViewContainerComponent implements OnInit, OnDestroy {
   @Input() pConn$: typeof PConnect;
-  @Input() displayOnlyFA$: boolean;
 
   // for when non modal
   @Output() modalVisibleChange = new EventEmitter<boolean>();
@@ -32,17 +30,16 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
   angularPConnectData: AngularPConnectData = {};
 
   arChildren$: any[];
-  stateProps$: Object;
+  stateProps$: object;
   banners: any;
   templateName$: string;
   buildName$: string;
   context$: string;
   title$ = '';
   bShowModal$ = false;
-  bShowAsModal$ = true;
   itemKey$: string;
   formGroup$: FormGroup;
-  oCaseInfo: Object = {};
+  oCaseInfo: object = {};
 
   // for causing a change on assignment
   updateToken$ = 0;
@@ -73,11 +70,6 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
-    if (this.displayOnlyFA$) {
-      // for when non modal
-      this.bShowAsModal$ = false;
-    }
-
     // First thing in initialization is registering and subscribing to the AngularPConnect service
     this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
 
@@ -89,7 +81,7 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
       this.itemKey$ = baseContext.concat('/').concat(acName);
     }
 
-    const containerMgr: any = this.pConn$.getContainerManager();
+    const containerMgr = this.pConn$.getContainerManager();
 
     containerMgr.initializeContainers({
       type: 'multiple'
@@ -142,7 +134,7 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
       // @ts-ignore - Property 'getLoadingStatus' is private and only accessible within class 'C11nEnv'
       loadingInfo = this.pConn$.getLoadingStatus();
     } catch (ex) {
-      /* empty */
+      console.log(ex);
     }
     // const configProps = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps());
     this.stateProps$ = this.pConn$.getStateProps();
@@ -242,12 +234,7 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
         this.title$ =
           isDataObject || this.isMultiRecord
             ? this.getModalHeading(dataObjectAction)
-            : this.determineModalHeaderByAction(
-                actionName,
-                caseTypeName,
-                ID,
-                `${theNewCaseInfo?.getClassName()}!CASE!${theNewCaseInfo.getName()}`.toUpperCase()
-              );
+            : this.determineModalHeaderByAction(actionName, caseTypeName, ID, this.createdViewPConn$?.getCaseLocaleReference());
 
         const bIsRefComponent = this.checkIfRefComponent(newComp);
 
@@ -372,7 +359,7 @@ export class ModalViewContainerComponent implements OnInit, OnDestroy {
     return {};
   }
 
-  compareCaseInfoIsDifferent(oCurrentCaseInfo: Object): boolean {
+  compareCaseInfoIsDifferent(oCurrentCaseInfo: object): boolean {
     let bRet = false;
 
     // fast-deep-equal version

package/lib/infra/Containers/preview-view-container/preview-view-container.component.ts

@@ -18,7 +18,7 @@ export class PreviewViewContainerComponent implements OnInit {
   @Input() pConn$: typeof PConnect;
 
   ngOnInit(): void {
-    const containerMgr: any = this.pConn$.getContainerManager();
+    const containerMgr = this.pConn$.getContainerManager();
 
     containerMgr.initializeContainers({
       type: 'multiple'

package/lib/infra/Containers/view-container/helper.ts

@@ -0,0 +1,55 @@
+export const addContainerItem = pConnect => {
+  const containerManager = pConnect.getContainerManager();
+  const context = pConnect.getContextName();
+  containerManager.addContainerItem({
+    context,
+    semanticURL: ''
+  });
+};
+
+export const configureBrowserBookmark = pConnect => {
+  const context = pConnect.getContextName();
+  const containerName = pConnect.getContainerName();
+  const envInfo = PCore.getEnvironmentInfo();
+  const { APP } = PCore.getConstants();
+
+  const navPages = pConnect.getValue('pyPortal.pyPrimaryNavPages');
+  let ruleName = '';
+  let className = '';
+  let defaultViewLabel = '';
+
+  const isNextGenLandingPageRouting = (envInfo?.environmentInfoObject as any)?.pyExecutionRuntimeName === (APP as any).INFINITY_RUNTIME;
+
+  if (Array.isArray(navPages) && navPages.length > 0) {
+    const firstNavPage = navPages[0];
+    const nestedNavPage = firstNavPage.NavigationPages?.[0];
+
+    if (isNextGenLandingPageRouting) {
+      if (nestedNavPage?.pyRuleName) {
+        ruleName = nestedNavPage.pyRuleName;
+        className = nestedNavPage.pyClassName || '';
+      } else if (firstNavPage?.pyRuleName) {
+        ruleName = firstNavPage.pyRuleName;
+        className = firstNavPage.pyClassName || '';
+      } else if (nestedNavPage?.pyLabel) {
+        defaultViewLabel = nestedNavPage.pyLabel;
+      } else if (firstNavPage?.pyLabel) {
+        defaultViewLabel = firstNavPage.pyLabel;
+      }
+    } else if (nestedNavPage?.pyLabel) {
+      defaultViewLabel = nestedNavPage.pyLabel;
+    } else if (firstNavPage?.pyLabel) {
+      defaultViewLabel = firstNavPage.pyLabel;
+    }
+  }
+
+  PCore.configureForBrowserBookmark({
+    context,
+    containerName,
+    acName: containerName,
+    semanticURL: '',
+    defaultViewLabel,
+    ruleName,
+    className
+  });
+};

package/lib/infra/Containers/view-container/view-container.component.ts

@@ -5,6 +5,7 @@ import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-c
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
 import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
+import { configureBrowserBookmark } from './helper';
 
 /**
  * WARNING:  It is not expected that this file should be modified.  It is part of infrastructure code that works with
@@ -27,7 +28,6 @@ interface ViewContainerProps {
   selector: 'app-view-container',
   templateUrl: './view-container.component.html',
   styleUrls: ['./view-container.component.scss'],
-  standalone: true,
   imports: [CommonModule, forwardRef(() => ComponentMapperComponent)]
 })
 export class ViewContainerComponent implements OnInit, OnDestroy {
@@ -86,7 +86,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
 
     this.pConn$.isBoundToState();
 
-    const containerMgr: any = this.pConn$.getContainerManager();
+    const containerMgr = this.pConn$.getContainerManager();
 
     this.prepareDispatchObject = this.prepareDispatchObject.bind(this);
 
@@ -96,20 +96,10 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
     //    And expose less via ui-bootstrap.js
     this.state = {
       dispatchObject: this.dispatchObject,
-      // PCore is defined in pxBootstrapShell - eventually will be exported in place of constellationCore
-
       visible: !PCore.checkIfSemanticURL()
     };
 
-    // here, to match Nebula/Constellation, the constructor of ViewContainer is only called once, and thus init/add container is only
-    // called once.  Because of Angular creating and destroy components if the parent changes a lot, this component will be
-    // created and destroyed more than once.  So the sessionStore "hasViewContainer" is set to false in rootContainer and then
-    // after first round is true here.  Subsequent ViewContainer creation will not init/add more containers.
-
     if (sessionStorage.getItem('hasViewContainer') == 'false') {
-      // unlike Nebula/Constellation, have to initializeContainer after we create a dispatcObject and state, otherwise, when calling
-      // initializeContainer before, code will get executed that needs state that wasn't defined.
-
       containerMgr.initializeContainers({
         type: mode === CONTAINER_TYPE.MULTIPLE ? CONTAINER_TYPE.MULTIPLE : CONTAINER_TYPE.SINGLE
       });
@@ -118,12 +108,9 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
         /* NOTE: setContainerLimit use is temporary. It is a non-public, unsupported API. */
         PCore.getContainerUtils().setContainerLimit(`${APP.APP}/${name}`, limit);
       }
-    }
 
-    if (sessionStorage.getItem('hasViewContainer') == 'false') {
-      if (this.pConn$.getMetadata().children) {
-        containerMgr.addContainerItem(this.dispatchObject);
-      }
+      if (!PCore.checkIfSemanticURL()) containerMgr.addContainerItem(this.pConn$ as any);
+      if (!this.displayOnlyFA$) configureBrowserBookmark(this.pConn$);
 
       sessionStorage.setItem('hasViewContainer', 'true');
     }
@@ -174,7 +161,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
 
       this.psService.sendMessage(loadingInfo);
     } catch (ex) {
-      /* empty */
+      console.log(ex);
     }
 
     // const buildName = this.buildName();
@@ -254,7 +241,7 @@ export class ViewContainerComponent implements OnInit, OnDestroy {
               console.error(`ViewContainer has a newComp that is NOT a reference!`);
 
               this.createdViewPConn$ = newComp;
-              const newConfigProps: any = newComp.getConfigProps();
+              const newConfigProps = newComp.getConfigProps();
               this.templateName$ = newConfigProps.template || '';
               this.title$ = newConfigProps.title || '';
               // update children with new view's children

package/lib/infra/action-buttons/action-buttons.component.html

@@ -1,12 +1,17 @@
-<mat-grid-list cols="2" rowHeight="6.25rem">
-  <mat-grid-tile>
-    <button *ngFor="let aButton of arSecondaryButtons$" mat-raised-button color="secondary" (click)="buttonClick(aButton.jsAction, 'secondary')">
+<div class="button-bar" *ngIf="arMainButtons$ && arSecondaryButtons$">
+  <div class="left-group">
+    <button
+      *ngFor="let aButton of arSecondaryButtons$"
+      mat-stroked-button
+      class="secondary-button"
+      (click)="buttonClick(aButton.jsAction, 'secondary')"
+    >
       {{ localizedVal(aButton.name, localeCategory) }}
     </button>
-  </mat-grid-tile>
-  <mat-grid-tile>
-    <button *ngFor="let aButton of arMainButtons$" mat-raised-button color="primary" (click)="buttonClick(aButton.jsAction, 'primary')">
+  </div>
+  <div class="right-group">
+    <button *ngFor="let aButton of arMainButtons$" mat-flat-button (click)="buttonClick(aButton.jsAction, 'primary')">
       {{ localizedVal(aButton.name, localeCategory) }}
     </button>
-  </mat-grid-tile>
-</mat-grid-list>
+  </div>
+</div>

package/lib/infra/action-buttons/action-buttons.component.scss

@@ -0,0 +1,23 @@
+.button-bar {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: 100%;
+  padding: 1rem;
+}
+
+.left-group,
+.right-group {
+  display: flex;
+  gap: 1rem;
+}
+
+.right-group {
+  margin-left: auto;
+}
+
+.secondary-button {
+  background-color: var(--app-sys-secondary-button-background);
+  border-color: var(--app-sys-secondary-button-border);
+}

package/lib/infra/action-buttons/action-buttons.component.ts

@@ -1,14 +1,12 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatButtonModule } from '@angular/material/button';
-import { MatGridListModule } from '@angular/material/grid-list';
 
 @Component({
   selector: 'app-action-buttons',
   templateUrl: './action-buttons.component.html',
   styleUrls: ['./action-buttons.component.scss'],
-  standalone: true,
-  imports: [CommonModule, MatGridListModule, MatButtonModule]
+  imports: [CommonModule, MatButtonModule]
 })
 export class ActionButtonsComponent {
   @Input() arMainButtons$: any[];

package/lib/infra/assignment/assignment.component.html

@@ -1,5 +1,5 @@
 <div>
-  <div><component-mapper name="AlertBanner" [props]="{ banners }" [parent]="this"></component-mapper></div>
+  <div><component-mapper name="AlertBanner" [props]="{ banners: bannerService.banners }" [parent]="this"></component-mapper></div>
   <div *ngIf="bHasNavigation$" class="psdk-stepper">
     <component-mapper
       name="MultiStep"

package/lib/infra/assignment/assignment.component.ts

@@ -1,14 +1,23 @@
 /* eslint-disable no-case-declarations */
-import { Component, OnInit, Input, NgZone, forwardRef, OnDestroy, OnChanges } from '@angular/core';
+import { Component, OnInit, Input, forwardRef, OnDestroy, OnChanges } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatSnackBarModule, MatSnackBar } from '@angular/material/snack-bar';
 import { FormGroup } from '@angular/forms';
 import { AngularPConnectData, AngularPConnectService } from '@pega/angular-sdk-components';
 import { ErrorMessagesService } from '@pega/angular-sdk-components';
 import { ProgressSpinnerService } from '@pega/angular-sdk-components';
+import { BannerService } from '@pega/angular-sdk-components';
 import { ReferenceComponent } from '@pega/angular-sdk-components';
 import { ComponentMapperComponent } from '@pega/angular-sdk-components';
 
+function getRefreshProps(refreshConditions) {
+  // refreshConditions cuurently supports only "Changes" event
+  if (!refreshConditions) {
+    return [];
+  }
+  return refreshConditions.filter(item => item.event && item.event === 'Changes').map(item => [item.field, item.field?.substring(1)]) || [];
+}
+
 interface AssignmentProps {
   // If any, enter additional props that only exist on this component
   template: string;
@@ -18,7 +27,6 @@ interface AssignmentProps {
   selector: 'app-assignment',
   templateUrl: './assignment.component.html',
   styleUrls: ['./assignment.component.scss'],
-  standalone: true,
   imports: [CommonModule, MatSnackBarModule, forwardRef(() => ComponentMapperComponent)]
 })
 export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
@@ -29,7 +37,6 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   @Input() isCreateStage$: boolean;
   @Input() updateToken$: number;
   @Input() isInModal$ = false;
-  @Input() banners;
 
   // For interaction with AngularPConnect
   angularPConnectData: AngularPConnectData = {};
@@ -49,6 +56,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
   bHasNavigation$ = false;
   bIsVertical$ = false;
+  prevNavigationSteps: any[] = [];
   arCurrentStepIndicies$: number[] = [];
   arNavigationSteps$: any[] = [];
 
@@ -69,12 +77,14 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   localeCategory = 'Assignment';
   localeReference;
 
+  snackBarRef;
+
   constructor(
     private angularPConnect: AngularPConnectService,
     private psService: ProgressSpinnerService,
     private erService: ErrorMessagesService,
-    private ngZone: NgZone,
-    private snackBar: MatSnackBar
+    private snackBar: MatSnackBar,
+    public bannerService: BannerService
   ) {}
 
   ngOnInit(): void {
@@ -105,6 +115,8 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
     // Should always check the bridge to see if the component should update itself (re-render)
     const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
 
+    this.bannerService.updateBanners(this.itemKey$);
+
     // ONLY call updateSelf when the component should update
     //    AND removing the "gate" that was put there since shouldComponentUpdate
     //      should be the real "gate"
@@ -116,7 +128,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
         this.psService.sendMessage(loadingInfo);
       } catch (ex) {
-        /* empty */
+        console.log(ex);
       }
     }
   }
@@ -128,6 +140,8 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   updateChanges() {
+    this.registerForRefresh();
+
     // pConn$ may be a 'reference' component, so normalize it
     this.newPConn$ = ReferenceComponent.normalizePConn(this.pConn$);
 
@@ -236,17 +250,19 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
 
     // iterate through steps to find current one(s)
     // immutable, so we want to change the local copy, so need to make a copy
-    this.ngZone.run(() => {
+
+    if (!PCore.isDeepEqual(this.prevNavigationSteps, oCaseInfo.navigation.steps)) {
       // what comes back now in configObject is the children of the flowContainer
       this.arNavigationSteps$ = JSON.parse(JSON.stringify(oCaseInfo.navigation.steps));
+      this.prevNavigationSteps = JSON.parse(JSON.stringify(oCaseInfo.navigation.steps));
       this.arNavigationSteps$.forEach(step => {
         if (step.name) {
-          step.name = PCore.getLocaleUtils().getLocaleValue(step.name, undefined, this.localeReference);
+          step.name = this.pConn$.getLocalizationService().getLocalizedText(step.name);
         }
       });
       this.arCurrentStepIndicies$ = [];
       this.arCurrentStepIndicies$ = this.findCurrentIndicies(this.arNavigationSteps$, this.arCurrentStepIndicies$, 0);
-    });
+    }
   }
 
   findCurrentIndicies(arStepperSteps: any[], arIndicies: number[], depth: number): number[] {
@@ -285,6 +301,9 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   buttonClick(sAction, sButtonType) {
+    this.snackBarRef?.dismiss();
+    this.bannerService.clearBanners();
+    PCore.getPubSubUtils().publish('clearBannerMessages');
     // right now, done on an individual basis, setting bReInit to true
     // upon the next flow container state change, will cause the flow container
     // to re-initialize
@@ -308,21 +327,21 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
       switch (sAction) {
         case 'navigateToStep':
           this.erService.sendMessage('publish', '');
-          if (this.formValid()) {
-            this.bReInit = true;
-            this.psService.sendMessage(true);
 
-            const navigatePromise = this.navigateToStep('previous', this.itemKey$);
-            navigatePromise
-              .then(() => {
-                this.updateChanges();
-                this.psService.sendMessage(false);
-              })
-              .catch(() => {
-                this.psService.sendMessage(false);
-                this.snackBar.open(`${this.localizedVal('Navigation failed!', this.localeCategory)}`, 'Ok');
-              });
-          }
+          this.bReInit = true;
+          this.psService.sendMessage(true);
+
+          const navigatePromise = this.navigateToStep('previous', this.itemKey$);
+          navigatePromise
+            .then(() => {
+              this.updateChanges();
+              this.psService.sendMessage(false);
+            })
+            .catch(() => {
+              this.psService.sendMessage(false);
+              this.snackBarRef = this.snackBar.open(`${this.localizedVal('Navigation failed!', this.localeCategory)}`, 'Ok');
+            });
+
           break;
 
         case 'saveAssignment': {
@@ -332,14 +351,13 @@ 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);
               PCore.getPubSubUtils().publish('cancelPressed');
               this.onSaveActionSuccess({ caseType, caseID, assignmentID });
             })
             .catch(() => {
               this.psService.sendMessage(false);
-              this.snackBar.open(`${this.localizedVal('Save failed', this.localeCategory)}`, 'Ok');
+              this.snackBarRef = this.snackBar.open(`${this.localizedVal('Save failed', this.localeCategory)}`, 'Ok');
             });
 
           break;
@@ -363,7 +381,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
               })
               .catch(() => {
                 this.psService.sendMessage(false);
-                this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
+                this.snackBarRef = this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
               });
           } else {
             this.psService.sendMessage(true);
@@ -380,7 +398,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
               })
               .catch(() => {
                 this.psService.sendMessage(false);
-                this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
+                this.snackBarRef = this.snackBar.open(`${this.localizedVal('Cancel failed!', this.localeCategory)}`, 'Ok');
               });
           }
           break;
@@ -392,7 +410,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
             .then(() => {})
             .catch(() => {
               this.psService.sendMessage(false);
-              this.snackBar.open(`${this.localizedVal('Rejection failed!', this.localeCategory)}`, 'Ok');
+              this.snackBarRef = this.snackBar.open(`${this.localizedVal('Rejection failed!', this.localeCategory)}`, 'Ok');
             });
 
           break;
@@ -405,23 +423,18 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
       switch (sAction) {
         case 'finishAssignment':
           this.erService.sendMessage('publish', '');
-          if (this.formValid()) {
-            this.bReInit = true;
-            this.psService.sendMessage(true);
-            const finishPromise = this.finishAssignment(this.itemKey$); // JA - was itemID but Nebula/Constellation uses itemKey
-            finishPromise
-              .then(() => {
-                this.psService.sendMessage(false);
-                this.updateChanges();
-              })
-              .catch(() => {
-                this.psService.sendMessage(false);
-                this.snackBar.open(`${this.localizedVal('Submit failed!', this.localeCategory)}`, 'Ok');
-              });
-          } else {
-            // let snackBarRef = this.snackBar.open("Please fix errors on form.",  "Ok");
-            this.erService.sendMessage('show', this.localizedVal('Please fix errors on form.', this.localeCategory));
-          }
+          this.bReInit = true;
+          this.psService.sendMessage(true);
+          const finishPromise = this.finishAssignment(this.itemKey$); // JA - was itemID but Nebula/Constellation uses itemKey
+          finishPromise
+            .then(() => {
+              this.psService.sendMessage(false);
+              this.updateChanges();
+            })
+            .catch(() => {
+              this.psService.sendMessage(false);
+              this.snackBarRef = this.snackBar.open(`${this.localizedVal('Submit failed!', this.localeCategory)}`, 'Ok');
+            });
           break;
 
         case 'approveCase': {
@@ -431,7 +444,7 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
             .then(() => {})
             .catch(() => {
               this.psService.sendMessage(false);
-              this.snackBar.open(`${this.localizedVal('Approve failed!', this.localeCategory)}`, 'Ok');
+              this.snackBarRef = this.snackBar.open(`${this.localizedVal('Approve failed!', this.localeCategory)}`, 'Ok');
             });
 
           break;
@@ -453,10 +466,40 @@ export class AssignmentComponent implements OnInit, OnDestroy, OnChanges {
     });
   }
 
-  // eslint-disable-next-line sonarjs/no-identical-functions
   topViewRefresh(): void {
     Object.values(this.formGroup$.controls).forEach((control: any) => {
       control.markAsTouched();
     });
   }
+
+  registerForRefresh() {
+    const refreshConditions = this.pConn$.getCaseInfo()?.getActionRefreshConditions();
+    const pageReference = this.pConn$.getPageReference();
+    const context = this.pConn$.getContextName();
+
+    // refresh api de-registration
+    PCore.getRefreshManager().deRegisterForRefresh(context);
+
+    // refresh api registration
+    const refreshProps = getRefreshProps(refreshConditions);
+    const caseKey = this.pConn$.getCaseInfo().getKey();
+    const refreshOptions = {
+      autoDetectRefresh: true,
+      preserveClientChanges: false
+    };
+    if (refreshProps.length > 0) {
+      refreshProps.forEach(prop => {
+        PCore.getRefreshManager().registerForRefresh(
+          'PROP_CHANGE',
+          this.pConn$.getActionsApi().refreshCaseView.bind(this.pConn$.getActionsApi(), caseKey, '', pageReference, {
+            ...refreshOptions,
+            refreshFor: prop[0]
+          }),
+          `${pageReference}.${prop[1]}`,
+          `${context}/${pageReference}`,
+          context
+        );
+      });
+    }
+  }
 }

package/lib/infra/assignment-card/assignment-card.component.html

@@ -1,5 +1,5 @@
 <form [formGroup]="formGroup$" name="flowContainer" class="psdk-flow-container">
-  <div *ngFor="let kid of arChildren$">
+  <div *ngFor="let kid of childrenArray" class="psdk-assignment-card-child">
     <div [ngSwitch]="kid.getPConnect().getComponentName()">
       <component-mapper *ngSwitchCase="'View'" name="View" [props]="{ formGroup$, pConn$: kid.getPConnect() }"></component-mapper>
       <component-mapper
@@ -14,10 +14,10 @@
 </form>
 
 <div>
-  <br />
   <div class="psdk-case-view-divider"></div>
 
   <component-mapper
+    *ngIf="arMainButtons$ && arSecondaryButtons$"
     name="ActionButtons"
     [props]="{ arMainButtons$, arSecondaryButtons$ }"
     [parent]="this"

package/lib/infra/assignment-card/assignment-card.component.scss

@@ -1,7 +1,3 @@
-.psdk-case-view-divider {
-  border-bottom: 0.0625rem solid var(--app-neutral-light-color);
-}
-
 .psdk-flow-container {
   padding: 0rem 1rem;
 }