gridpilot.gg/apps/website/templates/shared/StatusTemplates.tsx

import { TemplateProps } from '@/lib/contracts/components/ComponentContracts';
import { ViewData } from '@/lib/contracts/view-data/ViewData';
import { Container } from '@/ui/Container';
import { Stack } from '@/ui/Stack';
import { Text } from '@/ui/Text';

interface ErrorTemplateProps extends TemplateProps<ViewData> {
  message?: string;
  description?: string;
}

export function ErrorTemplate({ message = "An error occurred", description = "Please try again later" }: ErrorTemplateProps) {
  return (
    <Container size="lg">
      <Stack align="center" gap={4} py={12}>
        <Text color="text-red-400">{message}</Text>
        <Text color="text-gray-400">{description}</Text>
      </Stack>
    </Container>
  );
}

interface EmptyTemplateProps extends TemplateProps<ViewData> {
  title: string;
  description: string;
}

export function EmptyTemplate({ title, description }: EmptyTemplateProps) {
  return (
    <Container size="lg">
      <Stack align="center" gap={2} py={12}>
        <Text data-testid="empty-state-title" size="xl" weight="semibold" color="text-white">{title}</Text>
        <Text data-testid="empty-state-description" color="text-gray-400">{description}</Text>
      </Stack>
    </Container>
  );
}