better-looking parameters

This commit is contained in:
Joeri Exelmans 2025-05-12 23:40:58 +02:00
parent 9afaa41fbb
commit 95eb8aef84
10 changed files with 306 additions and 229 deletions

View file

@ -1,94 +1,16 @@
import { useEffect, useState } from 'react';
import { useEffect, useRef, useState } from 'react';
import './App.css'
import { Editor, initialEditorState, type EditorState } from './Editor'
import { trie, apply, Int } from "dope2";
const listPush = trie.get(initialEditorState.env.name2dyn)("list.push");
const listEmptyList = trie.get(initialEditorState.env.name2dyn)("list.emptyList");
const fourtyTwo = {i: 42n, t: Int};
const nonEmptyEditorState: EditorState = {
kind: "call",
env: initialEditorState.env,
fn: {
kind: "call",
env: initialEditorState.env,
fn: {
kind: "input",
env: initialEditorState.env,
text: "list.push",
resolved: listPush,
},
input: {
kind: "input",
env: initialEditorState.env,
text: "list.emptyList",
resolved: listEmptyList,
},
resolved: apply(listEmptyList)(listPush),
},
input: {
kind: "input",
env: initialEditorState.env,
text: "42",
resolved: fourtyTwo,
},
resolved: apply(fourtyTwo)(apply(listEmptyList)(listPush)),
};
const functionWith3Params = trie.get(initialEditorState.env.name2dyn)("functionWith3Params");
const fourtyThree = {i: 43n, t: Int};
const fourtyFour = {i: 44n, t: Int};
const tripleFunctionCallEditorState: EditorState = {
kind: "call",
env: initialEditorState.env,
fn: {
kind: "call",
env: initialEditorState.env,
fn: {
kind: "call",
env: initialEditorState.env,
fn: {
kind: "input",
env: initialEditorState.env,
text: "functionWith3Params",
resolved: functionWith3Params,
},
input: {
kind: "input",
env: initialEditorState.env,
text: "42",
resolved: fourtyTwo,
},
resolved: apply(fourtyTwo)(functionWith3Params),
},
input: {
kind: "input",
env: initialEditorState.env,
text: "43",
resolved: fourtyThree,
},
resolved: apply(fourtyThree)(apply(fourtyTwo)(functionWith3Params)),
},
input: {
kind: "input",
env: initialEditorState.env,
text: "44",
resolved: fourtyFour,
},
resolved: apply(fourtyFour)(apply(fourtyThree)(apply(fourtyTwo)(functionWith3Params))),
}
import { Editor, type EditorState } from './Editor'
import { initialEditorState, nonEmptyEditorState, tripleFunctionCallEditorState } from "./configurations";
export function App() {
// const [history, setHistory] = useState([initialEditorState]);
const [history, setHistory] = useState([initialEditorState]);
// const [history, setHistory] = useState([nonEmptyEditorState]);
const [history, setHistory] = useState([tripleFunctionCallEditorState]);
// const [history, setHistory] = useState([tripleFunctionCallEditorState]);
const [future, setFuture] = useState<EditorState[]>([]);
const pushHistory = (s: EditorState) => {
console.log('pushHistory');
setHistory(history.concat([s]));
setFuture([]);
};
@ -118,10 +40,8 @@ export function App() {
}
};
useEffect(() => {
window['APP_STATE'] = history;
// console.log("EDITOR STATE:", state);
window['APP_STATE'] = history; // useful for debugging
}, [history]);
useEffect(() => {
@ -139,8 +59,10 @@ export function App() {
<Editor
state={history.at(-1)!}
setState={pushHistory}
onResolve={() => {console.log("toplevel resolved")}}
onCancel={() => {console.log("toplevel canceled")}}
onResolve={() => {}}
onCancel={() => {}}
filter={() => true}
focus={true}
/>
</main>