useNanoBanana

AI image generation composable (Nano Banana integration).

Import

const {
  jobs,
  currentJob,
  messages,
  isLoading,
  createJob,
  sendMessage,
  fetchJobs,
  fetchMessages,
  subscribeToJob,
} = useNanoBanana(projectId)

Parameters

Parameter	Type	Description
projectId	Ref<string>	Reactive project UUID

Return Values

Property	Type	Description
jobs	Ref<ImageJob[]>	Image generation jobs
currentJob	Ref<ImageJob | null>	Current active job
messages	Ref<ImageMessage[]>	Chat messages for current job
isLoading	Ref<boolean>	Loading state

Methods

Method	Parameters	Returns	Description
createJob	payload: CreateJobPayload	Promise<ImageJob>	Create generation job
sendMessage	jobId: string, prompt: string, variantId?: string	Promise<void>	Send refinement message
fetchJobs	—	Promise<void>	Load all jobs
fetchMessages	jobId: string	Promise<void>	Load chat history
subscribeToJob	jobId: string, callback: Function	RealtimeChannel	Subscribe to job updates

Job Status Flow

queued → running → succeeded
                 → failed
                 → canceled

API Routes Used

• POST /api/nano-banana/jobs — Create job
• POST /api/nano-banana/messages — Send message
• GET /api/nano-banana/jobs — List jobs
• GET /api/nano-banana/jobs/[id]/messages — Get messages

Source

app/composables/useNanoBanana.ts