|
'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'; |
|
|
|
|
|
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() { |
|
|
|
const [currentScene, setCurrentScene] = useState<Scene>('menu'); |
|
const [story, setStory] = useState<Story | null>(null); |
|
const [chat, setChat] = useState<Chat>({ messages: [] }); |
|
|
|
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]); |
|
} |
|
}; |
|
|
|
|
|
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(); |
|
} |
|
|
|
}, [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(); |
|
} |
|
|
|
}, [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} />; |
|
} |
|
} |