'use client';

import { Badge } from '@/components/ui/Badge';
import { Task } from '@/lib/types';
import { useUserPreferences } from '@/contexts/UserPreferencesContext';

interface TaskJiraInfoProps {
  task: Task;
}

export function TaskJiraInfo({ task }: TaskJiraInfoProps) {
  const { preferences } = useUserPreferences();

  // Helper pour construire l'URL Jira
  const getJiraTicketUrl = (jiraKey: string): string => {
    const baseUrl = preferences.jiraConfig.baseUrl;
    if (!baseUrl || !jiraKey) return '';
    return `${baseUrl}/browse/${jiraKey}`;
  };

  if (task.source !== 'jira' || !task.jiraKey) {
    return null;
  }

  return (
    <div className="space-y-3">
      <label className="block text-sm font-mono font-medium text-[var(--muted-foreground)] uppercase tracking-wider">
        Jira
      </label>

      <div className="flex items-center gap-3">
        {preferences.jiraConfig.baseUrl ? (
          <a
            href={getJiraTicketUrl(task.jiraKey)}
            target="_blank"
            rel="noopener noreferrer"
            className="hover:scale-105 transition-transform inline-flex"
          >
            <Badge
              variant="outline"
              size="sm"
              className="hover:bg-blue-500/10 hover:border-blue-400/50 cursor-pointer"
            >
              {task.jiraKey}
            </Badge>
          </a>
        ) : (
          <Badge variant="outline" size="sm">
            {task.jiraKey}
          </Badge>
        )}

        {task.jiraProject && (
          <Badge
            variant="outline"
            size="sm"
            className="text-blue-400 border-blue-400/30"
          >
            {task.jiraProject}
          </Badge>
        )}

        {task.jiraType && (
          <Badge
            variant="outline"
            size="sm"
            className="text-purple-400 border-purple-400/30"
          >
            {task.jiraType}
          </Badge>
        )}
      </div>
    </div>
  );
}
