From ff05685634ce60dacb188fd283ab83697b233b19 Mon Sep 17 00:00:00 2001
From: Quinn Dougherty <quinnd@riseup.net>
Date: Thu, 28 Jul 2022 10:33:31 -0400
Subject: [PATCH] @berekuk's CR

---
 ...=> SquiggleEditorWithImportedBindings.tsx} | 35 +++++++++----------
 .../website/docs/Internal/ImportIntoMdx.mdx   | 10 +++---
 .../website/src/components/SquiggleEditor.jsx |  4 +--
 .../{squiggle => estimates}/demo.squiggle     |  0
 4 files changed, 24 insertions(+), 25 deletions(-)
 rename packages/components/src/components/{SquiggleEditorImportedBindings.tsx => SquiggleEditorWithImportedBindings.tsx} (51%)
 rename packages/website/static/{squiggle => estimates}/demo.squiggle (100%)

diff --git a/packages/components/src/components/SquiggleEditorImportedBindings.tsx b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx
similarity index 51%
rename from packages/components/src/components/SquiggleEditorImportedBindings.tsx
rename to packages/components/src/components/SquiggleEditorWithImportedBindings.tsx
index d2debd9a..5b95a698 100644
--- a/packages/components/src/components/SquiggleEditorImportedBindings.tsx
+++ b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx
@@ -2,9 +2,13 @@ import React from "react";
 import { SquiggleEditor } from "./SquiggleEditor";
 import type { SquiggleEditorProps } from "./SquiggleEditor";
 import { runPartial, defaultBindings } from "@quri/squiggle-lang";
-import type { result, errorValue, bindings } from "@quri/squiggle-lang";
+import type {
+  result,
+  errorValue,
+  bindings as bindingsType,
+} from "@quri/squiggle-lang";
 
-function resultDefault(x: result<bindings, errorValue>): bindings {
+function resultDefault(x: result<bindingsType, errorValue>): bindings {
   switch (x.tag) {
     case "Ok":
       return x.value;
@@ -13,24 +17,18 @@ function resultDefault(x: result<bindings, errorValue>): bindings {
   }
 }
 
-function replaceBindings(
-  props: SquiggleEditorProps,
-  newBindings: bindings
-): SquiggleEditorProps {
-  return { ...props, bindings: newBindings };
-}
-
-export type SquiggleEditorImportedBindingsProps = SquiggleEditorProps & {
-  bindingsImportFile: string;
+export type SquiggleEditorWithImportedBindingsProps = SquiggleEditorProps & {
+  bindingsImportUrl: string;
 };
 
-export const SquiggleEditorImportedBindings: React.FC<
-  SquiggleEditorImportedBindingsProps
+export const SquiggleEditorWithImportedBindings: React.FC<
+  SquiggleEditorWithImportedBindingsProps
 > = (props) => {
+  const { bindingsImportUrl, ...editorProps } = props;
   const [bindingsResult, setBindingsResult] = React.useState({
     tag: "Ok",
     value: defaultBindings,
-  } as result<bindings, errorValue>);
+  } as result<bindingsType, errorValue>);
   React.useEffect(() => {
     async function retrieveBindings(fileName: string) {
       let contents = await fetch(fileName).then((response) => {
@@ -38,9 +36,10 @@ export const SquiggleEditorImportedBindings: React.FC<
       });
       setBindingsResult(runPartial(contents));
     }
-    retrieveBindings(props.bindingsImportFile);
-  }, []);
+    retrieveBindings(bindingsImportUrl);
+  }, [bindingsImportUrl]);
   const deliveredBindings = resultDefault(bindingsResult);
-  const newProps = replaceBindings(props, deliveredBindings);
-  return <SquiggleEditor {...newProps} />;
+  return (
+    <SquiggleEditor {...{ ...editorProps, bindings: deliveredBindings }} />
+  );
 };
diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx
index 218206da..d590c120 100644
--- a/packages/website/docs/Internal/ImportIntoMdx.mdx
+++ b/packages/website/docs/Internal/ImportIntoMdx.mdx
@@ -3,7 +3,7 @@ title: How to import squiggle files into `.mdx` documents
 sidebar_position: 5
 ---
 
-import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor";
+import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor";
 
 _Proof of concept_
 
@@ -21,17 +21,17 @@ z = y.b * y.a
 We can call `f(z)` upon the assignments in `demo.squiggle` like so:
 
 ```jsx
-import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor";
+import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor";
 
 <SquiggleEditorImportedBindings
   defaultCode={"f(z)"}
-  bindingsImportFile={"../../squiggle/demo.squiggle"}
+  bindingsImportFile={"../../estimates/demo.squiggle"}
 />;
 ```
 
 Which would then look exactly like
 
-<SquiggleEditorImportedBindings
+<SquiggleEditorWithImportedBindings
   defaultCode={"f(z)"}
-  bindingsImportFile={"../../squiggle/demo.squiggle"}
+  bindingsImportUrl={"../../estimates/demo.squiggle"}
 />
diff --git a/packages/website/src/components/SquiggleEditor.jsx b/packages/website/src/components/SquiggleEditor.jsx
index fd054d3b..353fa0b2 100644
--- a/packages/website/src/components/SquiggleEditor.jsx
+++ b/packages/website/src/components/SquiggleEditor.jsx
@@ -13,12 +13,12 @@ export function SquiggleEditor(props) {
   );
 }
 
-export function SquiggleEditorImportedBindings(props) {
+export function SquiggleEditorWithImportedBindings(props) {
   return (
     <BrowserOnly fallback={<FallbackSpinner height={292} />}>
       {() => {
         const LibComponent =
-          require("@quri/squiggle-components").SquiggleEditorImportedBindings;
+          require("@quri/squiggle-components").SquiggleEditorWithImportedBindings;
         return <LibComponent {...props} />;
       }}
     </BrowserOnly>
diff --git a/packages/website/static/squiggle/demo.squiggle b/packages/website/static/estimates/demo.squiggle
similarity index 100%
rename from packages/website/static/squiggle/demo.squiggle
rename to packages/website/static/estimates/demo.squiggle