import { Linking, Text, View } from 'react-native';

import { Badge } from '~/components/ui/badge';
import { Button } from '~/components/ui/button';
import { Card } from '~/components/ui/card';
import { ConfirmButton } from '~/components/ui/confirm-button';
import { CopyRow } from '~/components/ui/copy-row';
import { formatDateTime, titleize } from '~/utils/format';

export const WorkspaceSummary = ({
  cancelling,
  job,
  onCancel,
}: {
  cancelling: boolean;
  job: {
    completedAt?: number;
    model: string;
    pullRequestUrl?: string;
    reasoningEffort: string;
    startedAt?: number;
    status: string;
    workBranch: string;
    workspaceStatus?: string;
  };
  onCancel: () => void;
}) => (
  <Card className='gap-3'>
    <View className='flex-row flex-wrap gap-2'>
      <Badge label={titleize(job.status)} tone='primary' />
      <Badge label={titleize(job.workspaceStatus ?? 'not_started')} />
    </View>
    <Text className='text-muted-foreground text-sm'>
      Branch: {job.workBranch}
    </Text>
    <Text className='text-muted-foreground text-sm'>Model: {job.model}</Text>
    <Text className='text-muted-foreground text-sm'>
      Reasoning: {titleize(job.reasoningEffort)}
    </Text>
    <Text className='text-muted-foreground text-sm'>
      Started: {formatDateTime(job.startedAt)}
    </Text>
    {job.completedAt ? (
      <Text className='text-muted-foreground text-sm'>
        Completed: {formatDateTime(job.completedAt)}
      </Text>
    ) : null}
    <CopyRow label='Draft PR' value={job.pullRequestUrl} />
    {job.pullRequestUrl ? (
      <Button onPress={() => void Linking.openURL(job.pullRequestUrl ?? '')}>
        Open draft PR
      </Button>
    ) : null}
    <ConfirmButton
      confirmLabel='Cancel job'
      destructive
      disabled={
        cancelling ||
        ['cancelled', 'draft_pr_opened', 'failed'].includes(job.status)
      }
      message='Cancel this workspace job? Running work will be stopped where possible.'
      title='Cancel job'
      onConfirm={onCancel}
    >
      {cancelling ? 'Cancelling...' : 'Cancel job'}
    </ConfirmButton>
  </Card>
);
