autogenerate id

citelao · Nov 20, 2019 · f54926d · f54926d
1 parent c5c1bc6
commit f54926d
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 16 deletions.
diff --git a/example/src/index.js b/example/src/index.js
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { Fragment } from "react";
 import { render } from "react-dom";
 import "babel-polyfill";
 import Playground from "@agney/playground";
@@ -18,13 +18,26 @@ render(app, document.getElementById('app'));
     `,
   };
   return (
-    <Playground
-      id="example"
-      initialSnippet={snippet}
-      defaultEditorTab="javascript"
-      transformJs
-      presets={["react"]}
-    />
+    <Fragment>
+      <Playground
+        initialSnippet={snippet}
+        defaultEditorTab="javascript"
+        transformJs
+        presets={["react"]}
+      />
+      <Playground
+        initialSnippet={snippet}
+        defaultEditorTab="javascript"
+        transformJs
+        presets={["react"]}
+      />
+      <Playground
+        initialSnippet={snippet}
+        defaultEditorTab="javascript"
+        transformJs
+        presets={["react"]}
+      />
+    </Fragment>
   );
 };
 

diff --git a/playground/src/Playground.tsx b/playground/src/Playground.tsx
@@ -49,13 +49,15 @@ const Playground: FC<IProps> = ({
           defaultTab={defaultEditorTab}
           onChange={onSnippetChange}
         />
-        <Result
-          id={id}
-          snippet={snippet}
-          defaultTab={defaultResultTab}
-          transformJs={transformJs}
-          presets={presets}
-        />
+        {id && (
+          <Result
+            id={id}
+            snippet={snippet}
+            defaultTab={defaultResultTab}
+            transformJs={transformJs}
+            presets={presets}
+          />
+        )}
       </Container>
     </ThemeProvider>
   );

diff --git a/playground/src/Result/index.tsx b/playground/src/Result/index.tsx
@@ -42,7 +42,7 @@ const Result: FC<IProps> = ({
             data.data.source === `frame-${id}` &&
             data.data.message.type === "log"
           ) {
-            setLogs(prevLogs => [...prevLogs, ...data.data.message]);
+            setLogs(prevLogs => [...prevLogs, ...data.data.message.data]);
           }
         });
       }