diff --git a/src/components/Exercises/Speaking.tsx b/src/components/Exercises/Speaking.tsx index 7049bd16..03c79fd0 100644 --- a/src/components/Exercises/Speaking.tsx +++ b/src/components/Exercises/Speaking.tsx @@ -11,7 +11,7 @@ const ReactMediaRecorder = dynamic(() => import("react-media-recorder").then((mo ssr: false, }); -export default function Speaking({id, title, text, type, prompts, onNext, onBack}: SpeakingExercise & CommonProps) { +export default function Speaking({id, title, text, video_url, type, prompts, onNext, onBack}: SpeakingExercise & CommonProps) { const [recordingDuration, setRecordingDuration] = useState(0); const [isRecording, setIsRecording] = useState(false); const [mediaBlob, setMediaBlob] = useState(); @@ -45,30 +45,41 @@ export default function Speaking({id, title, text, type, prompts, onNext, onBack return (
-
+
{title} - - {text.split("\\n").map((line, index) => ( - - {line} -
-
- ))} -
-
- {prompts && prompts.length > 0 && ( -
- You should talk about the following things: -
- {prompts.map((x, index) => ( -
  • - {x} -
  • + {!video_url && ( + + {text.split("\\n").map((line, index) => ( + + {line} +
    +
    ))} +
    + )} +
    +
    + {video_url && ( +
    +
    -
    - )} + )} + {prompts && prompts.length > 0 && ( +
    + You should talk about the following things: +
    + {prompts.map((x, index) => ( +
  • + {x} +
  • + ))} +
    +
    + )} +