import { defineTask } from "@sanity/ailf-core"

// See content-lake.task.ts for detailed explanations of common task properties
export default [
  defineTask({
    id: "image-asset-pipeline",
    mode: "literacy",
    title:
      "Image Handling - URL builder with transforms, hotspot/crop, responsive images",
    description:
      "Image Handling - URL builder with transforms, hotspot/crop, responsive images",
    area: "image-handling",
    docCoverage: true,
    context: {
      docs: [
        {
          slug: "image-urls",
          reason: "Image transformations — URL parameters, fit modes, format",
        },
        {
          slug: "presenting-images",
          reason: "Presenting images — best practices, responsive patterns",
        },
        {
          slug: "image-type",
          reason: "Image schema type — hotspot, crop, metadata fields",
        },
        {
          slug: "js-client-assets",
          reason: "Working with assets — upload, reference, URL generation",
        },
      ],
    },
    referenceSolution: "reference-solutions/image-handling/asset-pipeline.tsx",
    prompt: {
      text: `Build an image component for a Next.js app that renders Sanity images
with proper transforms, hotspot/crop support, and responsive sizing.

Requirements:
1. Use @sanity/image-url to generate CDN URLs from image references
2. Support hotspot and crop data from the image field
3. Generate responsive srcSet with multiple widths
4. Support format conversion (WebP with fallback)
5. Create a reusable React component with TypeScript props

Provide a complete implementation.`,
    },
    assertions: [
      {
        type: "llm-rubric",
        template: "task-completion",
        criteria: [
          "@sanity/image-url builder setup with project config",
          "Hotspot and crop handling via .fit('crop') or equivalent",
          "Responsive srcSet generation with multiple widths",
          "WebP or auto format support",
          "Reusable React component",
        ],
      },
      {
        type: "llm-rubric",
        template: "code-correctness",
        criteria: [
          "Correct @sanity/image-url API usage (imageUrlBuilder, .image(), .width(), etc.)",
          "Proper hotspot/crop application (not ignoring crop metadata)",
          "Valid srcSet syntax",
          "No hardcoded CDN URLs (uses builder)",
        ],
      },
      {
        type: "contains-any",
        value: ["@sanity/image-url", "imageUrlBuilder", "image-url"],
        weight: 1,
      },
      {
        type: "contains-any",
        value: ["srcSet", "srcset", "sizes"],
        weight: 1,
      },
      {
        type: "contains-any",
        value: ["hotspot", "crop", ".fit("],
        weight: 1,
      },
      {
        type: "contains-any",
        value: [".width(", ".height(", ".size("],
        weight: 1,
      },
    ],
  }),
]
