'use client';

import { RiSearch2Line } from '@remixicon/react';
import type { ToolComponentProps } from './types';
import {
  Task,
  TaskTrigger,
  TaskContent,
  TaskItem,
} from '@/components/ai-elements/task';

export function FirecrawlWebFetchTool({ part }: ToolComponentProps) {
  const { input, output, state } = part as any;
  const isComplete = state === 'output-available';
  const url = input?.url as string | undefined;

  const title = isComplete
    ? `Fetched ${url || 'web page'}`
    : `Fetching ${url || 'web page'}...`;

  return (
    <Task defaultOpen={false}>
      <TaskTrigger title={title} icon={<RiSearch2Line className="size-4" />} />
      <TaskContent>
        {!isComplete && <TaskItem>Fetching page content...</TaskItem>}
        {isComplete && output?.error && (
          <TaskItem className="text-destructive">{output.error}</TaskItem>
        )}
        {isComplete && output?.success && (
          <TaskItem>Page content fetched successfully</TaskItem>
        )}
      </TaskContent>
    </Task>
  );
}