import { useState } from 'react'; import Image from 'next/image'; import Head from 'next/head'; import { generateImage } from '../services/generateImage'; const IMG_PLACEHOLDER = '/placeholder@2x.jpg'; export default function Diffusion() { const [prompt, setPrompt] = useState(''); const [imageUrl, setImageUrl] = useState(IMG_PLACEHOLDER); const handleChange = (e) => { setPrompt(e.target.value); }; const handleSubmit = async (e) => { e.preventDefault(); // TODO replace this with direct serverless call once cors is solved // const response = await fetch('/api/generateImage', { // method: 'POST', // headers: { // 'Content-Type': 'application/json', // }, // body: JSON.stringify({ prompt }), // }); // const data = await response.json(); // setImageUrl(data.imageUrl); const result = await generateImage({ prompt }); setImageUrl(result); }; return (