tweak: squiggle chart on link hover

packages/webpage-refactor/components/dynamicSquiggleChart.js

@@ -24,57 +24,51 @@ const effectButtonStyle =
   "bg-transparent m-2 hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded mt-5";
 
 export function DynamicSquiggleChart({ link, stopShowing }) {
-  let usefulLink = {
+  if (link == null) {
-    source: link.source,
+    return "";
-    target: link.target,
+  } else {
-    squiggleString: link.squiggleString,
+    let usefulLink = {
-  };
+      source: link.source,
-  return link == null ? (
+      target: link.target,
-    ""
+      squiggleString: link.squiggleString,
-  ) : (
+    };
-    /*{
+    return (
-          <div className="grid grid-cols-1 grid-rows-1 place-items-center">
+      <div className="">
+        <textarea
+          value={JSON.stringify(usefulLink, null, 4)}
+          //onChange={handleChange}
+          disabled={true}
+          rows={JSON.stringify(usefulLink, null, 4).split("\n").length}
+          cols={37}
+          className="text-left text-gray-600 bg-white rounded text-normal p-6  border-0 shadow outline-none focus:outline-none focus:ring mb-4"
+        />
+        <SquiggleChart
+          squiggleString={link.squiggleString}
+          width={445}
+          height={200}
+          showSummary={true}
+          showTypes={true}
+        />
+        {/*
+            SquiggleChart props:
+            squiggleString?: string;
+            sampleCount?: number;
+            environment?: environment;
+            chartSettings?: FunctionChartSettings;
+            onChange?(expr: squiggleExpression): void;
+            width?: number;
+            height?: number;
+            bindings?: bindings;
+            jsImports?: jsImports;
+            showSummary?: boolean;
+            showTypes?: boolean;
+            showControls?: boolean;
+        */}
 
-     
+        <button className={effectButtonStyle} onClick={() => stopShowing()}>
-          </div>
+          Hide chart
-
+        </button>
-      }*/
+      </div>
-    <div className="">
+    );
-      <textarea
-        value={JSON.stringify(usefulLink, null, 4)}
-        //onChange={handleChange}
-        disabled={true}
-        rows={JSON.stringify(usefulLink, null, 4).split("\n").length}
-        cols={37}
-        className="text-left text-gray-600 bg-white rounded text-normal p-6  border-0 shadow outline-none focus:outline-none focus:ring mb-4"
-      />
-      <SquiggleChart
-        squiggleString={link.squiggleString}
-        width={445}
-        height={200}
-        showSummary={true}
-        showTypes={true}
-      />
-      <button className={effectButtonStyle} onClick={() => stopShowing()}>
-        Hide chart
-      </button>
-    </div>
-  );
-  {
-    /*
-    SquiggleChart props:
-    squiggleString?: string;
-    sampleCount?: number;
-    environment?: environment;
-    chartSettings?: FunctionChartSettings;
-    onChange?(expr: squiggleExpression): void;
-    width?: number;
-    height?: number;
-    bindings?: bindings;
-    jsImports?: jsImports;
-    showSummary?: boolean;
-    showTypes?: boolean;
-    showControls?: boolean;
-    */
   }
 }