Experiment: change dynamic loading on /try page level

Author: ryyppy

common/CodeMirrorBase.re

@@ -15,6 +15,7 @@ import "../styles/cm.css";
 
 if (typeof window !== "undefined" && typeof window.navigator !== "undefined") {
   require("codemirror/mode/javascript/javascript");
+  require("codemirror/addon/scroll/simplescrollbars");
   require("../plugins/cm-reason-mode");
 }
 |};
@@ -38,6 +39,10 @@ module CM = {
       readOnly: bool,
       [@bs.optional]
       lineWrapping: bool,
+      [@bs.optional]
+      fixedGutter: bool,
+      [@bs.optional]
+      scrollbarStyle: string,
     };
   };
 
@@ -385,9 +390,11 @@ let default = (props: Props.t): React.element => {
               cmOptions->CM.Options.lineWrapping,
               false,
             ),
+          ~fixedGutter=false,
           ~readOnly=
             Belt.Option.getWithDefault(cmOptions->CM.Options.readOnly, false),
           ~lineNumbers=true,
+          ~scrollbarStyle="overlay",
           (),
         );
       let cm = CM.fromTextArea(input, options);

components/CodeMirror.re

@@ -62,5 +62,6 @@ let make =
       (),
     );
 
-  React.createElement(dynamicComponent, props);
+  /*React.createElement(dynamicComponent, props);*/
+  CodeMirrorBase.default(props);
 };

pages/try.js

@@ -1 +1,8 @@
-export { default } from "../re_pages/Playground.bs";
+import dynamic from "next/dynamic";
+
+const Playground = dynamic(() => import("../re_pages/Playground.bs"), {
+  ssr: false,
+  //loading: () => <div> Loading... </div>
+});
+
+export default Playground;