DefendDaniel2 / src /app /page.tsx
rolexx's picture
wip
321ba52
'use client';
import { useState, useEffect } from 'react';
import MenuScene from '../components/menu/Menu';
import IntroScene from '../components/intro/Intro';
import CourtScene from '../components/court/Court';
import DefenseScene from '../components/defense/Defense';
import LawyerScene from '../components/lawyer/Lawyer';
import EndScene from '../components/end/End';
import AccusationScene from '../components/accusation/Accusation';
// Types pour notre état
type Language = 'fr' | 'en' | 'es';
type Scene = 'menu' | 'intro' | 'accusation' | 'court' | 'defense' | 'lawyer' | 'end';
interface Story {
accusation: {
description: string;
alibi: string[];
};
}
interface Message {
content: string;
role: 'lawyer' | 'judge';
requiredWords?: string[];
}
interface Chat {
messages: Message[];
}
const intro = {
fr: {
title: "L'Avocat de l'IA",
description: `Daniel est un homme ordinaire. Il n'a rien fait de mal.\nPourtant, il est convoqué au tribunal aujourd'hui. Pauvre Daniel...`,
start: "Commencer"
},
en: {
title: "The AI Lawyer",
description: `Daniel is an ordinary guy. He hasn't done anything wrong.\nYet he's been summoned to court today. Poor Daniel...`,
start: "Start"
},
es: {
title: "El Abogado de la IA",
description: `Daniel es un tipo corriente. No ha hecho nada malo.\nSin embargo, ha sido convocado a la corte hoy. Pobre Daniel...`,
start: "Empezar"
}
}
const sceneOrder: Scene[] = ['menu', 'intro', 'accusation', 'court', 'defense', 'lawyer'];
export default function Home() {
// Gestion des scènes
const [currentScene, setCurrentScene] = useState<Scene>('menu');
const [story, setStory] = useState<Story | null>(null);
const [chat, setChat] = useState<Chat>({ messages: [] });
// États principaux du jeu
const [language, setLanguage] = useState<Language>('fr');
const [round, setRound] = useState<number>(1);
const [requiredWords, setRequiredWords] = useState<string[]>([])
const [currentQuestion, setCurrentQuestion] = useState<string>('');
const [reaction, setReaction] = useState<string>('');
const resetGame = () => {
setCurrentScene('menu');
setStory(null);
setChat({ messages: [] });
setLanguage('fr');
setRound(1);
setRequiredWords([]);
};
const setNextScene = () => {
if (currentScene === 'lawyer') {
if (round < 4) {
setCurrentScene('court');
} else {
setCurrentScene('end');
}
return;
}
if (currentScene === 'end') {
resetGame();
return;
}
const currentIndex = sceneOrder.indexOf(currentScene);
if (currentIndex !== -1 && currentIndex < sceneOrder.length - 1) {
setCurrentScene(sceneOrder[currentIndex + 1]);
}
};
// Props communs à passer aux composants
const commonProps = {
intro,
language,
setLanguage,
round,
setRound,
setCurrentScene,
setNextScene,
story,
currentQuestion,
setCurrentQuestion,
requiredWords,
setRequiredWords,
chat,
setChat,
reaction,
setReaction,
};
useEffect(() => {
const fetchStory = async () => {
try {
const response = await fetch('/api/text/story', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ language })
});
const data = await response.json();
if (data.success && data.story) {
setStory({
accusation: {
description: data.story.description,
alibi: data.story.alibi,
}
});
}
} catch (error) {
console.error('Erreur lors de la récupération de l\'histoire:', error);
}
};
console.log('currentScene:', currentScene)
if (currentScene === 'intro') {
fetchStory();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [currentScene]); // on écoute les changements de currentScene
useEffect(() => {
if (reaction !== '') {
console.log('reaction:', reaction)
}
}, [reaction]);
useEffect(() => {
const fetchQuestion = async () => {
try {
const response = await fetch('/api/text/question', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
language,
story: story?.accusation,
chat: chat
})
});
const data = await response.json();
console.log('data:', data)
console.log('round:', round)
if (data.question && data.words) {
setCurrentQuestion(data.question);
setRequiredWords(data.words);
if (data.reaction && data.reaction !== '') {
console.log('data.reaction:', data.reaction)
setReaction(data.reaction);
}
setChat(prevChat => ({
messages: [...prevChat.messages, { content: data.question, role: 'judge' }]
}));
}
} catch (error) {
console.error('Erreur lors de la récupération de la question:', error);
}
};
if ((currentScene === 'accusation' && story) || (currentScene === 'lawyer' && round < 3 && story)) {
console.log('fetchQuestion')
fetchQuestion();
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [currentScene]);
useEffect(() => {
if (currentQuestion && requiredWords.length > 0) {
console.log('currentQuestion:', currentQuestion)
console.log('requiredWords:', requiredWords)
}
}, [currentQuestion, requiredWords])
switch (currentScene) {
case 'menu':
return <MenuScene {...commonProps} />;
case 'intro':
return <IntroScene {...commonProps} />;
case 'accusation':
return <AccusationScene {...commonProps} />;
case 'court':
return <CourtScene {...commonProps} />;
case 'defense':
return <DefenseScene {...commonProps} />;
case 'lawyer':
return <LawyerScene {...commonProps} />;
case 'end':
return <EndScene {...commonProps} />;
default:
return <MenuScene {...commonProps} />;
}
}