Fix attachment issues(specially in '23) and hence the Pipeline (#202)

Author: vishalshrm539

src/app/_components/_templates/case-view/case-view.component.ts

@@ -38,6 +38,7 @@ export class CaseViewComponent implements OnInit {
 
   caseSummaryPConn$: any;
   currentCaseID: string = '';
+  bHasNewAttachments: boolean = false;
 
   constructor(private cdRef: ChangeDetectorRef, private angularPConnect: AngularPConnectService, private utils: Utils) {}
 
@@ -100,6 +101,17 @@ export class CaseViewComponent implements OnInit {
 
   updateHeaderAndSummary() {
     this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps());
+    let hasNewAttachments = this.pConn$.getDataObject().caseInfo?.hasNewAttachments;
+
+    if(hasNewAttachments !== this.bHasNewAttachments){
+      this.bHasNewAttachments = hasNewAttachments;
+      if(this.bHasNewAttachments){
+        this.PCore$.getPubSubUtils().publish(
+          this.PCore$.getEvents().getCaseEvent().CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
+          true
+        );
+      }
+    }
 
     let kids = this.pConn$.getChildren();
     for (let kid of kids) {

src/app/_components/_widgets/file-utility/file-utility.component.ts

@@ -93,12 +93,23 @@ export class FileUtilityComponent implements OnInit {
     this.updateSelf();
 
     this.createModalButtons();
+
+    this.PCore$.getPubSubUtils().subscribe(
+      this.PCore$.getEvents().getCaseEvent().CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
+      this.updateSelf.bind(this),
+      "caseAttachmentsUpdateFromCaseview"
+    );    
   }
 
   ngOnDestroy(): void {
     if (this.angularPConnectData.unsubscribeFn) {
       this.angularPConnectData.unsubscribeFn();
     }
+
+    this.PCore$.getPubSubUtils().unsubscribe(
+      this.PCore$.getEvents().getCaseEvent().CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW,
+      "caseAttachmentsUpdateFromCaseview"
+    );
   }
 
   // Callback passed when subscribing to store change

src/app/_components/attachment/attachment.component.html

@@ -1,23 +1,64 @@
 <div class="psdk-label-infix-readonly">
   <span class="psdk-label-wrapper-readonly">
-    <label class="psdk-label-readonly">{{ label$ }}</label>
+    <label
+      [ngClass]="{
+        'psdk-label-readonly': true,
+        'label-required': bRequired$ === true
+      }"
+      [htmlFor]="att_valueRef"
+      >{{ label$ }}</label
+    >
   </span>
-  <div class="psdk-modal-file-selector" *ngIf="bShowSelector$">
-    <mat-spinner *ngIf="bLoading$" class="progress-spinner" diameter="40"></mat-spinner>
-    <input hidden type="file" #uploader id="upload-input" (change)="uploadMyFiles($event)" />
+  <div
+    [ngClass]="{
+      'psdk-modal-file-selector': status !== 'error',
+      'psdk-modal-file-selector-error': status === 'error'
+    }"
+    id="attachment-container"
+    *ngIf="bShowSelector$"
+  >
+    <mat-spinner
+      *ngIf="bLoading$"
+      class="progress-spinner"
+      diameter="40"
+    ></mat-spinner>
+    <input
+      hidden
+      type="file"
+      [required]="bRequired$"
+      #uploader
+      [id]="att_valueRef"
+      (change)="uploadMyFiles($event)"
+    />
 
-    <button mat-stroked-button color="primary" [disabled]="bDisabled$" (click)="uploader.click()">Upload file</button>
+    <button
+      mat-stroked-button
+      color="primary"
+      [disabled]="bDisabled$"
+      (click)="uploader.click()"
+    >
+      Upload file
+    </button>
+    <span *ngIf="validatemessage" class="file-error">{{
+      validatemessage
+    }}</span>
   </div>
 
-  <div class="psdk-attachment-list" *ngIf="arFileList$ != null && arFileList$.length > 0">
+  <div
+    class="psdk-attachment-list"
+    *ngIf="arFileList$ != null && arFileList$.length > 0"
+  >
     <app-material-summary-list
       *ngIf="bShowJustDelete$; else showfull"
       [arItems$]="arFileList$"
       [menuIconOverride$]="'trash'"
       [menuIconOverrideAction$]="removeFileFromList$"
     ></app-material-summary-list>
     <ng-template #showfull>
-      <app-material-summary-list [arItems$]="arFileList$" [menuIconOverrideAction$]="removeFileFromList$"></app-material-summary-list>
+      <app-material-summary-list
+        [arItems$]="arFileList$"
+        [menuIconOverrideAction$]="removeFileFromList$"
+      ></app-material-summary-list>
     </ng-template>
   </div>
 </div>

src/app/_components/attachment/attachment.component.scss

@@ -1,4 +1,4 @@
-@import '../../_shared/styles.scss';
+@import "../../_shared/styles.scss";
 
 .progress-spinner {
   text-align: center;
@@ -14,13 +14,33 @@
   position: relative;
 }
 
+.label-required::after {
+  display: inline;
+  content: " *";
+  vertical-align: top;
+  color: $app-neutral-dark-color;
+}
+
+.file-error {
+  color: $app-error-light-color;
+}
+
+.psdk-modal-file-selector-error {
+  border: 1px dashed $app-error-light-color;
+  width: 100%;
+  padding: 0.3rem;
+  text-align: center;
+  position: relative;
+}
+
 .psdk-full-width {
   width: 100%;
 }
 
 .psdk-label-readonly {
   opacity: 54%;
-  font-size: 0.7rem;
+  font-size: 0.8rem;
+  font-weight: 400;
 }
 
 .psdk-data-readonly {