-
-
- Live Event Feed
-
-
+ const content = (
+ <>
{sortedEvents.length > 0 ? (
{sortedEvents.map((event, i) => (
@@ -510,6 +505,18 @@ function LiveEventFeed({ events, envStatus }: { events: EnvEvent[]; envStatus: E
)}
)}
+
+ )
+
+ if (embedded) return
{content}
+
+ return (
+
+
+
+ Live Event Feed
+
+ {content}
)
}
@@ -521,6 +528,7 @@ export default function Dashboard() {
const [envStatus, setEnvStatus] = useState
(null)
const [envEvents, setEnvEvents] = useState([])
const [bandConditions, setBandConditions] = useState(null)
+ const [alertTab, setAlertTab] = useState<'alerts' | 'feed'>('alerts')
const [loading, setLoading] = useState(true)
const [error, setError] = useState(null)
@@ -610,57 +618,85 @@ export default function Dashboard() {
{/* Alerts + Stats */}
- {/* Active Alerts */}
+ {/* Active Alerts / Event Feed โ tabbed */}
-
Active Alerts
- {alerts.length > 0 ? (
-
- {alerts.map((alert, i) => (
-
- ))}
-
- ) : (() => {
- const highSeverityEnv = envEvents
- .filter(e => e.severity === 'immediate' || e.severity === 'priority')
- .sort((a, b) => {
- const ord: Record
= { immediate: 0, priority: 1 }
- const diff = (ord[a.severity] ?? 2) - (ord[b.severity] ?? 2)
- if (diff !== 0) return diff
- return (b.fetched_at || 0) - (a.fetched_at || 0)
- })
- .slice(0, 5)
- if (highSeverityEnv.length > 0) {
- return (
+
+
+
+
+
+ {alertTab === 'alerts' ? (
+ <>
+ {alerts.length > 0 ? (
- {highSeverityEnv.map((ev, i) => {
- const sevStyle = ev.severity === 'immediate'
- ? { bg: 'bg-red-500/10', border: 'border-red-500', icon: AlertCircle, iconColor: 'text-red-500' }
- : { bg: 'bg-amber-500/10', border: 'border-amber-500', icon: AlertTriangle, iconColor: 'text-amber-500' }
- const Icon = sevStyle.icon
- return (
-
-
-
-
- ENV
- {ev.severity}
-
-
{ev.headline}
-
{ev.source} ยท {new Date(ev.fetched_at * 1000).toLocaleTimeString()}
-
-
- )
- })}
+ {alerts.map((alert, i) => (
+
+ ))}
-
- No active alerts
-
- )
- })()}
+ ) : (() => {
+ const highSeverityEnv = envEvents
+ .filter(e => e.severity === 'immediate' || e.severity === 'priority')
+ .sort((a, b) => {
+ const ord: Record = { immediate: 0, priority: 1 }
+ const diff = (ord[a.severity] ?? 2) - (ord[b.severity] ?? 2)
+ if (diff !== 0) return diff
+ return (b.fetched_at || 0) - (a.fetched_at || 0)
+ })
+ .slice(0, 5)
+ if (highSeverityEnv.length > 0) {
+ return (
+
+ {highSeverityEnv.map((ev, i) => {
+ const sevStyle = ev.severity === 'immediate'
+ ? { bg: 'bg-red-500/10', border: 'border-red-500', icon: AlertCircle, iconColor: 'text-red-500' }
+ : { bg: 'bg-amber-500/10', border: 'border-amber-500', icon: AlertTriangle, iconColor: 'text-amber-500' }
+ const Icon = sevStyle.icon
+ return (
+
+
+
+
+ ENV
+ {ev.severity}
+
+
{ev.headline}
+
{ev.source} ยท {new Date(ev.fetched_at * 1000).toLocaleTimeString()}
+
+
+ )
+ })}
+
+
+ No active alerts
+
+ )
+ })()}
+
+ ) : (
+
+ )}
{/* Quick Stats */}
@@ -692,14 +728,10 @@ export default function Dashboard() {
{/* RF Propagation */}
- {/* Live Event Feed */}
-
-
+ {/* Tropo Forecast */}
+