Handle API response where report category returns '(NULL)' string, displaying empty cell instead of null text in table

Author: Omar-Nabil2

src/app/system/manage-reports/manage-reports.component.html

@@ -42,7 +42,9 @@
 
       <ng-container matColumnDef="reportCategory">
         <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Report Category' | translate }}</th>
-        <td mat-cell *matCellDef="let report">{{ report.reportCategory | translateKey: 'catalogs' }}</td>
+        <td mat-cell *matCellDef="let report">
+          {{ report.reportCategory ? (report.reportCategory | translateKey: 'catalogs') : '' }}
+        </td>
       </ng-container>
 
       <ng-container matColumnDef="coreReport">

src/app/system/manage-reports/manage-reports.component.ts

@@ -35,6 +35,7 @@ import { CompletionDialogComponent } from '../../configuration-wizard/completion
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { MatTooltip } from '@angular/material/tooltip';
 import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
+import { log } from 'console';
 
 /**
  * Manage Reports Component.
@@ -104,6 +105,7 @@ export class ManageReportsComponent implements OnInit, AfterViewInit {
   constructor() {
     this.route.data.subscribe((data: { reports: any }) => {
       this.reportsData = data.reports;
+      console.log('Reports Data:', this.reportsData);
     });
   }
 
@@ -118,7 +120,14 @@ export class ManageReportsComponent implements OnInit, AfterViewInit {
    * Initializes the data source, paginator and sorter for reports table.
    */
   setReports() {
-    this.dataSource = new MatTableDataSource(this.reportsData);
+    // Transform data to replace "(NULL)" strings with null
+    const transformedData = this.reportsData.map((report: any) => ({
+      ...report,
+      reportCategory: report.reportCategory === '(NULL)' ? null : report.reportCategory,
+      description: report.description === '(NULL)' ? null : report.description
+    }));
+
+    this.dataSource = new MatTableDataSource(transformedData);
     this.dataSource.paginator = this.paginator;
     this.dataSource.sort = this.sort;
   }