From ac6a835b556259b208378e2e11cf4980ecbac2b1 Mon Sep 17 00:00:00 2001
From: Gordon Smith <GordonJSmith@gmail.com>
Date: Fri, 26 Apr 2024 15:33:11 +0100
Subject: [PATCH] HPCC-31696 Open ECL from docs into ECL Playground

Signed-off-by: Gordon Smith <GordonJSmith@gmail.com>
---
 esp/src/src-react/components/ECLPlayground.tsx | 11 ++++++++---
 esp/src/src-react/routes.tsx                   |  4 ++--
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/esp/src/src-react/components/ECLPlayground.tsx b/esp/src/src-react/components/ECLPlayground.tsx
index 14ff6d1de1b..7a15a9f27fc 100644
--- a/esp/src/src-react/components/ECLPlayground.tsx
+++ b/esp/src/src-react/components/ECLPlayground.tsx
@@ -20,6 +20,7 @@ const logger = scopedLogger("../components/ECLPlayground.tsx");
 
 interface ECLPlaygroundProps {
     wuid?: string;
+    ecl?: string;
 }
 
 const enum OutputMode {
@@ -339,7 +340,7 @@ const ECLEditorToolbar: React.FunctionComponent<ECLEditorToolbarProps> = ({
 
 export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props) => {
 
-    const { wuid } = props;
+    const { wuid, ecl } = props;
     const theme = useTheme();
 
     const [outputMode, setOutputMode] = React.useState<OutputMode>(OutputMode.ERRORS);
@@ -363,13 +364,17 @@ export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props
                     setOutputMode(OutputMode.RESULTS);
                 }
             });
+        } else if (ecl) {
+            setEclContent(ecl);
         }
 
         fetch("/esp/files/eclwatch/ecl/ECLPlaygroundSamples.json")
             .then(response => response.json())
             .then(json => setEclSamples(
                 json.items.map(item => {
-                    if (item.selected && !wuid) setSelectedEclSample(item.filename);
+                    if (item.selected && !wuid && !ecl) {
+                        setSelectedEclSample(item.filename);
+                    }
                     return { key: item.filename, text: item.name };
                 })
             ));
@@ -381,7 +386,7 @@ export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props
                 editor.option("theme", "default");
             }
         }
-    }, [wuid, editor, theme]);
+    }, [wuid, editor, theme, ecl]);
 
     React.useEffect(() => {
         fetch(`/esp/files/eclwatch/ecl/${selectedEclSample}`)
diff --git a/esp/src/src-react/routes.tsx b/esp/src/src-react/routes.tsx
index d5e36af6746..0f3e0469a03 100644
--- a/esp/src/src-react/routes.tsx
+++ b/esp/src/src-react/routes.tsx
@@ -87,8 +87,8 @@ export const routes: RoutesEx = [
         path: ["/play", "/playground"],
         children: [
             {
-                path: "", action: () => import("./components/ECLPlayground").then(_ => {
-                    return <_.ECLPlayground />;
+                path: "", action: (ctx, params) => import("./components/ECLPlayground").then(_ => {
+                    return <_.ECLPlayground ecl={parseSearch(ctx.search)?.ecl as string} />;
                 })
             },
             {