language-servers/roc
1
0
Fork 0
mirror of https://github.com/roc-lang/roc.git synced 2025-09-28 06:14:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Better epoch selection

Browse source
This commit is contained in:
Ayaz Hafiz 2023-08-02 14:37:01 -05:00
parent a5eaba9ab3
commit 43e2f2f091
No known key found for this signature in database
GPG key ID: 0E2A37416A25EF58
10 changed files with 341 additions and 166 deletions
Download patch file Download diff file Expand all files Collapse all files

35
crates/compiler/checkmate/www/src/components/Ui.tsx
View file

@ -1,32 +1,20 @@
import React, { useState } from "react";
import { AllEvents, Variable } from "../schema";
import { AllEvents } from "../schema";
import { Engine } from "../engine/engine";
import EventList from "./EventList";
import VariablesGraph from "./Graph/VariablesGraph";
import { TypedEmitter } from "tiny-typed-emitter";
import { KeydownHandler, ToggleVariableHandler } from "./Events";
import { EventListMessage, GraphMessage } from "../utils/events";
interface UiProps {
events: AllEvents;
}
interface MessageEvents {
toggleVariable: ToggleVariableHandler;
keydown: KeydownHandler;
}
export default function Ui({ events }: UiProps): JSX.Element {
const engine = new Engine(events);
const ee = new TypedEmitter<MessageEvents>();
const toggleVariableHandlers: ToggleVariableHandler[] = [];
const keydownHandlers: KeydownHandler[] = [];
ee.on("toggleVariable", (variable: Variable) => {
toggleVariableHandlers.forEach((handler) => handler(variable));
});
ee.on("keydown", async (key: string) => {
await Promise.all(keydownHandlers.map((handler) => handler(key)));
});
const graphEe = React.useRef(new TypedEmitter<GraphMessage>());
const eventListEe = React.useRef(new TypedEmitter<EventListMessage>());
engine.stepTo(engine.lastEventIndex());
const subs = engine.subsSnapshot();
@ -38,7 +26,7 @@ export default function Ui({ events }: UiProps): JSX.Element {
<div
className="flex flex-col md:flex-row gap-0 w-full h-full"
onKeyDown={(e) => {
ee.emit("keydown", e.key);
graphEe.current.emit("keydown", e.key);
}}
>
<div className="font-mono mt-2 text-lg md:flex-1 overflow-scroll">
@ -46,21 +34,16 @@ export default function Ui({ events }: UiProps): JSX.Element {
engine={engine}
root
events={events}
toggleVariableVis={(variable: Variable) =>
ee.emit("toggleVariable", variable)
}
graphEe={graphEe.current}
eventListEe={eventListEe.current}
currentEpoch={epoch}
/>
</div>
<div className="flex-1 min-h-[50%] h-full">
<VariablesGraph
subs={subs}
onVariable={(handler) => {
toggleVariableHandlers.push(handler);
}}
onKeydown={(handler) => {
keydownHandlers.push(handler);
}}
graphEe={graphEe.current}
eventListEe={eventListEe.current}
/>
</div>
</div>