import { Box, Button, Typography } from '@mui/material'
import { AlertCircle } from 'lucide-react'

interface ErrorStateProps {
  message?: string
  onRetry?: () => void
}

export function ErrorState({ message = 'Daten konnten nicht geladen werden.', onRetry }: ErrorStateProps) {
  return (
    <Box className="flex flex-col items-center justify-center gap-3 py-16 px-8 text-center">
      <AlertCircle size={36} className="text-red-400" />
      <Typography variant="body1" color="text.secondary">{message}</Typography>
      {onRetry && (
        <Button variant="outlined" size="small" onClick={onRetry}>Erneut versuchen</Button>
      )}
    </Box>
  )
}