Merge pull request #2770 from shubhamkumar9199/fix/error-dialog-type-guard

WEB-(407)-fix: add null safety and type guard for ErrorDialogComponent data

src/app/shared/error-dialog/error-dialog.component.html

@@ -1,8 +1,8 @@
 <h1 mat-dialog-title>{{ 'Error Log' | translate }}</h1>
 
 <div mat-dialog-content>
-  <p *ngIf="!showAsCode">{{ data }}</p>
+  <p *ngIf="!showAsCode">{{ displayData }}</p>
-  <span *ngIf="showAsCode" [innerHTML]="data"></span>
+  <span *ngIf="showAsCode" [innerHTML]="sanitizedData"></span>
 </div>
 
 <mat-dialog-actions align="left">

src/app/shared/error-dialog/error-dialog.component.ts

@@ -1,5 +1,5 @@
 /** Angular Imports. */
-import { Component, OnInit, Inject } from '@angular/core';
+import { Component, OnInit, Inject, SecurityContext } from '@angular/core';
 import {
   MatDialogRef,
   MAT_DIALOG_DATA,
@@ -9,6 +9,7 @@ import {
   MatDialogClose
 } from '@angular/material/dialog';
 import { CdkScrollable } from '@angular/cdk/scrolling';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 @Component({
@@ -28,12 +29,35 @@ export class ErrorDialogComponent {
   showAsCode = false;
   /**
    * @param {MatDialogRef} dialogRef Component reference to dialog.
-   * @param {any} data Provides any data.
+   * @param {unknown} data Provides any data.
+   * @param {DomSanitizer} sanitizer Service to sanitize HTML content.
    */
   constructor(
     public dialogRef: MatDialogRef<ErrorDialogComponent>,
-    @Inject(MAT_DIALOG_DATA) public data: string
+    @Inject(MAT_DIALOG_DATA) public data: unknown,
+    private sanitizer: DomSanitizer
   ) {
-    this.showAsCode = data.startsWith('<pre><code>');
+    // Guard for non-string data to avoid runtime error
+    this.showAsCode = typeof data === 'string' && data.startsWith('<pre><code>');
+  }
+
+  /**
+   * Get display data with proper type safety for template usage.
+   * @returns {string} Safe string representation of the data.
+   */
+  get displayData(): string {
+    if (typeof this.data === 'string') {
+      return this.data;
+    }
+    // Convert non-string data to string representation for display
+    return this.data != null ? JSON.stringify(this.data) : '';
+  }
+
+  /**
+   * Get sanitized HTML content for safe rendering.
+   * @returns {SafeHtml} Sanitized HTML content.
+   */
+  get sanitizedData(): SafeHtml {
+    return this.sanitizer.sanitize(SecurityContext.HTML, this.displayData) || '';
   }
 }