From b18488873ff86354180f18572ae669b2e2e3a6f6 Mon Sep 17 00:00:00 2001
From: LeoLi727 <84764115+LeoLi727@users.noreply.github.com>
Date: Sun, 6 Apr 2025 11:12:25 -0400
Subject: [PATCH] Added reminder message to remind users when there is no
 notification (#2382)

---
 .../notifications-page.component.html         | 26 +++++++++++++------
 1 file changed, 18 insertions(+), 8 deletions(-)

diff --git a/src/app/notifications/notifications-page/notifications-page.component.html b/src/app/notifications/notifications-page/notifications-page.component.html
index a8849d2ba..dd6f13346 100644
--- a/src/app/notifications/notifications-page/notifications-page.component.html
+++ b/src/app/notifications/notifications-page/notifications-page.component.html
@@ -2,15 +2,21 @@
   <div class="mat-elevation-z8">
     <table mat-table [dataSource]="dataSource" matSort>
       <ng-container matColumnDef="notification">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Notification' | translate }}</th>
-        <td mat-cell *matCellDef="let notification">{{ notification.content }}</td>
+        <th mat-header-cell *matHeaderCellDef mat-sort-header>
+          {{ 'labels.inputs.Notification' | translate }}
+        </th>
+        <td mat-cell *matCellDef="let notification">
+          {{ notification.content }}
+        </td>
       </ng-container>
-
       <ng-container matColumnDef="createdAt">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Created At' | translate }}</th>
-        <td mat-cell *matCellDef="let notification">{{ notification.createdAt }}</td>
+        <th mat-header-cell *matHeaderCellDef mat-sort-header>
+          {{ 'labels.inputs.Created At' | translate }}
+        </th>
+        <td mat-cell *matCellDef="let notification">
+          {{ notification.createdAt }}
+        </td>
       </ng-container>
-
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
       <tr
         mat-row
@@ -18,8 +24,12 @@
         class="select-row"
         [routerLink]="[routeMap[row.objectType], row.objectId]"
       ></tr>
+      <tr *matNoDataRow>
+        <td [attr.colspan]="displayedColumns.length" style="text-align: center; padding: 16px; color: #999">
+          You don't have any notifications
+        </td>
+      </tr>
     </table>
-
     <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
   </div>
-</div>
+</div>
\ No newline at end of file