MOSIP-25193 : Resolve Reliability Bugs on Admin-UI

admin-ui/src/app/features/bulkupload/masterdataupload/create/create.component.html

@@ -49,7 +49,7 @@ <h3>{{labelanddatas.title |translate}}</h3>
                   {{'genericerror.fieldValidation' | translate}}
                 </mat-error>              
               </mat-form-field>                
-              <mat-label style="width:2%" *ngIf="showDownloadBtn" (click)="downloadExcel()"><img src="assets/images/download.png" height="18px" width="18px" style="cursor:pointer;" /></mat-label>
+              <mat-label style="width:2%" *ngIf="showDownloadBtn" (click)="downloadExcel()"><img src="assets/images/download.png"  alt="Download Excel" height="18px" width="18px" style="cursor:pointer;" /></mat-label>
             </div>
             <div class="custom-file-input">    
               <input type="button" *ngIf="buttonalignment === 'rtl'" value="{{labelanddatas.chooseFile | translate }}" class="browseInput">           

admin-ui/src/app/features/masterdata/document-category-mapping/document-category-mapping.component.ts

@@ -56,15 +56,16 @@ export class DocumentCategoryMappingComponent implements OnInit {
         });
         this.docCategoryMapping.setMappedDoc(this.allDocCategoryList[0]);
         this.docCategoryMapping.currentMappedDocList.subscribe(response => {
-          this.docCategoryMapping.getMappedDoc(response.code, response.langCode).subscribe(async mappedDoc => {
-            if (mappedDoc && mappedDoc.response) {
-              await this.getUnMappedDoc();
-              this.subtractingMappedDocFromUnMappedDoc(mappedDoc.response, this.unMappedDoc);
-              this.showSpinner = false;
-            } else {
-              this.mappedDocList = [];
-              this.unMappedDoc = [];
-            }
+          this.docCategoryMapping.getMappedDoc(response.code, response.langCode).subscribe(mappedDoc => {
+              if (mappedDoc && mappedDoc.response) {
+                  this.getUnMappedDoc().then(() => {
+                      this.subtractingMappedDocFromUnMappedDoc(mappedDoc.response, this.unMappedDoc);
+                      this.showSpinner = false;
+                  });
+              } else {
+                  this.mappedDocList = [];
+                  this.unMappedDoc = [];
+              }
           });
         });
       }
@@ -125,18 +126,19 @@ export class DocumentCategoryMappingComponent implements OnInit {
     this.selectedItem = item['code'];
     this.docCategoryMapping.setMappedDoc(item);
     this.docCategoryMapping.currentMappedDocList.subscribe(response => {
-      this.docCategoryMapping.getMappedDoc(response.code, response.langCode).subscribe(async data => {
+      this.docCategoryMapping.getMappedDoc(response.code, response.langCode).subscribe(data => {
         if (data && data.response && data.response.documents) {
-          await this.getUnMappedDoc();
-          this.subtractingMappedDocFromUnMappedDoc(data.response.documents, this.unMappedDoc);
-          this.showSpinner = false;
+            this.getUnMappedDoc().then(() => {
+                this.subtractingMappedDocFromUnMappedDoc(data.response.documents, this.unMappedDoc);
+                this.showSpinner = false;
+            });
         }
       });
     });
   }
 
   onClose(mappedItem: object, index: number) {
-    this.docCategoryMapping.updateUnMappeddoc(this.selectedItem, mappedItem['code']).subscribe(async data => {
+    this.docCategoryMapping.updateUnMappeddoc(this.selectedItem, mappedItem['code']).subscribe(data => {
       //console.log('Data', data);
     });
     if (mappedItem && (index >= 0)) {
@@ -150,7 +152,7 @@ export class DocumentCategoryMappingComponent implements OnInit {
   }
 
   onAdd(unMappedItem: object, index: number) {
-      this.docCategoryMapping.updateMappedDoc(this.selectedItem, unMappedItem['code']).subscribe(async data => {
+      this.docCategoryMapping.updateMappedDoc(this.selectedItem, unMappedItem['code']).subscribe(data => {
         //console.log('Data', data);
       });
     if (unMappedItem && (index >= 0) ) {

admin-ui/src/app/features/masterdata/list-view/list-view.component.ts

@@ -81,8 +81,8 @@ export class ListViewComponent implements OnDestroy {
     }
   }
 
-  loadBlacklistedWords() {
-    return new Promise(async (resolve, reject) => {
+  loadBlacklistedWords(): void {
+    new Promise(async (resolve, reject) => {
       const data = [];
       await this.getMasterDataTypeValues('all').then(response => {
         if (response['data']) {

admin-ui/src/app/features/masterdata/single-view/single-view.component.ts

@@ -213,11 +213,11 @@ export class SingleViewComponent implements OnDestroy {
         disableClose: true
       })
       .afterClosed()
-      .subscribe(() =>
+      .subscribe(() => {
         this.router.navigateByUrl(
           `admin/masterdata/${this.masterdataType}/view`
-        )
-      );
+        );
+      });
   }
 
   changePage(location: string) {

admin-ui/src/app/features/packet-status/packet-status/packet-status.component.html

@@ -14,19 +14,24 @@
             <div><img src="./assets/images/Packet_Status.png" alt="" height="100px" width="100px"></div>
             <div>
                 <table>
+                    <caption>Packet Status Information</caption>
                     <tr>
-                        <td>{{'packet-status.id' | translate}}</td><td><strong>{{data[0].registrationId}}</strong></td>
+                        <th>{{'packet-status.id' | translate}}</th>
+                        <td><strong>{{data[0].registrationId}}</strong></td>
                     </tr>
                     <tr>
-                        <td>{{'packet-status.status' | translate}}</td><td><strong>{{statusCheck}}</strong></td>
+                        <th>{{'packet-status.status' | translate}}</th>
+                        <td><strong>{{statusCheck}}</strong></td>
                     </tr>
                 </table>
             </div>
             <div>
                 <table>
+                    <caption>Timeline</caption>
                     <tr (click)="viewMore()">
-                        <td *ngIf="!showTimeline">{{'packet-status.viewMore' | translate}}</td>
-                        <td *ngIf="showTimeline" >{{'packet-status.viewLess' | translate}}</td><td>
+                        <th *ngIf="!showTimeline">{{'packet-status.viewMore' | translate}}</th>
+                        <th *ngIf="showTimeline">{{'packet-status.viewLess' | translate}}</th>
+                        <td>
                             <i *ngIf="!showTimeline" class="material-icons">keyboard_arrow_down</i>
                             <i *ngIf="showTimeline" class="material-icons">keyboard_arrow_up</i>
                         </td>
@@ -50,6 +55,10 @@ <h3><div *ngIf = "item.transactionTypeCode">{{item.transactionTypeCode.replace("
             <div><img src="./assets/images/Packet_Status.png" alt="" height="100px" width="100px"></div>
             <div>
                 <table>
+                    <caption>Error Information</caption>
+                    <tr>
+                        <th>Error Message</th>
+                    </tr>
                     <tr>
                         <td><strong>{{errorMessage}}</strong></td>
                     </tr>

admin-ui/src/app/features/packet-status/packet-status/packet-status.component.scss

@@ -174,4 +174,9 @@
 
 h3 {
     font-size: 10.5px;
+}
+
+caption {
+    font-size: 1.2em;
+    font-weight: bold;
 }

admin-ui/src/app/features/resources/center/edit/edit.component.ts

@@ -462,9 +462,9 @@ export class EditComponent {
         disableClose: true
       })
       .afterClosed()
-      .subscribe(() =>
+      .subscribe(() => {
         this.router.navigateByUrl(`admin/resources/centers/view`)
-      );
+      });
   }
 
   handleChangeSecondaryLang = (fieldName: string) => {

admin-ui/src/app/features/resources/devices/create/create.component.ts

@@ -330,7 +330,10 @@ export class CreateComponent{
         case: 'MESSAGE'
       },
       disableClose: true
-    }).afterClosed().subscribe(() => this.router.navigateByUrl('admin/resources/devices/view'));
+    }).afterClosed()
+    .subscribe(() => {
+      this.router.navigateByUrl('admin/resources/devices/view')
+    });
   }
 
   setHeaderData() {
@@ -581,8 +584,8 @@ export class CreateComponent{
         disableClose: true
       })
       .afterClosed()
-      .subscribe(() =>
+      .subscribe(() => {
         this.router.navigateByUrl(`admin/resources/devices/view`)
-      );
+      });
   }
 }

admin-ui/src/app/features/resources/machines/create/create.component.ts

@@ -332,9 +332,9 @@ export class CreateComponent {
         disableClose: true,
       })
       .afterClosed()
-      .subscribe(() =>
+      .subscribe(() => {
         this.router.navigateByUrl('admin/resources/machine/view')
-      );
+      });
   }
 
   setPrimaryData() {
@@ -596,8 +596,8 @@ export class CreateComponent {
         disableClose: true,
       })
       .afterClosed()
-      .subscribe(() =>
+      .subscribe(() => {
         this.router.navigateByUrl(`admin/resources/machines/view`)
-      );
+      });
   }
 }

admin-ui/src/app/features/resources/users/create/create.component.scss

@@ -1,5 +1,5 @@
 p {
-  font-family: Lato;
+  font-family: "Lato", sans-serif;
 }
 
 .example-form-field {

admin-ui/src/app/features/resources/users/create/create.component.ts

@@ -193,7 +193,10 @@ export class CreateComponent{
         case: 'MESSAGE'
       },
       disableClose: true
-    }).afterClosed().subscribe(() => this.router.navigateByUrl('admin/resources/devices/view'));
+    }).afterClosed()
+    .subscribe(() => {
+      this.router.navigateByUrl('admin/resources/devices/view')
+    });
   }
 
   ngOnDestroy() {
@@ -333,9 +336,7 @@ export class CreateComponent{
         if (response.response.data) {
           this.data = response.response.data;
           if(url === "zoneuser"){
-            this.primaryData = {userId:this.data[0].userId, zone:this.data[0].zoneCode, regCenterId:this.data[0].regCenterId, name: this.data[0].userName}
-          }else{
-            this.primaryData = {userId:this.data[0].userId, zone:this.data[0].zoneCode, regCenterId:this.data[0].regCenterId, name: this.data[0].userName}
+          this.primaryData = {userId:this.data[0].userId, zone:this.data[0].zoneCode, regCenterId:this.data[0].regCenterId, name: this.data[0].userName};
           }
           this.initializeheader();
         } else {

admin-ui/src/app/shared/dialog/dialog.component.html

@@ -5,6 +5,7 @@
     <h2 class="filter-heading">{{ input.title[primaryLangCode] }}</h2>
     <mat-divider></mat-divider>
     <table class="mat-table">
+      <caption>Missing Data Table</caption>
       <tr class="mat-row sticky-header" >
         <th class="mat-header-cell table-header sticky-header"  *ngFor="let col of input.columnNames;">
           <span>{{col[primaryLangCode]}}</span>
@@ -180,6 +181,7 @@ <h2 class="filter-heading">{{ "filters.titleTxt" | translate }}</h2>
       >
         <img
           src="assets/images/refresh.png"
+          alt="Refresh Icon"
           height="15px; width:12px;"
         />&nbsp;{{ "filters.footerButtons.resetTxt" | translate }}
       </button>
@@ -238,6 +240,7 @@ <h2 class="filter-heading">{{ "filters.titleTxt" | translate }}</h2>
 <div class="pop-up" *ngIf="input.case === 'MESSAGE'">
   <img
     src="assets/images/icon_Suceess right.png"
+    alt="Success Icon"
     height="45px"
     width="45px"
     class="success-img"

admin-ui/src/app/shared/dialog/dialog.component.scss

@@ -230,3 +230,8 @@ td.mat-footer-cell:last-child {
 .image-fade {
   opacity: 0.2;
 }
+
+caption {
+  font-size: 1.2em;
+  font-weight: bold;
+}

admin-ui/src/app/shared/dialog/dialog.component.ts

@@ -384,18 +384,12 @@ export class DialogComponent implements OnInit {
           filter[0].dropdown === 'false' &&
           filter[0].autocomplete === 'true'
         ) {
-          if (
-            this.filterGroup.controls[key].value.toString().endsWith('*') &&
-            this.filterGroup.controls[key].value.toString().startsWith('*')
-          ) {
+          const filterValue = this.filterGroup.controls[key].value.toString();
+          if (filterValue.endsWith('*') && filterValue.startsWith('*')) {
             filterType = 'contains';
-          } else if (
-            this.filterGroup.controls[key].value.toString().endsWith('*')
-          ) {
+          } else if (filterValue.endsWith('*')) {
             filterType = 'contains';
-          } else if (
-            this.filterGroup.controls[key].value.toString().includes('*')
-          ) {
+          } else if (filterValue.includes('*')) {
             filterType = 'contains';
           } else {
             filterType = 'contains';

admin-ui/src/app/shared/table/table.component.html

@@ -19,16 +19,19 @@
             ><img
               *ngIf="sortIconTrackerArray[i] === 0"
               src="assets/images/icon_table_sort_both.png"
+              alt="Sort Both Icon"
               height="20px"
               width="13px"
               class="sort-icon" /><img
               *ngIf="sortIconTrackerArray[i] === 1"
               src="assets/images/icon_table_sort_up.png"
+              alt="Sort Up Icon"
               height="20px"
               width="13px"
               class="sort-icon" /><img
               *ngIf="sortIconTrackerArray[i] === -1"
               src="assets/images/icon_table_sort_Down.png"
+              alt="Sort Down Icon"
               height="20px"
               width="13px"
               class="sort-icon" /></span

admin-ui/src/app/shared/table/table.component.scss

@@ -124,4 +124,9 @@ td.mat-footer-cell:last-child {
 }
 .mat-header-cell:first-child,.mat-cell:first-child{
   text-align:left;
+}
+
+caption {
+  font-size: 1.2em;
+  font-weight: bold;
 }

admin-ui/src/app/shared/table/table.component.ts

@@ -173,42 +173,30 @@ export class TableComponent implements OnInit, OnChanges {
       this.ellipsisList = JSON.parse(JSON.stringify(this.buttonList));
       if (!this.isUser) {
         // user mapping center menu options
-        this.ellipsisList.filter((values, i) => {
-          values.filter(value => {
-            if (value.buttonName.eng === 'Activate') {
-              const index = this.ellipsisList[i].indexOf(value);
-              this.ellipsisList[i].splice(index, 1);
-            }
-          })
+        this.ellipsisList.forEach((values, i) => {
+          this.ellipsisList[i] = values.filter(value => {
+            return value.buttonName.eng !== 'Activate';
+          });
         });
       } else{
-      this.ellipsisList.filter(values => {
-        if (values.buttonName.eng === 'Activate') {
-          const index = this.ellipsisList.indexOf(values);
-          this.ellipsisList.splice(index, 1);
-        }
-      });
+        this.ellipsisList = this.ellipsisList.filter(values => {
+          return values.buttonName.eng !== 'Activate';
+        });
     }
     } else if (data.isActive === false) {
       // this.ellipsisList = [...this.buttonList];
       this.ellipsisList = JSON.parse(JSON.stringify(this.buttonList));
       if (!this.isUser) {
         // user mapping center menu options
-        this.ellipsisList.filter((values, i) => {
-          values.filter(value => {
-            if (value.buttonName.eng === 'Deactivate') {
-              const index = this.ellipsisList[i].indexOf(value);
-              this.ellipsisList[i].splice(index, 1);
-            }
-          })
+        this.ellipsisList.forEach((values, i) => {
+          this.ellipsisList[i] = values.filter(value => {
+            return value.buttonName.eng !== 'Deactivate';
+          });
         });
       } else{
-      this.ellipsisList.filter(values => {
-        if (values.buttonName.eng === 'Deactivate') {
-          const index = this.ellipsisList.indexOf(values);
-          this.ellipsisList.splice(index, 1);
-        }
-      });
+        this.ellipsisList = this.ellipsisList.filter(values => {
+            return values.buttonName.eng !== 'Deactivate';
+          });
     }
     }else{
       this.ellipsisList = [...this.buttonList];

admin-ui/src/app/shared/toolbar/toolbar.component.html

@@ -12,7 +12,7 @@
           'filter-button-style': button.buttonName.eng === 'Filter'
         }"
       >
-        <img [src]="button.imagePath" height="14px" width="14px"/>
+        <img [src]="button.imagePath"  alt="Button Icon" height="14px" width="14px"/>
         <span>{{ button.buttonName[lang]}}</span>
         <span class="filter-placer" *ngIf="button.buttonName.eng === 'Filter' && filtersAppliedFlag">
           <i style="font-size: 16px;" class="material-icons">fiber_manual_record</i>