Skip to content

Commit

Permalink
#
Browse files Browse the repository at this point in the history 
ah, we need to stop setting `width = heigth` if we want "match"

should hiding labels include special nodes (typedefs etc.)

note that `flavorIsSyntax` had become always `false`

Signed-off-by: George Thomas <[email protected]>
  • Loading branch information
@georgefst @dhess
georgefst authored and dhess committed Apr 9, 2024
1 parent d1d9593 commit 20bb499
Show file tree
Hide file tree
Showing 4 changed files with 227 additions and 195 deletions.
2 changes: 1 addition & 1 deletion src/App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ const App = (): JSX.Element => {
const devToolsMaxHeight = 500;
const [devOpts, setDevOpts] = useState<DevOptions>({
showIDs: false,
alwaysShowLabels: true,
alwaysShowLabels: false,
});

useEffect(() => {
Expand Down
200 changes: 147 additions & 53 deletions src/components/TreeReactFlow/Flavor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import {
} from "@/primer-api";
import classNames from "classnames";
import "./reactflow.css";
import { Label } from "./Types";

export type NodeFlavor =
| NodeFlavorTextBody
Expand Down Expand Up @@ -421,24 +422,117 @@ export const flavorEdgeClasses = (flavor: NodeFlavor): string => {
}
};

export const flavorLabel = (flavor: NodeFlavor): string => {
// if these are going to have an `| undefined`, that only really makes sense if there's a `Level` input
// actually, idk, some stuff like `let` really don't need labels

// only used in beginner mode
export const flavorLabelBeginnerModeSyntax = (
flavor: NodeFlavorNoBody
): Label | undefined => {
const basicLabel = (contents: string): Label => ({
contents,
position: ["corner", "right"],
});
switch (flavor) {
case "Hole":
return "⚠️";
return basicLabel("misfit");
case "EmptyHole":
return "?";
return basicLabel("hole");
case "Ann":
return ":";
return basicLabel("type annotation");
case "App":
return "←";
return basicLabel("apply");
case "APP":
return "←";
return basicLabel("apply type");
case "Lam":
return basicLabel("lambda");
case "LAM":
return basicLabel("type lambda");
case "Let":
return undefined;
case "LetType":
return undefined;
case "Letrec":
return basicLabel("recursive let");
case "Case":
return basicLabel("match");
case "CaseWith":
return basicLabel("with");
case "TEmptyHole":
return basicLabel("type hole");
case "THole":
return basicLabel("misfit");
case "TFun":
return basicLabel("function type");
case "TApp":
return basicLabel("apply type");
case "TForall":
return basicLabel("forall");
case "TLet":
return basicLabel("type let");
case "PatternWildcard":
return basicLabel("🤷🏽‍♀️");
case "KType":
return basicLabel("type");
case "KHole":
return basicLabel("kind hole");
case "KFun":
return basicLabel("type constructor");
}
};

export const flavorLabelTextNode = (
flavor: NodeFlavorTextBody | NodeFlavorPrimBody
): Label | undefined => {
const basicLabel = (contents: string): Label => ({
contents,
position: ["corner", "right"],
});
switch (flavor) {
case "Con":
return basicLabel("V");
case "GlobalVar":
case "LocalVar":
return basicLabel("Var");
case "PrimCon":
return basicLabel("V");
case "TCon":
return basicLabel("T");
case "TVar":
return basicLabel("Var");
case "PatternCon":
return basicLabel("V");
case "PrimPattern":
return basicLabel("V");
case "VarBind":
return basicLabel("bind");
case "TVarBind":
return basicLabel("type bind");
}
};

export const flavorLabel = (flavor: NodeFlavor): Label | undefined => {
const contents = flavorLabelOld(flavor);
return { contents, position: ["corner", "right"] };
};
export const flavorLabelOld = (flavor: NodeFlavor): string => {
switch (flavor) {
case "Hole":
return "misfit";
case "EmptyHole":
return "hole";
case "Ann":
return "type annotation";
case "App":
return "apply";
case "APP":
return "apply type";
case "Con":
return "V";
case "Lam":
return "λ";
return "lambda";
case "LAM":
return "Λ";
return "type lambda";
case "GlobalVar":
return "Var";
case "LocalVar":
Expand All @@ -448,29 +542,29 @@ export const flavorLabel = (flavor: NodeFlavor): string => {
case "LetType":
return "let type";
case "Letrec":
return "let rec";
return "recursive let";
case "Case":
return "m";
return "match";
case "CaseWith":
return "w";
return "with";
case "PrimCon":
return "V";
case "TEmptyHole":
return "?";
return "type hole";
case "THole":
return "⚠️";
return "misfit";
case "TCon":
return "T";
case "TFun":
return "→";
return "function type";
case "TVar":
return "Var";
case "TApp":
return "←";
return "apply type";
case "TForall":
return "∀";
return "forall";
case "TLet":
return "let";
return "type let";
case "Pattern":
return "";
case "PatternCon":
Expand All @@ -480,11 +574,11 @@ export const flavorLabel = (flavor: NodeFlavor): string => {
case "PatternWildcard":
return "🤷🏽‍♀️";
case "KType":
return "✱";
return "type";
case "KHole":
return "?";
return "kind hole";
case "KFun":
return "➜";
return "type constructor";
case "VarBind":
return "bind";
case "TVarBind":
Expand All @@ -510,52 +604,52 @@ export const flavorIsSyntax = (flavor: NodeFlavorTextBody): boolean => {
}
};

export const noBodyFlavorContents = (flavor: NodeFlavorNoBody): string => {
export const syntaxNodeContents = (flavor: NodeFlavorNoBody): string => {
switch (flavor) {
case "Hole":
return "⚠️";
case "EmptyHole":
return "?";
case "Ann":
return "type annotation";
return ":";
case "App":
return "apply";
return "←";
case "APP":
return "apply type";
return "←";
case "Lam":
return "λ";
case "LAM":
return "Λ";
case "Let":
return "let";
case "LetType":
return "let type";
case "Letrec":
return "let rec";
case "Case":
return "match";
return "m";
case "CaseWith":
return "with";
case "TFun":
return "function type";
case "TApp":
return "apply type";
case "Hole":
return "misfit";
case "EmptyHole":
return "hole";
return "w";
case "TEmptyHole":
return "type hole";
return "?";
case "THole":
return "misfit";
return "⚠️";
case "TFun":
return "→";
case "TApp":
return "←";
case "TForall":
return "∀";
case "TLet":
return "let";
case "PatternWildcard":
return "🤷🏽‍♀️";
case "KType":
return "type";
return "✱";
case "KHole":
return "kind hole";
return "?";
case "KFun":
return "type constructor";
case "LAM":
return "type lambda";
case "Lam":
return "lambda";
case "Let":
return "let";
case "LetType":
return "let type";
case "Letrec":
return "recursive let";
case "TForall":
return "forall";
case "TLet":
return "type let";
return "➜";
}
};

Expand Down
27 changes: 14 additions & 13 deletions src/components/TreeReactFlow/Types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,6 @@ export type PrimerNode<T = unknown> = {
data: PrimerCommonNodeProps & T;
} & (
| { type: "primer"; data: PrimerNodeProps }
| { type: "primer-simple"; data: PrimerSimpleNodeProps }
| { type: "primer-box"; data: PrimerBoxNodeProps }
| { type: "primer-def-name"; data: PrimerDefNameNodeProps }
| { type: "primer-typedef-name"; data: PrimerTypeDefNameNodeProps }
Expand Down Expand Up @@ -184,22 +183,25 @@ export type NodeData =
name: string;
};

/** Node properties. */
export type PrimerNodeProps = {
nodeData: NodeData;
centerLabel: boolean;
flavor: NodeFlavorTextBody | NodeFlavorPrimBody | NodeFlavorNoBody;
export type Label = {
contents: string;
hideLabel: boolean;
showIDs: boolean;
position: "center" | ["inline" | "corner", "left" | "right"];
};

/** Properties for a simple node. */
export type PrimerSimpleNodeProps = {
/** Node properties. */
export type PrimerNodeProps = {
nodeData: NodeData;
flavor: NodeFlavorNoBody;
hideLabel: boolean;
showIDs: boolean;
};
} & (
| {
flavor: NodeFlavorNoBody;
// this exists iff we are in beginner mode - is there a better way to model this?
// contents?: string;
beginner: boolean;
}
| { flavor: NodeFlavorTextBody | NodeFlavorPrimBody; contents: string }
);

/** Properties for a box node. */
export type PrimerBoxNodeProps = {
Expand Down Expand Up @@ -239,7 +241,6 @@ export type PrimerCommonNodeProps = {
height: number;
padding?: Padding;
selected: boolean;
style: "inline" | "corner";
};

/** Our edge type. Much like `PrimerNode`, `PrimerEdge` extends ReactFlow's `Edge`.
Expand Down
Loading

0 comments on commit 20bb499

Please sign in to comment.