import { useState, useRef, useEffect } from 'react'; const useThoughtGeneration = (canvasRef, isMouthOpen, customPrompt) => { const [thought, setThought] = useState(''); const [isThinking, setIsThinking] = useState(false); const [animateThinking, setAnimateThinking] = useState(false); const lastGenerationTime = useRef(0); const isComponentMounted = useRef(true); // Set up component mounted ref useEffect(() => { isComponentMounted.current = true; return () => { isComponentMounted.current = false; }; }, []); // Watch for changes in isMouthOpen to trigger thought generation useEffect(() => { if (isMouthOpen) { // Only generate a new thought if we're not already thinking // and enough time has passed since the last generation const now = Date.now(); if (!isThinking && now - lastGenerationTime.current > 1000) { generateThought(); lastGenerationTime.current = now; } } }, [isMouthOpen]); // Watch for changes in isThinking to trigger animation useEffect(() => { if (isThinking) { setAnimateThinking(true); // Reset animation state after animation completes const timer = setTimeout(() => { if (isComponentMounted.current) { setAnimateThinking(false); } }, 1200); // Slightly longer to accommodate the enhanced animation return () => clearTimeout(timer); } }, [isThinking]); // Generate a thought using Gemini const generateThought = async () => { if (isThinking || !isComponentMounted.current) return; setIsThinking(true); console.log("Generating thought..."); try { // Capture the current frame from the canvas const canvas = canvasRef.current; if (!canvas) return; const imageData = canvas.toDataURL('image/jpeg', 0.8); // Send the image to the Gemini API const response = await fetch('/api/gemini', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ image: imageData, prompt: customPrompt }), }); if (!isComponentMounted.current) return; if (!response.ok) { throw new Error('Failed to generate thought'); } const data = await response.json(); if (!isComponentMounted.current) return; setThought(data.thought); console.log("Thought generated:", data.thought); } catch (error) { console.error('Error generating thought:', error); if (isComponentMounted.current) { setThought('Hmm, I lost my train of thought...'); } } finally { if (isComponentMounted.current) { setIsThinking(false); } } }; return { thought, isThinking, animateThinking, generateThought }; }; export default useThoughtGeneration;