36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
interface Props {
|
|
level?: 'warning' | 'critical';
|
|
temp?: number;
|
|
dewPoint?: number;
|
|
}
|
|
|
|
export default function DewAlert({ level, temp, dewPoint }: Props) {
|
|
if (!level) return null;
|
|
|
|
const margin = temp != null && dewPoint != null ? (temp - dewPoint).toFixed(1) : null;
|
|
|
|
return (
|
|
<div style={{
|
|
background: level === 'critical' ? 'rgba(224,82,82,0.2)' : 'rgba(232,192,48,0.15)',
|
|
border: `1px solid ${level === 'critical' ? 'var(--danger)' : 'var(--warn)'}`,
|
|
borderRadius: 4,
|
|
padding: '10px 16px',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
gap: 10,
|
|
fontFamily: 'var(--font-mono)',
|
|
fontSize: 12,
|
|
color: level === 'critical' ? 'var(--danger)' : 'var(--warn)',
|
|
}}>
|
|
<span style={{ fontSize: 16 }}>⚠</span>
|
|
<span>
|
|
DEW POINT ALERT — {level === 'critical' ? 'CRITICAL' : 'WARNING'}
|
|
{margin && ` — Margin: ${margin}°C`}
|
|
{level === 'critical'
|
|
? ' — Condensation imminent. Protect optics immediately.'
|
|
: ' — Risk of dew forming. Enable dew heaters.'}
|
|
</span>
|
|
</div>
|
|
);
|
|
}
|