EmberClone/apps/web/src/components/ApiErrorBanner.tsx

20 lines
594 B
TypeScript

import React from 'react';
import { useQuery } from '@tanstack/react-query';
import { api } from '@emberclone/shared/api';
export const ApiErrorBanner: React.FC = () => {
const { isError } = useQuery({
queryKey: ['health'],
queryFn: () => api.health(),
refetchInterval: 30000,
retry: 0,
});
if (!isError) return null;
return (
<div className="fixed top-0 left-0 right-0 z-50 bg-red-600 text-white text-center py-2 px-4 text-sm font-medium animate-in fade-in slide-in-from-top duration-300">
API nicht erreichbar versuche erneut in 30s
</div>
);
};