'use client';

import React from 'react';
import { Text } from '@/ui/Text';
import { Stack } from '@/ui/Stack';
import { StatusDot } from '@/ui/StatusDot';

export type SessionStatus = 'scheduled' | 'running' | 'completed' | 'cancelled' | 'delayed';

interface SessionStatusBadgeProps {
  status: SessionStatus;
}

export function SessionStatusBadge({ status }: SessionStatusBadgeProps) {
  const config: Record<SessionStatus, { label: string; intent: 'primary' | 'success' | 'telemetry' | 'critical' | 'warning' }> = {
    scheduled: {
      label: 'Scheduled',
      intent: 'primary',
    },
    running: {
      label: 'Live',
      intent: 'success',
    },
    completed: {
      label: 'Finished',
      intent: 'telemetry',
    },
    cancelled: {
      label: 'Cancelled',
      intent: 'critical',
    },
    delayed: {
      label: 'Delayed',
      intent: 'warning',
    },
  };

  const { label, intent } = config[status] || config.scheduled;

  return (
    <Stack direction="row" align="center" gap={2}>
      <StatusDot intent={intent} size={1.5} pulse={status === 'running'} />
      <Text size="xs" weight="bold" uppercase variant={intent === 'telemetry' ? 'low' : intent} letterSpacing="widest">
        {label}
      </Text>
    </Stack>
  );
}