feat: implement controller health checks (Phase 2.2)
Add comprehensive controller health monitoring functionality with real-time visual indicators and auto-refresh capabilities. Features: - Health check API with 5-second timeout - Latency tracking and version detection - ControllerStatus component with color-coded indicators - Auto-refresh with configurable intervals - Integration with SettingsPage and SealingKeysView Technical details: - AbortController for proper timeout handling - Never-fail API (always returns status) - Three states: Healthy (green), Unhealthy (yellow), Unreachable (red) - Detailed tooltips with error messages - Response time display in milliseconds - Version information from X-Controller-Version header Files: - src/lib/controller.ts: Add checkControllerHealth() (+58 lines) - src/components/ControllerStatus.tsx: NEW component (+117 lines) - src/components/SettingsPage.tsx: Add status display - src/components/SealingKeysView.tsx: Add status to header - PHASE_2.2_COMPLETE.md: Implementation documentation Bundle size: 346.65 kB (95.49 kB gzipped), +2.7 kB (+0.8%) Build time: 3.94s (improved!) Zero TypeScript/lint errors Generated with [Claude Code](https://claude.ai/code) via [Happy](https://happy.engineering) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> Co-Authored-By: Happy <yesreply@happy.engineering>
This commit is contained in:
@@ -5,11 +5,12 @@
|
||||
*/
|
||||
|
||||
import { SectionBox } from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import { Box, Button, TextField, Typography } from '@mui/material';
|
||||
import { Box, Button, Divider, TextField, Typography } from '@mui/material';
|
||||
import { useSnackbar } from 'notistack';
|
||||
import React from 'react';
|
||||
import { getPluginConfig, savePluginConfig } from '../lib/controller';
|
||||
import { PluginConfig } from '../types';
|
||||
import { ControllerStatus } from './ControllerStatus';
|
||||
|
||||
/**
|
||||
* Settings page component
|
||||
@@ -42,6 +43,16 @@ export function SettingsPage() {
|
||||
your browser's local storage.
|
||||
</Typography>
|
||||
|
||||
{/* Controller Health Status */}
|
||||
<Box mb={3} p={2} bgcolor="background.paper" borderRadius={1} border={1} borderColor="divider">
|
||||
<Typography variant="subtitle2" gutterBottom>
|
||||
Controller Status
|
||||
</Typography>
|
||||
<ControllerStatus autoRefresh showDetails />
|
||||
</Box>
|
||||
|
||||
<Divider sx={{ mb: 3 }} />
|
||||
|
||||
<TextField
|
||||
fullWidth
|
||||
label="Controller Name"
|
||||
|
||||
Reference in New Issue
Block a user