"use client"; import React from "react"; function MainComponent() { const [prompt, setPrompt] = useState(""); const [image, setImage] = useState(""); const [loading, setLoading] = useState(false); const [error, setError] = useState(""); const generateImage = async () => { if (!prompt.trim()) return; setLoading(true); setError(""); try { const response = await fetch( `/integrations/dall-e-3/?prompt=${encodeURIComponent(prompt)}` ); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const data = await response.json(); setImage(data.data[0]); } catch (err) { setError("Failed to generate image"); console.error(err); } finally { setLoading(false); } }; return (

Digite sua ideia para gerar uma imagem usando IA:

setPrompt(e.target.value)} className="flex-1 px-3 py-2 text-base border border-gray-200 dark:border-gray-700 rounded-md bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 font-inter" placeholder="Descreva a imagem" />
{loading ? (
) : error ? (

{error}

) : image ? ( Generated image ) : (

Imagem será exibida aqui

)}
); } export default MainComponent;
Share:

Nenhum comentário:

Postar um comentário