Improve screen
This commit is contained in:
@@ -211,6 +211,7 @@ function TutorApp({ currentUser, onLogout }) {
|
||||
const [programLessons, setProgramLessons] = useState([])
|
||||
const [programStatus, setProgramStatus] = useState(null)
|
||||
const [studentProgram, setStudentProgram] = useState(null)
|
||||
const [activeAssetIndex, setActiveAssetIndex] = useState(0)
|
||||
const [progressPanelOpen, setProgressPanelOpen] = useState(false)
|
||||
const [settingsPanelOpen, setSettingsPanelOpen] = useState(false)
|
||||
const mediaRecorderRef = useRef(null)
|
||||
@@ -319,6 +320,10 @@ function TutorApp({ currentUser, onLogout }) {
|
||||
}
|
||||
}, [selectedVoiceProfileId])
|
||||
|
||||
useEffect(() => {
|
||||
setActiveAssetIndex(0)
|
||||
}, [studentProgram?.id])
|
||||
|
||||
useEffect(() => {
|
||||
loadVoiceProfiles()
|
||||
return () => {
|
||||
@@ -932,6 +937,8 @@ function TutorApp({ currentUser, onLogout }) {
|
||||
const lastAssistantMessage = [...messages].reverse().find((message) => message.role === 'assistant')
|
||||
const lastUserMessage = [...messages].reverse().find((message) => message.role === 'user')
|
||||
const activeLessonTitle = studentProgram?.title || lessonFocus?.label || 'Cours du jour'
|
||||
const lessonAssets = studentProgram?.assets || []
|
||||
const activeAsset = lessonAssets[activeAssetIndex] || lessonAssets[0] || null
|
||||
const lessonSummary = lastAssistantMessage?.content || 'Aucune ancienne séance trouvée pour le moment. Professeur TOP commencera par une reprise courte.'
|
||||
const lastStudentWork = lastUserMessage?.content || 'Aucune réponse récente enregistrée.'
|
||||
const nextLessonAdvice = studentProgram
|
||||
@@ -1020,17 +1027,43 @@ function TutorApp({ currentUser, onLogout }) {
|
||||
</header>
|
||||
|
||||
<section className="lesson-display">
|
||||
<span className="stage-label">Professeur TOP</span>
|
||||
<div className="lesson-display-head">
|
||||
<span className="stage-label">Professeur TOP</span>
|
||||
{activeAsset && (
|
||||
<span className="asset-counter">
|
||||
Fiche {activeAssetIndex + 1}/{lessonAssets.length}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{currentInstruction ? (
|
||||
<p>{currentInstruction}</p>
|
||||
<p className="teacher-transcript">{currentInstruction}</p>
|
||||
) : (
|
||||
<p className="muted">Professeur TOP prépare la suite de la leçon.</p>
|
||||
<p className="muted teacher-transcript">Professeur TOP prépare la suite de la leçon.</p>
|
||||
)}
|
||||
{studentProgram?.assets?.length > 0 && (
|
||||
<div className="lesson-assets" aria-label="Fiches de leçon">
|
||||
{studentProgram.assets.map((asset) => (
|
||||
<img key={asset.path} src={asset.url} alt={asset.title} />
|
||||
))}
|
||||
{activeAsset && (
|
||||
<div className="lesson-asset-view" aria-label="Fiche de leçon active">
|
||||
<div className="lesson-asset-toolbar">
|
||||
<strong>{activeAsset.title}</strong>
|
||||
<div className="lesson-asset-actions">
|
||||
<button
|
||||
type="button"
|
||||
className="secondary-button"
|
||||
onClick={() => setActiveAssetIndex((index) => Math.max(index - 1, 0))}
|
||||
disabled={activeAssetIndex === 0}
|
||||
>
|
||||
Précédente
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="secondary-button"
|
||||
onClick={() => setActiveAssetIndex((index) => Math.min(index + 1, lessonAssets.length - 1))}
|
||||
disabled={activeAssetIndex >= lessonAssets.length - 1}
|
||||
>
|
||||
Suivante
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<img src={activeAsset.url} alt={activeAsset.title} />
|
||||
</div>
|
||||
)}
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user