custom goal display

client/src/components/Infoview.tsx

@@ -4,6 +4,7 @@ import { EditorApi } from '@leanprover/infoview-api'
 import { LeanClient } from 'lean4web/client/src/editor/leanclient';
 import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'
 import * as ls from 'vscode-languageserver-protocol'
+import TacticState from './TacticState';
 
 // TODO: move into Lean 4 web
 function toLanguageServerPosition (pos: monaco.Position): ls.Position {
@@ -17,13 +18,14 @@ function Infoview({ ready, editor, editorApi, uri, leanClient } : {ready: boolea
     const rpcSession = await editorApi.createRpcSession(uri)
     const fetchInteractiveGoals = () => {
       const pos = toLanguageServerPosition(editor.getPosition())
-      leanClient.sendRequest("$/lean/rpc/call", {"method":"Lean.Widget.getInteractiveGoals",
+      leanClient.sendRequest("$/lean/rpc/call", {"method":"Game.getGoals",
         "params":{"textDocument":{uri}, "position": pos},
         "sessionId":rpcSession,
         "textDocument":{uri},
         "position": pos
       }).then(({ goals }) => {
         setGoals(goals)
+        console.log(goals)
       }).catch((err) => {
         console.error(err)
       })
@@ -44,7 +46,9 @@ function Infoview({ ready, editor, editorApi, uri, leanClient } : {ready: boolea
   }, [ready])
    // Lean.Widget.getInteractiveGoals
 
-  return (<div>Number of Goals: {goals !== null ? goals.length : "None"}</div>)
+  return (<div>
+    <TacticState goals={goals} errors={[]} completed={false}></TacticState>
+  </div>)
 }
 
 export default Infoview

client/src/components/TacticState.tsx

@@ -18,9 +18,9 @@ function Goal({ goal }) {
       {hasObject && <Box><Typography>Objects</Typography>
         <List>
           {goal.objects.map((item) =>
-            <ListItem key={item[0]}>
-              <Typography color="primary" sx={{ mr: 1 }}>{item[0]}</Typography> :
-              <Typography color="secondary" sx={{ ml: 1 }}>{item[1]}</Typography>
+            <ListItem key={item.userName}>
+              <Typography color="primary" sx={{ mr: 1 }}>{item.userName}</Typography> :
+              <Typography color="secondary" sx={{ ml: 1 }}>{item.type}</Typography>
             </ListItem>)}
         </List></Box>}
       {hasAssumption && <Box><Typography>Assumptions</Typography>
@@ -33,9 +33,9 @@ function Goal({ goal }) {
     </Box>)
 }
 
-function TacticState({ goals, errors, lastTactic, completed }) {
+function TacticState({ goals, errors, completed }) {
   const hasError = typeof errors === "object" && errors.length > 0
-  const hasGoal = typeof goals === "object" && goals.length > 0
+  const hasGoal = goals !== null && goals.length > 0
   const hasManyGoal = hasGoal && goals.length > 1
   var col = ""
   var msg = ""
@@ -54,7 +54,6 @@ function TacticState({ goals, errors, lastTactic, completed }) {
       {hasGoal && <Paper sx={{ pt: 1, pl: 2, pr: 3, pb: 1, height: "100%" }}><Typography variant="h5">Current goal</Typography> <Goal goal={goals[0]} /></Paper>}
       {completed && <Typography variant="h6">Level completed ! 🎉</Typography>}
       {hasError && <Paper sx={{ pt: 1, pl: 2, pr: 3, pb: 1, height: "100%" }}><Typography variant="h5" color="error">Spell invocation failed</Typography>
-        <Typography sx={{ my: 1 }}>{lastTactic}</Typography>
         <Typography component="pre" sx={{ my: 1 }}>{col}{msg}</Typography>
         <Typography>Use the undo button to go back to a sane state.</Typography>
         </Paper>}