dope2-webapp/src/component/expr/CallBlock.tsx

import { useContext } from "react";

import { CallContext } from "../../context/CallContext";
import { EnvContext } from "../../context/EnvContext";
import { GlobalContext } from "../../context/GlobalContext";
import { type StaticEnvironment, type TypeInfoCall } from "../../eval/infer_type";
import { getActions } from "../app/actions";
import { Type } from "../other/Type";
import "./CallBlock.css";
import { ExprBlock, type ExprBlockState, type SetStateFn, type State2Props } from "./ExprBlock";

export interface CallBlockState {
  kind: "call";
  fn: ExprBlockState;
  input: ExprBlockState;
}

export interface CallBlockProps<
  FnState=ExprBlockState,
  InputState=ExprBlockState,
> extends State2Props<CallBlockState,ExprBlockState> {
  typeInfo: TypeInfoCall;
}

function nestedFnProperties({state, setState, score, typeInfo}: CallBlockProps, env: StaticEnvironment) {
  const setFn = (callback: SetStateFn) => {
    setState(state => ({...state, fn: callback(state.fn)}));
  };
  const onFnCancel = () => {
    setState(state => state.input); // we become our input
  };
  const scoreFn = (fnSuggestion: ExprBlockState) => {
    return score({ ...state, fn: fnSuggestion });
  };
  return {state: state.fn, setState: setFn, onCancel: onFnCancel, score: scoreFn, typeInfo: typeInfo.fn};
}

function nestedInputProperties({state, setState, score, typeInfo}: CallBlockProps, env: StaticEnvironment) {
  const setInput = (callback: SetStateFn) => {
    setState(state => ({...state, input: callback(state.input)}));
  };
  const onInputCancel = () => {
    setState(state => /*addFocusRightMost*/(state.fn)); // we become our function
  };
  const scoreInput = (inputSuggestion: ExprBlockState) => {
    return score({ ...state, input: inputSuggestion });
  };
  return {state: state.input, setState: setInput, onCancel: onInputCancel, score: scoreInput, typeInfo: typeInfo.input};
}

export function CallBlock(props: CallBlockProps) {
  const env = useContext(EnvContext);
  const globalContext = useContext(GlobalContext);
  const addParam = getActions(globalContext, props.setState).c;
  // const [resolved] = evalExprBlock(props.state, env);
  // return <span className={"functionBlock" + ((resolved.kind === "error") ? " unifyError" : "")}>
  return <span className={"functionBlock"}>
    <CallContext value={{addParam}}>
      <FunctionHeader {...props} addParam={addParam} />
      <div className="functionParams">
        <div className="outputParam">
          {/* Sequence of input parameters */}
          <InputParams
            {...props}
            addParam={addParam}
            />
          {/* {  (resolved.kind === "error") && resolved.e.toString()
          || (resolved.kind === "value") && <Value dynamic={resolved} />
          || "unknown" } */}
          :: <Type type={props.typeInfo.type} />
        </div>
      </div>
    </CallContext>
  </span>;
}

function FunctionHeader(props) {
  const env = useContext(EnvContext);
  const globalContext = useContext(GlobalContext);
  const nestedProperties = nestedFnProperties(props, env);
  if (props.state.fn.kind === "call" && globalContext?.syntacticSugar) {
    // if the function we're calling is itself the result of a function call,
    // then we are anonymous, and so we don't draw a function name
    return <FunctionHeader {...nestedProperties} />;
  }
  else {
    //  end of recursion - draw function name
    return <span className="functionName">
      &nbsp;&#119891;&#119899;&nbsp;
      <ExprBlock {...nestedProperties} />
    </span>;
  }
}

function InputParams(props) {
  const env = useContext(EnvContext);
  const globalContext = useContext(GlobalContext);
  const inputEnv = props.typeInfo.fn.newEnv;
  const isOffending = props.typeInfo.err;
  return <div className={"inputParam" + (isOffending ? " offending" : "")}>
    {props.state.fn.kind === "call"
      && globalContext?.syntacticSugar
      && <InputParams
        {...nestedFnProperties(props as CallBlockProps, env)}
        />}
    {/* Our own input param */}
    <EnvContext value={inputEnv}>
      <ExprBlock
        {...nestedInputProperties(props as CallBlockProps, env)}
      />
    </EnvContext>
  </div>;
}