File size: 2,955 Bytes
065d164 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 |
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; |