diff --git a/app/(game)/play/PlayClient.tsx b/app/(game)/play/PlayClient.tsx index e660acf..7af82aa 100644 --- a/app/(game)/play/PlayClient.tsx +++ b/app/(game)/play/PlayClient.tsx @@ -221,6 +221,8 @@ export default function PlayClient({ problemCount }: PlayClientProps) { ); diff --git a/components/game/AnswerResultLine.tsx b/components/game/AnswerResultLine.tsx new file mode 100644 index 0000000..8e39e7f --- /dev/null +++ b/components/game/AnswerResultLine.tsx @@ -0,0 +1,64 @@ +"use client"; + +import type { ReactNode } from "react"; + +import KatexRenderer from "@/components/math/KatexRenderer"; + +interface AnswerResultLineProps { + expressionLatex: string; + userAnswerLatex: string; + correctAnswerLatex: string; + correct: boolean; + prefix?: ReactNode; +} + +export default function AnswerResultLine({ + expressionLatex, + userAnswerLatex, + correctAnswerLatex, + correct, + prefix, +}: AnswerResultLineProps) { + return ( +
  • + {prefix} + + + + + + {correct ? ( + + ○ + + ) : ( + <> + + × + + + ( + + + + ) + + + )} +
  • + ); +} diff --git a/components/game/FeedbackPanel.tsx b/components/game/FeedbackPanel.tsx index 63e2186..43578b6 100644 --- a/components/game/FeedbackPanel.tsx +++ b/components/game/FeedbackPanel.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef } from "react"; -import KatexRenderer from "@/components/math/KatexRenderer"; +import AnswerResultLine from "@/components/game/AnswerResultLine"; import type { GradeResult, ParenthesisSignProblem } from "@/lib/engine/types"; interface FeedbackPanelProps { @@ -53,49 +53,13 @@ export default function FeedbackPanel({