Merge pull request #788 from DZakh-forks/update-playground-hero

Update playground hero

Author: fhammerschmidt

src/layouts/LandingPageLayout.res

@@ -31,33 +31,37 @@ module PlaygroundHero = {
     {
       res: `module Button = {
   @react.component
-  let make = (~count: int) => {
+  let make = (~count) => {
     let times = switch count {
     | 1 => "once"
     | 2 => "twice"
-    | n => Belt.Int.toString(n) ++ " times"
+    | n => n->Int.toString ++ " times"
     }
-    let msg = "Click me " ++ times
+    let text = \`Click me $\{times\}\`
 
-    <button> {msg->React.string} </button>
+    <button> {text->React.string} </button>
   }
 }`,
-      js: `var React = require("react");
+      js: `import * as JsxRuntime from "react/jsx-runtime";
 
-function Playground$Button(Props) {
-  var count = Props.count;
+function Playground$Button(props) {
+  var count = props.count;
   var times = count !== 1 ? (
-      count !== 2 ? String(count) + " times" : "twice"
-    ) : "once";
-  var msg = "Click me " + times;
-  return React.createElement("button", undefined, msg);
+    count !== 2 ? count.toString() + " times" : "twice"
+  ) : "once";
+  var text = "Click me " + times;
+  return JsxRuntime.jsx("button", {
+    children: text
+  });
 }
 
 var Button = {
   make: Playground$Button
 };
 
-exports.Button = Button;`,
+export {
+  Button,
+}`,
     },
   ]