Overhaul of the highlight system

frontend/components/reports/ReportsList.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import React, { useState, useMemo } from 'react';
+import * as statusColors from '../../lib/statusColors';
 
 interface NotificationType {
   id: number;
@@ -78,19 +79,27 @@ const ReportsList: React.FC<ReportsListProps> = ({ detectorsData, initialSearchT
 
   const getStatusColor = (type: string) => {
     switch (type) {
-      case 'critical': return '#b3261e';
-      case 'warning': return '#fd7c22';
-      case 'info': return '#00ff00';
-      default: return '#666';
+      case 'critical':
+        return statusColors.STATUS_COLOR_CRITICAL;
+      case 'warning':
+        return statusColors.STATUS_COLOR_WARNING;
+      case 'info':
+        return statusColors.STATUS_COLOR_NORMAL;
+      default:
+        return statusColors.STATUS_COLOR_UNKNOWN;
     }
   };
 
   const getPriorityColor = (priority: string) => {
     switch (priority) {
-      case 'high': return '#b3261e';
-      case 'medium': return '#fd7c22';
-      case 'low': return '#00ff00';
-      default: return '#666';
+      case 'high':
+        return statusColors.STATUS_COLOR_CRITICAL;
+      case 'medium':
+        return statusColors.STATUS_COLOR_WARNING;
+      case 'low':
+        return statusColors.STATUS_COLOR_NORMAL;
+      default:
+        return statusColors.STATUS_COLOR_UNKNOWN;
     }
   };
 
@@ -278,4 +287,4 @@ const ReportsList: React.FC<ReportsListProps> = ({ detectorsData, initialSearchT
   );
 };
 
-export default ReportsList;
+export default ReportsList;