Project in editors and remove warnings

This commit is contained in:
Sam Nolan 2022-10-08 16:23:58 +11:00
parent eaa7d38428
commit 0f8e7ce6b6
5 changed files with 64 additions and 39 deletions

View File

@ -55,10 +55,7 @@ export const CodeEditor: FC<CodeEditorProps> = ({
editorProps={{
$blockScrolling: true,
}}
setOptions={{
enableBasicAutocompletion: false,
enableLiveAutocompletion: false,
}}
setOptions={{}}
commands={[
{
name: "submit",

View File

@ -1,5 +1,10 @@
import * as React from "react";
import { SqValue, environment, SqProject } from "@quri/squiggle-lang";
import {
SqValue,
environment,
SqProject,
defaultEnvironment,
} from "@quri/squiggle-lang";
import { useSquiggle } from "../lib/hooks";
import { SquiggleViewer } from "./SquiggleViewer";
import { JsImports } from "../lib/jsImports";
@ -121,23 +126,14 @@ export const SquiggleChart: React.FC<SquiggleChartProps> = React.memo(
height = 200,
enableLocalSettings = false,
continues = defaultContinues,
project,
environment,
} = props;
const p = React.useMemo(() => {
if (props.project) {
return props.project;
} else {
const p = SqProject.create();
if (props.environment) {
p.setEnvironment(props.environment);
}
return p;
}
}, [props.project, props.environment]);
const resultAndBindings = useSquiggle({
environment,
continues,
project: p,
project,
code,
jsImports,
onChange,
@ -153,7 +149,9 @@ export const SquiggleChart: React.FC<SquiggleChartProps> = React.memo(
height={height}
distributionPlotSettings={distributionPlotSettings}
chartSettings={chartSettings}
environment={p.getEnvironment()}
environment={
project ? project.getEnvironment() : environment ?? defaultEnvironment
}
enableLocalSettings={enableLocalSettings}
/>
);

View File

@ -35,6 +35,7 @@ export type SquiggleEditorProps = SquiggleChartProps & {
const defaultOnChange = () => {};
const defaultImports: JsImports = {};
const defaultContinues: string[] = [];
export const SquiggleEditor: React.FC<SquiggleEditorProps> = (props) => {
const [code, setCode] = useMaybeControlledValue({
@ -54,17 +55,13 @@ export const SquiggleEditor: React.FC<SquiggleEditorProps> = (props) => {
width,
height = 200,
enableLocalSettings = false,
continues = defaultContinues,
project,
} = props;
const project = React.useMemo(() => {
const p = SqProject.create();
if (environment) {
p.setEnvironment(environment);
}
return p;
}, [environment]);
const resultAndBindings = useSquiggle({
environment,
continues,
code,
project,
jsImports,

View File

@ -4,16 +4,18 @@ import {
SqProject,
SqRecord,
SqValue,
environment,
} from "@quri/squiggle-lang";
import { useEffect, useMemo } from "react";
import { JsImports, jsImportsToSquiggleCode } from "../jsImports";
import * as uuid from "uuid";
type SquiggleArgs = {
environment?: environment;
code: string;
executionId?: number;
jsImports?: JsImports;
project: SqProject;
project?: SqProject;
continues?: string[];
onChange?: (expr: SqValue | undefined, sourceName: string) => void;
};
@ -27,15 +29,25 @@ const importSourceName = (sourceName: string) => "imports-" + sourceName;
const defaultContinues = [];
export const useSquiggle = (args: SquiggleArgs): ResultAndBindings => {
const project = useMemo(() => {
if (args.project) {
return args.project;
} else {
const p = SqProject.create();
if (args.environment) {
p.setEnvironment(args.environment);
}
return p;
}
}, [args.project, args.environment]);
const sourceName = useMemo(() => uuid.v4(), []);
const env = args.project.getEnvironment();
const env = project.getEnvironment();
const continues = args.continues || defaultContinues;
const result = useMemo(
() => {
const project = args.project;
project.setSource(sourceName, args.code);
let fullContinues = continues;
if (args.jsImports && Object.keys(args.jsImports).length) {
@ -59,7 +71,7 @@ export const useSquiggle = (args: SquiggleArgs): ResultAndBindings => {
args.executionId,
sourceName,
continues,
args.project,
project,
env,
]
);
@ -75,11 +87,11 @@ export const useSquiggle = (args: SquiggleArgs): ResultAndBindings => {
useEffect(() => {
return () => {
args.project.removeSource(sourceName);
if (args.project.getSource(importSourceName(sourceName)))
args.project.removeSource(importSourceName(sourceName));
project.removeSource(sourceName);
if (project.getSource(importSourceName(sourceName)))
project.removeSource(importSourceName(sourceName));
};
}, [args.project, sourceName]);
}, [project, sourceName]);
return result;
};

View File

@ -1,9 +1,10 @@
import { render } from "@testing-library/react";
import { render, screen } from "@testing-library/react";
import React from "react";
import "@testing-library/jest-dom";
import { SquiggleChart } from "../src/index";
import { SquiggleChart, SquiggleEditor } from "../src/index";
import { SqProject } from "@quri/squiggle-lang";
test("Logs nothing on render", async () => {
test("Chart logs nothing on render", async () => {
const { unmount } = render(<SquiggleChart code={"normal(0, 1)"} />);
unmount();
@ -11,3 +12,23 @@ test("Logs nothing on render", async () => {
expect(console.warn).not.toBeCalled();
expect(console.error).not.toBeCalled();
});
test("Editor logs nothing on render", async () => {
const { unmount } = render(<SquiggleEditor code={"normal(0, 1)"} />);
unmount();
expect(console.log).not.toBeCalled();
expect(console.warn).not.toBeCalled();
expect(console.error).not.toBeCalled();
});
test("Project dependencies work in editors", async () => {
const project = SqProject.create();
render(<SquiggleEditor code={"x = 1"} project={project} />);
const source = project.getSourceIds()[0];
render(
<SquiggleEditor code={"x + 1"} project={project} continues={[source]} />
);
screen.getByText("2");
});