Files
labFusion/frontend/src/hooks/useServiceStatus.js
GSRN 64f302149e
Some checks failed
LabFusion CI/CD Pipeline / api-gateway (push) Failing after 34s
Docker Build and Push / build-and-push (push) Failing after 42s
LabFusion CI/CD Pipeline / service-adapters (push) Successful in 1m2s
LabFusion CI/CD Pipeline / frontend (push) Failing after 1m5s
Integration Tests / integration-tests (push) Failing after 38s
Integration Tests / performance-tests (push) Has been skipped
LabFusion CI/CD Pipeline / api-docs (push) Successful in 1m47s
Frontend (React) / test (latest) (push) Failing after 1m14s
LabFusion CI/CD Pipeline / integration-tests (push) Has been skipped
Frontend (React) / build (push) Has been skipped
Frontend (React) / lighthouse (push) Has been skipped
refactor: Migrate frontend to use Vite and update testing framework
### Summary of Changes
- Replaced `react-query` with `@tanstack/react-query` in `package.json` and updated related imports.
- Updated frontend CI workflow to use `vitest` for testing instead of Jest, modifying test commands accordingly.
- Removed the `App.js`, `Dashboard.js`, `Settings.js`, and other component files, transitioning to a new structure.
- Enhanced error handling in the `useServiceStatus` hook to provide more informative error messages.

### Expected Results
- Improved performance and modernized the frontend build process with Vite.
- Streamlined testing setup with `vitest`, enhancing test execution speed and reliability.
- Increased clarity and maintainability of the codebase by adhering to clean code principles and removing unused components.
2025-09-16 22:26:39 +02:00

130 lines
4.1 KiB
JavaScript

import { useState, useEffect } from 'react';
import { apiGateway, serviceAdapters, apiDocs, fallbackData } from '../services/api';
import { API_CONFIG, SERVICE_STATUS } from '../constants';
import { determineServiceStatus, formatServiceData, formatEventData } from '../utils/errorHandling';
export const useServiceStatus = () => {
const [status, setStatus] = useState({
loading: true,
apiGateway: { available: false, error: null },
serviceAdapters: { available: false, error: null },
apiDocs: { available: false, error: null },
overall: SERVICE_STATUS.CHECKING
});
useEffect(() => {
const checkServices = async () => {
setStatus(prev => ({ ...prev, loading: true }));
// Check all services in parallel
const [apiGatewayResult, adaptersResult, docsResult] = await Promise.allSettled([
apiGateway.health(),
serviceAdapters.health(),
apiDocs.health()
]);
const newStatus = {
loading: false,
apiGateway: {
available: apiGatewayResult.status === 'fulfilled' && apiGatewayResult.value.success,
error: apiGatewayResult.status === 'rejected' ? 'Connection failed' :
(apiGatewayResult.value?.error || null)
},
serviceAdapters: {
available: adaptersResult.status === 'fulfilled' && adaptersResult.value.success,
error: adaptersResult.status === 'rejected' ? 'Connection failed' :
(adaptersResult.value?.error || null)
},
apiDocs: {
available: docsResult.status === 'fulfilled' && docsResult.value.success,
error: docsResult.status === 'rejected' ? 'Connection failed' :
(docsResult.value?.error || null)
},
overall: SERVICE_STATUS.CHECKING
};
// Determine overall status
const availableServices = [
newStatus.apiGateway.available,
newStatus.serviceAdapters.available,
newStatus.apiDocs.available
].filter(Boolean).length;
newStatus.overall = determineServiceStatus(availableServices, 3);
setStatus(newStatus);
};
checkServices();
// Check services every 30 seconds
const interval = setInterval(checkServices, API_CONFIG.REFRESH_INTERVALS.SERVICE_STATUS);
return () => clearInterval(interval);
}, []);
return status;
};
export const useSystemData = () => {
const [data, setData] = useState({
loading: true,
systemStats: fallbackData.systemStats,
services: fallbackData.services,
events: fallbackData.events,
error: null
});
useEffect(() => {
const fetchData = async () => {
setData(prev => ({ ...prev, loading: true }));
try {
// Try to fetch real data from services
const [metricsResult, servicesResult, eventsResult] = await Promise.allSettled([
apiGateway.getSystemMetrics(),
serviceAdapters.getServices(),
serviceAdapters.getEvents(10)
]);
const systemStats = metricsResult.status === 'fulfilled' && metricsResult.value.success
? metricsResult.value.data
: fallbackData.systemStats;
const services = servicesResult.status === 'fulfilled' && servicesResult.value.success
? formatServiceData(servicesResult.value.data)
: fallbackData.services;
const events = eventsResult.status === 'fulfilled' && eventsResult.value.success
? formatEventData(eventsResult.value.data.events)
: fallbackData.events;
setData({
loading: false,
systemStats,
services,
events,
error: null
});
} catch (error) {
setData({
loading: false,
systemStats: fallbackData.systemStats,
services: fallbackData.services,
events: fallbackData.events,
error: `Failed to fetch data from services: ${error.message}`
});
}
};
fetchData();
// Refresh data every 60 seconds
const interval = setInterval(fetchData, API_CONFIG.REFRESH_INTERVALS.SYSTEM_DATA);
return () => clearInterval(interval);
}, []);
return data;
};