Kie.ai integration

{
  "model": "nano-banana-pro",
  "callBackUrl": "https://pulse-content.ybh.com/api/callback",
  "input": {
    "prompt": "Create a professional infographic...",
    "image_input": [],
    "aspect_ratio": "16:9",
    "resolution": "2K",
    "output_format": "png"
  }
}

{
  "taskId": "abc123def456",
  "state": "pending"
}

{
  "taskId": "abc123def456",
  "state": "success",
  "imageUrl": "https://cdn.kie.ai/images/abc123.png",
  "costTime": 45000
}

import { createTask, waitForTask } from '@/services/kieai'

// Create generation task
const { taskId } = await createTask({
  prompt: 'Professional infographic showing tech debt cycle...',
  aspectRatio: '16:9',
  resolution: '2K',
})

// Poll for completion (with progress callback)
const result = await waitForTask(
  taskId,
  90, // max attempts
  3000, // 3 second intervals
  (attempt, maxAttempts, state) => {
    console.log(`${attempt}/${maxAttempts}: ${state}`)
  }
)

if (result.state === 'success') {
  console.log('Image URL:', result.imageUrl)
}

const { taskId } = await createTask({
  prompt: 'Add YBH branding to this image',
  aspectRatio: '16:9',
  resolution: '2K',
  imageInput: [
    'https://existing-image-url.com/image.png'
  ],
})

const result = await waitForTask(taskId)

await waitForTask(
  taskId,
  90,    // maxAttempts: 90 attempts
  3000   // intervalMs: 3 seconds between checks
)
// Total wait time: 90 × 3s = 4.5 minutes

// Faster polling for quick generations
await waitForTask(taskId, 60, 2000) // 60 × 2s = 2 minutes

// Extended wait for complex images
await waitForTask(taskId, 120, 5000) // 120 × 5s = 10 minutes

const result = await waitForTask(
  taskId,
  90,
  3000,
  (attempt, maxAttempts, state) => {
    const progress = Math.round((attempt / maxAttempts) * 100)
    console.log(`Progress: ${progress}% - State: ${state}`)
    
    // Update UI
    setGenerationProgress(progress)
    setGenerationStatus(state)
  }
)

Create a professional isometric 3D infographic titled "Mark Baker's Tech Debt Doom Loop" (16:9, 2K resolution).

Layout: Doom Loop / Continuous Cycle
- Central circular path showing 4-6 connected stages
- Each stage: isometric icon + bold label + 1-2 line description
- Arrows showing clockwise flow with stress/urgency indicators
- Dark blue background (#0F2A44) with YBH accent colors

Content Structure:
1. "Accumulate Debt" - Pressure to ship fast
2. "Skip Testing" - Technical shortcuts
3. "Bugs Multiply" - Production incidents
4. "Team Burnout" - Fire-fighting mode
5. "More Debt" - Cycle repeats

Style:
- Isometric icons (3D-like, 60-degree angles)
- YBH brand colors: Yellow #F7B500, Orange #F17529, Red #EF4136
- Sans-serif typography: Title 36pt bold, Labels 18pt medium
- Episode number and guest name in bottom right
- No logos, no watermarks
- Professional tone for IT leadership audience

Create a cinematic quote card featuring:

Quote: "Tech debt is like credit card debt – ignore it long enough and the interest will crush you."

Attribution: Chris Pacifico, Episode 385

Visual Style:
- Dark cinematic background with gradient (navy to black)
- Large serif quote text, white color, centered
- Guest name and episode in YBH yellow (#F7B500)
- Subtle geometric patterns or abstract shapes
- 1:1 aspect ratio for Instagram
- Minimalist, premium feel
- No photos, no facial features

Create a professional isometric 3D career timeline infographic for "Chris Pacifico" for the You've Been Heard podcast.

Visual Style:
- Isometric 3D editorial scene with clean geometry
- Blue-Dark background (#0F2A44) with YBH accents
- Horizontal timeline flowing left to right
- Each position as isometric platform with year, role, company
- Clean connector path with numbered milestones

Career Positions (6 total):
1. CTO at TechCorp (2020-Present)
2. VP Engineering at StartupX (2017-2020)
3. Director of IT at BigCo (2014-2017)
4. Senior Architect at MegaSoft (2010-2014)
5. Lead Developer at DevShop (2007-2010)
6. Software Engineer at CodeFactory (2004-2007)

Include:
- Year labels for each milestone
- Name and current title at top
- Plenty of whitespace
- No company logos, no watermarks
- Professional, premium, suitable for IT leadership

try {
  const result = await waitForTask(taskId)
} catch (error) {
  if (error.message.includes('timed out')) {
    console.error('Generation exceeded 4.5 minutes')
    console.log('Check Kie.ai dashboard for task status')
  }
}

const result = await waitForTask(taskId)

if (result.state === 'fail') {
  console.error('Generation failed:', result.failMsg)
  // Common reasons:
  // - Invalid prompt
  // - Image input URL not accessible
  // - Content policy violation
  // - API quota exceeded
}

if (result.state === 'success' && !result.imageUrl) {
  console.warn('Task succeeded but imageUrl is missing')
  // Retry query after 5 seconds
  await new Promise(resolve => setTimeout(resolve, 5000))
  const retryResult = await queryTask(taskId)
}

const tasks = await Promise.all([
  createTask({ prompt: 'Infographic 1...', aspectRatio: '16:9' }),
  createTask({ prompt: 'Infographic 2...', aspectRatio: '1:1' }),
  createTask({ prompt: 'Quote card...', aspectRatio: '1:1' }),
])

const results = await Promise.all(
  tasks.map(({ taskId }) => waitForTask(taskId))
)

await updateEpisode(episodeId, {
  generatedAssets: [
    ...existingAssets,
    {
      type: 'infographic',
      imageUrl: result.imageUrl,
      spec: generatedSpec,
      createdAt: new Date().toISOString(),
    },
  ],
})

const profile = await scrapeLinkedInProfile(linkedinUrl)
const timelinePrompt = generateCareerTimelinePrompt(profile)
const { taskId } = await createTask({
  prompt: timelinePrompt,
  aspectRatio: '16:9',
  resolution: '2K',
})

// Store taskId for background polling
await updateEpisode(episodeId, {
  careerTimelineTaskId: taskId,
})

// Set callback URL in task creation
const { taskId } = await createTask({
  prompt: '...',
  aspectRatio: '16:9',
  callBackUrl: 'https://pulse-content.ybh.com/api/images/callback',
})

// Handle callback in your API
export async function handleCallback(request: Request) {
  const { taskId, state, imageUrl } = await request.json()
  
  if (state === 'success') {
    // Update episode with generated image
    await updateEpisodeAsset(taskId, imageUrl)
  }
  
  return new Response('OK')
}

Error: API error: 401

echo $KIEAI_API_KEY

Error: API error: 404