This commit is contained in:
Flatlogic Bot 2025-06-13 10:33:16 +00:00
parent 2da87f0dec
commit ffa1111f9e
2 changed files with 51 additions and 9 deletions

File diff suppressed because one or more lines are too long

View File

@ -3,15 +3,56 @@ import LayoutAuthenticated from '../layouts/Authenticated';
import SectionMain from '../components/SectionMain';
import SectionTitle from '../components/SectionTitle';
import CardBox from '../components/CardBox';
import { useState } from 'react';
import { useAppDispatch, useAppSelector } from '../stores/hooks';
import { askGpt } from '../stores/openAiSlice';
import LoadingSpinner from '../components/LoadingSpinner';
import BaseButton from '../components/BaseButton';
const ChatGptPage = () => (
<SectionMain>
<SectionTitle title="Chat GPT" />
<CardBox>
{/* Content goes here */}
</CardBox>
</SectionMain>
);
const ChatGptPage = () => {
const dispatch = useAppDispatch();
const { gptResponse, isAskingQuestion, errorMessage } = useAppSelector(state => state.openAi);
const [prompt, setPrompt] = useState('');
const handleSubmit = () => {
if (prompt.trim()) {
dispatch(askGpt(prompt));
}
};
return (
<SectionMain>
<SectionTitle title="Chat GPT" />
<CardBox>
<textarea
className="w-full p-2 border rounded mb-2"
rows={4}
value={prompt}
onChange={e => setPrompt(e.target.value)}
placeholder="Type your question here..."
/>
<div className="flex items-center mb-2">
<BaseButton onClick={handleSubmit} disabled={!prompt.trim() || isAskingQuestion}>
Send
</BaseButton>
{isAskingQuestion && <LoadingSpinner className="ml-2" />}
</div>
{errorMessage && <div className="text-red-500 mb-2">{errorMessage}</div>}
{gptResponse && <div className="whitespace-pre-wrap">{gptResponse}</div>}
<div className="flex items-center mb-2">
<BaseButton onClick={handleSubmit} disabled={!prompt.trim() || isAskingQuestion}>
Send
</BaseButton>
{isAskingQuestion && <LoadingSpinner className="ml-2" />}
</div>
{errorMessage && <div className="text-red-500 mb-2">{errorMessage}</div>}
{gptResponse && <div className="whitespace-pre-wrap">{gptResponse}</div>}
</CardBox>
</SectionMain>
);
};
ChatGptPage.getLayout = function getLayout(page: ReactElement) {
return <LayoutAuthenticated>{page}</LayoutAuthenticated>;