diff --git a/client/src/components/MovementAlertsPanel.jsx b/client/src/components/MovementAlertsPanel.jsx
index 7246338..36e9c6f 100644
--- a/client/src/components/MovementAlertsPanel.jsx
+++ b/client/src/components/MovementAlertsPanel.jsx
@@ -1,5 +1,6 @@
import React, { useState } from 'react';
import { format } from 'date-fns';
+import { formatFrequency } from '../utils/formatFrequency';
import { useSocket } from '../contexts/SocketContext';
import { useTranslation } from '../utils/tempTranslations';
import {
@@ -184,7 +185,7 @@ const MovementAlertsPanel = () => {
diff --git a/client/src/pages/Dashboard.jsx b/client/src/pages/Dashboard.jsx
index 664d5df..33d849e 100644
--- a/client/src/pages/Dashboard.jsx
+++ b/client/src/pages/Dashboard.jsx
@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
import { useSocket } from '../contexts/SocketContext';
import MovementAlertsPanel from '../components/MovementAlertsPanel';
import api from '../services/api';
+import { formatFrequency } from '../utils/formatFrequency';
import { t } from '../utils/tempTranslations'; // Temporary translation system
import {
ServerIcon,
@@ -319,7 +320,7 @@ const Dashboard = () => {
{detection.device.name || `Device ${detection.device_id}`} •
RSSI: {detection.rssi}dBm •
- Freq: {detection.freq}MHz
+ Freq: {formatFrequency(detection.freq)}
{format(new Date(detection.server_timestamp), 'HH:mm:ss')}
diff --git a/client/src/pages/Debug.jsx b/client/src/pages/Debug.jsx
index aee1337..d4d75db 100644
--- a/client/src/pages/Debug.jsx
+++ b/client/src/pages/Debug.jsx
@@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react';
import api from '../services/api';
import { format } from 'date-fns';
+import { formatFrequency } from '../utils/formatFrequency';
import {
BugAntIcon,
ExclamationTriangleIcon,
@@ -320,7 +321,7 @@ const Debug = () => {
{detection.rssi} dBm
- {detection.freq} MHz
+ {formatFrequency(detection.freq)}
|
{detection.threat_level ? (
diff --git a/client/src/pages/Detections.jsx b/client/src/pages/Detections.jsx
index 41bc10a..a3820b8 100644
--- a/client/src/pages/Detections.jsx
+++ b/client/src/pages/Detections.jsx
@@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react';
import api from '../services/api';
import { format } from 'date-fns';
+import { formatFrequency } from '../utils/formatFrequency';
import { t } from '../utils/tempTranslations'; // Temporary translation system
import {
MagnifyingGlassIcon,
@@ -214,7 +215,7 @@ const Detections = () => {
|
- {detection.freq} MHz
+ {formatFrequency(detection.freq)}
|
diff --git a/client/src/pages/MapView.jsx b/client/src/pages/MapView.jsx
index 3853ecf..96d8dd0 100644
--- a/client/src/pages/MapView.jsx
+++ b/client/src/pages/MapView.jsx
@@ -6,6 +6,7 @@ import L from 'leaflet'; // For divIcon and other Leaflet utilities
import { useSocket } from '../contexts/SocketContext';
import api from '../services/api';
import { format } from 'date-fns';
+import { formatFrequency } from '../utils/formatFrequency';
import { t } from '../utils/tempTranslations';
import {
ServerIcon,
@@ -742,7 +743,7 @@ const DevicePopup = ({ device, status, detections }) => (
{detections.slice(0, 3).map((detection, index) => (
- Drone {detection.drone_id} • {detection.freq}MHz • {detection.rssi}dBm
+ Drone {detection.drone_id} • {formatFrequency(detection.freq)} • {detection.rssi}dBm
))}
@@ -833,7 +834,7 @@ const DroneDetectionPopup = ({ detection, age, droneTypes, droneDetectionHistory
{t('map.frequency')}:
- {detection.freq}MHz
+ {formatFrequency(detection.freq)}
diff --git a/client/src/utils/formatFrequency.js b/client/src/utils/formatFrequency.js
new file mode 100644
index 0000000..0e5ac68
--- /dev/null
+++ b/client/src/utils/formatFrequency.js
@@ -0,0 +1,48 @@
+/**
+ * Format frequency value with appropriate units (MHz or GHz)
+ * @param {number} frequency - Frequency value in MHz
+ * @returns {string} Formatted frequency string with appropriate units
+ */
+export const formatFrequency = (frequency) => {
+ if (!frequency && frequency !== 0) {
+ return 'N/A';
+ }
+
+ const freq = parseFloat(frequency);
+
+ // Convert to GHz if frequency is 1000 MHz or higher
+ if (freq >= 1000) {
+ const ghz = freq / 1000;
+ // Show one decimal place for GHz if needed
+ return ghz % 1 === 0 ? `${ghz} GHz` : `${ghz.toFixed(1)} GHz`;
+ }
+
+ // Show MHz for frequencies below 1000 MHz
+ return freq % 1 === 0 ? `${freq} MHz` : `${freq.toFixed(1)} MHz`;
+};
+
+/**
+ * Get frequency display info (value and unit separately)
+ * @param {number} frequency - Frequency value in MHz
+ * @returns {object} Object with value and unit properties
+ */
+export const getFrequencyInfo = (frequency) => {
+ if (!frequency && frequency !== 0) {
+ return { value: 'N/A', unit: '' };
+ }
+
+ const freq = parseFloat(frequency);
+
+ if (freq >= 1000) {
+ const ghz = freq / 1000;
+ return {
+ value: ghz % 1 === 0 ? ghz : ghz.toFixed(1),
+ unit: 'GHz'
+ };
+ }
+
+ return {
+ value: freq % 1 === 0 ? freq : freq.toFixed(1),
+ unit: 'MHz'
+ };
+};
\ No newline at end of file
|