fix(mcp): make submission-grader tell the truth about what is graded (#567)

The per-question review list in the submission-grader widget misreported how
much of a submission had actually been graded — the one thing a teacher opens
it to find out.

- An ungraded question (`points_earned: null`) rendered as `0/15 pts`, making
  "nobody has looked at this yet" indistinguishable from "the student got it
  wrong", and contradicting the `4/5 graded` summary a few hundred pixels
  above. It now renders as `—/15 pts` alongside a "Not graded" pill, and the
  `?? 0` coercion is gone.
- The grade panel now states how many points sit in ungraded questions, so the
  `60 / 100` figure can no longer read as "the student lost 40 points" when 15
  of those points have simply never been graded.
- `is_overridden` arrived in the payload and was never rendered, so a teacher
  could not see which scores they had already corrected. Overridden rows now
  carry a "Teacher adjusted" pill.
- AI confidence was plain grey text appended to a label, so 41% and 82% looked
  identical. Confidence below 60% now renders as an amber "review this" pill
  and tints the question's border, while high confidence stays quiet.

The server side needed no change: `lms_get_submission` already excludes null
scores from `total_points_earned` and `graded_count` (analytics.ts:382-385).
The misleading part was the denominator spanning ungraded questions, which is
a presentation concern and is handled in the widget.

Verified against the `lms_demo_submission_grader` default fixture (ungraded Q5,
overridden Q4, confidences 0.82 and 0.41) in both light and dark themes.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017Zt1kZKdcWAcsiJdBgnX3D

Author: guillermoscript

mcp-server/resources/submission-grader/widget.tsx

@@ -92,6 +92,17 @@ function statusPill(status: string): { classes: string; label: string } {
   return map[status] ?? map.pending;
 }
 
+/**
+ * Below this, the AI is guessing rather than grading — the teacher should
+ * re-read the answer instead of trusting the suggested score.
+ */
+const LOW_CONFIDENCE = 0.6;
+
+/** `points_earned: null` means nobody has graded the question — never a zero. */
+function isUngraded(q: Props["questions"][number]): boolean {
+  return q.points_earned == null;
+}
+
 function formatDate(s: string): string {
   try {
     return new Date(s).toLocaleString(undefined, {
@@ -166,6 +177,15 @@ export default function SubmissionGrader() {
   const studentName = submission.student_name ?? submission.student_id.slice(0, 8);
   const saveDisabled = saving || (!dirty && status === "teacher_reviewed");
 
+  // The summary counts only graded questions into total_points_earned, but
+  // total_points_possible spans the whole exam — so "60 / 100" can read as
+  // "lost 40 points" when part of that gap is simply not graded yet.
+  const ungradedQuestions = questions.filter(isUngraded);
+  const ungradedPoints = ungradedQuestions.reduce(
+    (total, q) => total + (q.points_possible ?? 0),
+    0
+  );
+
   return (
     <McpUseProvider autoSize>
       <Brand />
@@ -216,6 +236,14 @@ export default function SubmissionGrader() {
               </div>
             </div>
 
+            {ungradedQuestions.length > 0 && (
+              <div className="mt-2 text-[12.5px] font-medium text-amber-700 dark:text-amber-400">
+                {ungradedPoints} pt{ungradedPoints === 1 ? "" : "s"} across{" "}
+                {ungradedQuestions.length} question
+                {ungradedQuestions.length === 1 ? "" : "s"} not graded yet
+              </div>
+            )}
+
             <label className="mt-3.5 block">
               <span className="mb-1.5 block text-xs font-semibold text-zinc-500 dark:text-zinc-400">
                 Feedback to student
@@ -255,6 +283,9 @@ export default function SubmissionGrader() {
           {/* Questions */}
           <div className="flex flex-col gap-3">
             {questions.map((q, i) => {
+              const ungraded = isUngraded(q);
+              const lowConfidence =
+                q.ai_confidence != null && q.ai_confidence < LOW_CONFIDENCE;
               const correct = q.is_correct;
               const badge =
                 correct === true
@@ -273,7 +304,11 @@ export default function SubmissionGrader() {
               return (
                 <div
                   key={q.question_id}
-                  className="rounded-xl border border-zinc-200 bg-white p-4 dark:border-zinc-800 dark:bg-zinc-900"
+                  className={`rounded-xl border bg-white p-4 dark:bg-zinc-900 ${
+                    lowConfidence
+                      ? "border-amber-300 dark:border-amber-800"
+                      : "border-zinc-200 dark:border-zinc-800"
+                  }`}
                 >
                   <div className="mb-2 flex items-start justify-between gap-2.5">
                     <div className="flex items-baseline gap-2">
@@ -284,10 +319,26 @@ export default function SubmissionGrader() {
                         {q.type.replace(/_/g, " ")}
                       </span>
                     </div>
-                    <div className="flex shrink-0 items-center gap-2">
+                    <div className="flex shrink-0 flex-wrap items-center justify-end gap-2">
                       {q.points_possible != null && (
-                        <span className="text-xs font-semibold text-zinc-900 dark:text-zinc-100">
-                          {q.points_earned ?? 0}/{q.points_possible} pts
+                        <span
+                          className={`text-xs font-semibold ${
+                            ungraded
+                              ? "text-zinc-400 dark:text-zinc-500"
+                              : "text-zinc-900 dark:text-zinc-100"
+                          }`}
+                        >
+                          {ungraded ? "—" : q.points_earned}/{q.points_possible} pts
+                        </span>
+                      )}
+                      {ungraded && (
+                        <span className="rounded-lg bg-zinc-100 px-2 py-0.5 text-[11px] font-semibold text-zinc-500 dark:bg-zinc-800 dark:text-zinc-400">
+                          Not graded
+                        </span>
+                      )}
+                      {q.is_overridden && (
+                        <span className="rounded-lg bg-[var(--brand-50)] px-2 py-0.5 text-[11px] font-semibold text-[var(--brand-600)] dark:bg-[var(--brand-950)] dark:text-[var(--brand-400)]">
+                          Teacher adjusted
                         </span>
                       )}
                       {badge && (
@@ -342,11 +393,20 @@ export default function SubmissionGrader() {
                   {/* AI feedback + confidence */}
                   {q.ai_feedback && (
                     <div className="text-[12.5px] leading-normal text-zinc-500 dark:text-zinc-400">
-                      <span className="font-semibold">
-                        AI feedback
+                      <div className="flex flex-wrap items-center gap-2">
+                        <span className="font-semibold">AI feedback</span>
                         {q.ai_confidence != null &&
-                          ` (${Math.round(q.ai_confidence * 100)}% confidence)`}
-                      </span>
+                          (lowConfidence ? (
+                            <span className="rounded-lg bg-amber-100 px-2 py-0.5 text-[11px] font-semibold text-amber-800 dark:bg-amber-950 dark:text-amber-300">
+                              {Math.round(q.ai_confidence * 100)}% confidence · review
+                              this
+                            </span>
+                          ) : (
+                            <span className="text-[11px] font-medium">
+                              {Math.round(q.ai_confidence * 100)}% confidence
+                            </span>
+                          ))}
+                      </div>
                       <Markdown content={q.ai_feedback} dark={dark} fontSize={12.5} />
                     </div>
                   )}