From eb799e107871d0561b45c7ebf8fb29c6bb43843d Mon Sep 17 00:00:00 2001
From: Jon Eugster <eugster.jon@gmail.com>
Date: Wed, 19 Jul 2023 00:13:01 +0200
Subject: [PATCH] fix toggle help in presence of errors

---
 client/src/components/infoview/command_line.tsx |  2 +-
 client/src/components/level.tsx                 | 16 +++++++++-------
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/client/src/components/infoview/command_line.tsx b/client/src/components/infoview/command_line.tsx
index d737d1a..84a85da 100644
--- a/client/src/components/infoview/command_line.tsx
+++ b/client/src/components/infoview/command_line.tsx
@@ -335,7 +335,7 @@ export function hasErrors(diags: Diagnostic[]) {
 
 // TODO: Didn't manage to unify this with the one above
 export function hasInteractiveErrors (diags: InteractiveDiagnostic[]) {
-  return diags.some(
+  return (typeof diags !== 'undefined') && diags.some(
     (d) => (d.severity == DiagnosticSeverity.Error ) // || d.severity == DiagnosticSeverity.Warning
   )
 }
diff --git a/client/src/components/level.tsx b/client/src/components/level.tsx
index 2c85388..10eec98 100644
--- a/client/src/components/level.tsx
+++ b/client/src/components/level.tsx
@@ -240,7 +240,9 @@ function PlayableLevel({worldId, levelId}) {
     }
   }
 
+  // If the last step has errors, we want to treat it as if it is part of the second-to-last step
   let k = proof.length - 1
+  let withErr = hasInteractiveErrors(proof[k]?.errors) ? 1 : 0
 
   return <>
     <div style={level.isLoading ? null : {display: "none"}} className="app-content loading"><CircularProgress /></div>
@@ -260,7 +262,7 @@ function PlayableLevel({worldId, levelId}) {
             {proof.map((step, i) => {
               // It the last step has errors, it will have the same hints
               // as the second-to-last step. Therefore we should not display them.
-              if (!(i == proof.length - 1 && hasInteractiveErrors(step.errors))) {
+              if (!(i == proof.length - 1 && withErr)) {
                 // TODO: Should not use index as key.
                 return <Hints key={`hints-${i}`}
                   hints={step.hints} showHidden={showHelp.has(i)} step={i}
@@ -287,17 +289,17 @@ function PlayableLevel({worldId, levelId}) {
           </div>
           <div className="toggle-hidden-hints">
             <FormControlLabel
-              control={<Switch checked={showHelp.has(proof.length - 1)} onChange={(ev) => {
-                console.debug(proof.length)
+              control={<Switch checked={showHelp.has(k - withErr)} onChange={(ev) => {
+                // If the last step (`k`) has errors, we want the hidden hints from the
+                // second-to-last step to be affected
                 if (!(proof.length)) {return}
 
-                let k = proof.length - 1
                 // state must not be mutated, therefore we need to clone the set
                 let tmp = new Set(showHelp)
-                if (tmp.has(k)) {
-                  tmp.delete(k)
+                if (tmp.has(k - withErr)) {
+                  tmp.delete(k - withErr)
                 } else {
-                  tmp.add(k)
+                  tmp.add(k - withErr)
                 }
                 setShowHelp(tmp)
                 console.debug(`help: ${Array.from(tmp.values())}`)