import { useCallback, useEffect, useState } from 'react';
import {
Box,
Text,
Flex,
VStack,
Textarea,
Link,
Kbd,
Spinner,
} from '@chakra-ui/react';
const Home = () => {
const [input, setInput] = useState('');
const [finishReason, setFinishReason] = useState('');
const [isGenerating, setIsGenerating] = useState(false);
const onChange = (event) => {
setInput(event.target.value);
};
const generateAction = useCallback(async () => {
setIsGenerating(true);
const response = await fetch('/api/generate', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ input }),
});
const data = await response.json();
const { choice } = data;
setIsGenerating(false);
setFinishReason(choice.finish_reason);
if (choice.finish_reason === 'stop') {
console.log('end of the completion!');
}
setInput((prevState) => {
return prevState + choice.text;
});
}, [input]);
useEffect(() => {
console.log('checking local storage...');
const scratchPadText = localStorage.getItem('scratchpad');
setInput(scratchPadText);
}, []);
useEffect(() => {
const keydownHandler = async (event) => {
if ((event.metaKey || event.ctrlKey) && event.code === 'Enter') {
event.preventDefault();
await generateAction();
}
localStorage.setItem('scratchpad', input);
};
window.addEventListener('keydown', keydownHandler);
return () => {
window.removeEventListener('keydown', keydownHandler);
};
}, [input, generateAction]);
return (
ScratchPad
Write your first story, movie script, or song in 2 minutes. Start
by typing a few sentences and press{' '}
ctrl or{' '}
cmd +{' '}
enter to have your AI writer to help
you generate the rest!
{isGenerating && (
)}
{!isGenerating && finishReason === 'stop' && (
Keep writing to generate more!
)}
built with{' '}
buildspace
);
};
export default Home;
//
//
// ;