Overhaul of the highlight system

frontend/components/navigation/AlertMenu.tsx

@@ -4,6 +4,7 @@ import React from 'react'
 import { useRouter } from 'next/navigation'
 import useNavigationStore from '@/app/store/navigationStore'
 import AreaChart from '../dashboard/AreaChart'
+import * as statusColors from '../../lib/statusColors'
  
 interface AlertType {
   id: number
@@ -18,7 +19,7 @@ interface AlertType {
   acknowledged: boolean
   priority: string
 }
-
+ 
 interface AlertMenuProps {
   alert: AlertType
   isOpen: boolean
@@ -27,7 +28,7 @@ interface AlertMenuProps {
   compact?: boolean
   anchor?: { left: number; top: number } | null
 }
-
+ 
 const AlertMenu: React.FC<AlertMenuProps> = ({ alert, isOpen, onClose, getStatusText, compact = false, anchor = null }) => {
   const router = useRouter()
   const { setSelectedDetector, currentObject } = useNavigationStore()
@@ -56,17 +57,19 @@ const AlertMenu: React.FC<AlertMenuProps> = ({ alert, isOpen, onClose, getStatus
   }
 
   const getStatusColorCircle = (status: string) => {
-    // Use hex colors from Alerts submenu system
-    if (status === '#b3261e') return 'bg-red-500'
-    if (status === '#fd7c22') return 'bg-orange-500'
-    if (status === '#00ff00') return 'bg-green-500'
+    if (status === statusColors.STATUS_COLOR_CRITICAL) return 'bg-red-500'
+    if (status === statusColors.STATUS_COLOR_WARNING) return 'bg-orange-500'
+    if (status === statusColors.STATUS_COLOR_NORMAL) return 'bg-green-500'
     
-    // Fallback for text-based status
     switch (status?.toLowerCase()) {
-      case 'critical': return 'bg-red-500'
-      case 'warning': return 'bg-orange-500'
-      case 'normal': return 'bg-green-500'
-      default: return 'bg-gray-500'
+      case 'critical':
+        return 'bg-red-500'
+      case 'warning':
+        return 'bg-orange-500'
+      case 'normal':
+        return 'bg-green-500'
+      default:
+        return 'bg-gray-500'
     }
   }
 
@@ -339,4 +342,4 @@ const AlertMenu: React.FC<AlertMenuProps> = ({ alert, isOpen, onClose, getStatus
   )
 }
 
-export default AlertMenu
+export default AlertMenu

frontend/components/navigation/FloorNavigation.tsx

@@ -1,11 +1,12 @@
 'use client'
-
+ 
 import React, { useState } from 'react'
+import * as statusColors from '../../lib/statusColors'
  
 interface DetectorsDataType {
   detectors: Record<string, DetectorType>
 }
-
+ 
 interface FloorNavigationProps {
   objectId?: string
   detectorsData: DetectorsDataType
@@ -13,7 +14,7 @@ interface FloorNavigationProps {
   onClose?: () => void
   is3DReady?: boolean
 }
-
+ 
 interface DetectorType {
   detector_id: number
   name: string
@@ -34,7 +35,7 @@ interface DetectorType {
     priority: string
   }>
 }
-
+ 
 const FloorNavigation: React.FC<FloorNavigationProps> = (props) => {
   const { objectId, detectorsData, onDetectorMenuClick, onClose, is3DReady = true } = props
   const [expandedFloors, setExpandedFloors] = useState<Set<number>>(new Set())
@@ -81,19 +82,27 @@ const FloorNavigation: React.FC<FloorNavigationProps> = (props) => {
 
   const getStatusColor = (status: string) => {
     switch (status) {
-      case '#b3261e': return 'bg-red-500'
-      case '#fd7c22': return 'bg-orange-500'
-      case '#00ff00': return 'bg-green-500'
-      default: return 'bg-gray-500'
+      case statusColors.STATUS_COLOR_CRITICAL:
+        return 'bg-red-500'
+      case statusColors.STATUS_COLOR_WARNING:
+        return 'bg-orange-500'
+      case statusColors.STATUS_COLOR_NORMAL:
+        return 'bg-green-500'
+      default:
+        return 'bg-gray-500'
     }
   }
-
+ 
   const getStatusText = (status: string) => {
     switch (status) {
-      case '#b3261e': return 'Критический'
-      case '#fd7c22': return 'Предупреждение'
-      case '#00ff00': return 'Норма'
-      default: return 'Неизвестно'
+      case statusColors.STATUS_COLOR_CRITICAL:
+        return 'Критический'
+      case statusColors.STATUS_COLOR_WARNING:
+        return 'Предупреждение'
+      case statusColors.STATUS_COLOR_NORMAL:
+        return 'Норма'
+      default:
+        return 'Неизвестно'
     }
   }
 
@@ -223,4 +232,4 @@ const FloorNavigation: React.FC<FloorNavigationProps> = (props) => {
   )
 }
 
-export default FloorNavigation
+export default FloorNavigation

frontend/components/navigation/ListOfDetectors.tsx

@@ -1,6 +1,7 @@
 'use client'
 
 import React, { useState } from 'react'
+import * as statusColors from '../../lib/statusColors'
 
 interface DetectorsDataType {
   detectors: Record<string, DetectorType>
@@ -58,19 +59,27 @@ const ListOfDetectors: React.FC<ListOfDetectorsProps> = ({ objectId, detectorsDa
 
   const getStatusColor = (status: string) => {
     switch (status) {
-      case '#b3261e': return 'bg-red-500'
-      case '#fd7c22': return 'bg-orange-500'
-      case '#00ff00': return 'bg-green-500'
-      default: return 'bg-gray-500'
+      case statusColors.STATUS_COLOR_CRITICAL:
+        return 'bg-red-500'
+      case statusColors.STATUS_COLOR_WARNING:
+        return 'bg-orange-500'
+      case statusColors.STATUS_COLOR_NORMAL:
+        return 'bg-green-500'
+      default:
+        return 'bg-gray-500'
     }
   }
 
   const getStatusText = (status: string) => {
     switch (status) {
-      case '#b3261e': return 'Критический'
-      case '#fd7c22': return 'Предупреждение'
-      case '#00ff00': return 'Норма'
-      default: return 'Неизвестно'
+      case statusColors.STATUS_COLOR_CRITICAL:
+        return 'Критический'
+      case statusColors.STATUS_COLOR_WARNING:
+        return 'Предупреждение'
+      case statusColors.STATUS_COLOR_NORMAL:
+        return 'Норма'
+      default:
+        return 'Неизвестно'
     }
   }
 
@@ -168,4 +177,4 @@ const ListOfDetectors: React.FC<ListOfDetectorsProps> = ({ objectId, detectorsDa
   )
 }
 
-export default ListOfDetectors
+export default ListOfDetectors