33 lines
1.0 KiB
JavaScript
33 lines
1.0 KiB
JavaScript
import { useNMEA } from '../hooks/useNMEA.js'
|
|
import BatteryStatus from '../components/systems/BatteryStatus.jsx'
|
|
import EngineData from '../components/systems/EngineData.jsx'
|
|
import ServiceHealth from '../components/systems/ServiceHealth.jsx'
|
|
|
|
export default function Systems() {
|
|
const { battery1, battery2 } = useNMEA()
|
|
|
|
return (
|
|
<div style={styles.page}>
|
|
<section>
|
|
<div style={styles.sectionTitle}>Batteries</div>
|
|
<BatteryStatus battery1={battery1} battery2={battery2} />
|
|
</section>
|
|
|
|
<section>
|
|
<div style={styles.sectionTitle}>Engine</div>
|
|
<EngineData />
|
|
</section>
|
|
|
|
<section>
|
|
<div style={styles.sectionTitle}>Services</div>
|
|
<ServiceHealth />
|
|
</section>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const styles = {
|
|
page: { padding: 16, display: 'flex', flexDirection: 'column', gap: 20, overflow: 'auto', flex: 1 },
|
|
sectionTitle: { fontWeight: 600, fontSize: 12, color: 'var(--muted)', textTransform: 'uppercase', letterSpacing: '0.06em', marginBottom: 10 },
|
|
}
|