diff --git a/src/components/Solutions/Writing.tsx b/src/components/Solutions/Writing.tsx index c6557825..228e65c3 100644 --- a/src/components/Solutions/Writing.tsx +++ b/src/components/Solutions/Writing.tsx @@ -6,10 +6,32 @@ import Button from "../Low/Button"; import {Dialog, Tab, Transition} from "@headlessui/react"; import {writingReverseMarking} from "@/utils/score"; import clsx from "clsx"; +import reactStringReplace from "react-string-replace"; export default function Writing({id, type, prompt, attachment, userSolutions, onNext, onBack}: WritingExercise & CommonProps) { const [isModalOpen, setIsModalOpen] = useState(false); + const formatSolution = (solution: string, errors: {correction: string | null; misspelled: string}[]) => { + const errorRegex = new RegExp(errors.map((x) => `(${x.misspelled})`).join("|")); + console.log(errorRegex); + + return ( + <> + {reactStringReplace(solution, errorRegex, (match) => { + const correction = errors.find((x) => x.misspelled === match)?.correction; + + return ( + + {match} + + ); + })} + + ); + }; + return ( <> {attachment && ( @@ -67,12 +89,14 @@ export default function Writing({id, type, prompt, attachment, userSolutions, on {userSolutions && (
Your answer: -