Refactor "community support" page to use mdxjs (ocaml#32)

* convert "support" page to use markdown; add next-mdx-remote bindings, simplify markdown and mdx modules
* Also: remove vercel config to reduce number of configs

site/README.md

@@ -16,7 +16,8 @@ to do this quickly is the following:
   * push "propose changes", which will create a commit and prompt for PR creation
   * click "Create Pull Request"
   * on the next screen, change the action to "Create draft pull request" and press the button
-* Clone your fork locally (or continue editing directly in github if the change is small)
+* Clone your fork locally (or continue editing directly in github if the change is small). Checkout
+out the branch that you created.
 * Continue developing, feel free to ask questions in
 the PR, if you run into obstacles or uncertainty as you make changes
 * Once you feel your branch is ready, check the PR preview to ensure the changes
@@ -25,6 +26,7 @@ match your local view and appear correct
 * Update the PR description to indicate relative paths that have changed
 
 ### Reviewer
+
 * Observe the relative paths changed in latest PR Preview
 * ... manual smoke test: ... ...
 * ... MORE CONTENT HERE ...
@@ -72,7 +74,8 @@ page-based routing, which expects the filepath starting from `/pages/` to match
 the route exposed. So, in order to completely avoid any problems from this issue,
 we always create pages in `res_pages/` and rewrap the module in the desired location
 in `pages/`. If your module uses `getStaticPaths` or `getStaticProps`, those will also
-need to be re-exposed. Also, note that we choose to repeat the folder name "releases" in the module name "ReleasesIndex.js".
+need to be re-exposed. Also, note that we choose to repeat the folder name (e.g. "releases") 
+in the module name (e.g. "ReleasesIndex.js").
 
 ### Fast Refresh & ReScript
 
@@ -115,8 +118,9 @@ This is a NextJS project using the following:
 - [ReScript](https://rescript-lang.org) + React (reason-react)
 - Full Tailwind config & basic css scaffold (+ production setup w/ purge-css & cssnano)
 
-The initially structure was defined by imitating a combination of choices in the following projects, with rescriptlang.org 
-usually taking precedence when there was conflicting advice:
+The initial structure was defined by imitating a combination of choices in the following projects, with rescriptlang.org 
+taking precedence when there was conflicting advice:
+
 - https://github.com/ryyppy/rescript-nextjs-template
 - https://github.com/sehyunchung/rescript-nextjs
 - https://github.com/reason-association/rescript-lang.org

site/_content/community/support.mdx

@@ -0,0 +1,63 @@
+# Support
+
+A great way to get free support is by using the active 
+[mailing lists](/community/mailing_lists). When you need to go
+beyond this and get professional support, you have the following
+options:
+
+## Commercial Support
+
+### The OCamlPro Company
+
+[OCamlPro](http://www.ocamlpro.com) is the creator of many open-source 
+tools widely used throughout the community, such as 
+[Try OCaml](http://try.ocamlpro.com/), the 
+[OPAM package manager](http://opam.ocamlpro.com/) and 
+[ocp-indent](http://www.typerex.org/ocp-indent.html), as well as a 
+large contributor to OCaml itself. Besides commercially supporting 
+their tools, they offer to share their expertise through full OCaml 
+support packages. They also provide trainings and specialized 
+software developments.
+
+OCamlPro is an INRIA spin-off with a team of highly skilled experienced
+OCaml programmers, including members of the OCaml core development team, 
+and they have expertise to help debug and optimize OCaml projects as 
+well as improve specific work environments. See details 
+[here](http://www.ocamlpro.com/).
+
+## Gerd Stolpmann
+
+[Gerd Stolpmann](http://www.gerd-stolpmann.de/buero/work_ocaml_search.html.en) 
+has been helping companies master OCaml since 2005. He is an expert 
+of the ecosystem surrounding OCaml and developed the 
+[GODI](http://godi.camlcity.org/godi/) platform. Stolpmann 
+is a computer scientist who has been a contractor for several 
+long-running OCaml projects. He has a focus on big data (including data 
+preparation, search/query engines, map/reduce), but his skills 
+also cover Unix system programming, SQL databases, client/server, 
+compiler development (e.g. for domain-specific languages), 
+and much more. Also visit his [website on OCaml](http://camlcity.org/).
+
+## Giving Support
+
+### Caml Consortium at INRIA
+
+You can join the Caml Consortium to support the development of 
+the OCaml compiler itself. See details [here](/consortium/).
+
+### OCaml Labs
+
+You can support OCaml Labs, which runs a variety of open source 
+projects to support the OCaml community. See details 
+[here](/ocamllabs/).
+
+### IRILL
+
+You can support IRILL, the Center for Research and Innovation on 
+Free Software, a major actor of the OCaml community, with projects 
+such as [js_of_ocaml](http://ocsigen.org/js_of_ocaml/) (the OCaml 
+to JavaScript optimizing compiler), [Dose](https://gforge.inria.fr/projects/dose) 
+(a key component of the OPAM package manager). They also use 
+OCaml to contribute to other major open source projects 
+([Coccinelle](http://coccinelle.lip6.fr/), for example). See details 
+[here](http://www.irill.org/).

site/bindings/Fs.js

@@ -0,0 +1 @@
+/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */

site/bindings/Fs.res

@@ -0,0 +1 @@
+@bs.module("fs") external readFileSync: (string) => 'buffer = "readFileSync"

site/bindings/Next.res

@@ -9,7 +9,7 @@ module GetStaticProps = {
   };
 
   type t<'props, 'params, 'previewData> =
-    context<'props, 'params, 'previewData> => Js.Promise.t<{. "props": 'props}>;
+    context<'props, 'params, 'previewData> => Js.Promise.t<{"props": 'props}>;
 };
 
 module GetStaticPaths = {

site/common/Mdx.js

@@ -0,0 +1,10 @@
+
+
+
+var Components = {};
+
+export {
+  Components ,
+
+}
+/* No side effect */

site/common/Mdx.res

@@ -0,0 +1,60 @@
+module Components = {
+  type props = {"children": ReasonReact.reactElement}
+
+  // Used for reflection based logic in
+  // components such as `code` or `ul`
+  // with runtime reflection
+  type unknown
+
+  @bs.deriving(abstract)
+  type t = {
+    /* Common markdown elements */
+    @bs.optional
+    p: React.component<props>,
+    @bs.optional
+    li: React.component<props>,
+    @bs.optional
+    h1: React.component<props>,
+    @bs.optional
+    h2: React.component<props>,
+    @bs.optional
+    h3: React.component<props>,
+    @bs.optional
+    h4: React.component<props>,
+    @bs.optional
+    h5: React.component<props>,
+    @bs.optional
+    ul: React.component<props>,
+    @bs.optional
+    ol: React.component<props>,
+    @bs.optional
+    table: React.component<props>,
+    @bs.optional
+    thead: React.component<props>,
+    @bs.optional
+    th: React.component<props>,
+    @bs.optional
+    td: React.component<props>,
+    @bs.optional
+    blockquote: React.component<props>,
+    @bs.optional
+    inlineCode: React.component<props>,
+    @bs.optional
+    strong: React.component<props>,
+    @bs.optional
+    hr: React.component<{.}>,
+    @bs.optional
+    code: React.component<{
+      "className": option<string>,
+      "metastring": option<string>,
+      "children": unknown,
+    }>,
+    @bs.optional
+    pre: React.component<props>,
+    @bs.optional
+    a: React.component<{
+      "children": ReasonReact.reactElement,
+      "href": string,
+    }>,
+  }
+}

site/common/NextMdxRemote.js

@@ -0,0 +1 @@
+/* This output is empty. Its source's type definitions, externals and/or unused code got optimized away. */

site/common/NextMdxRemote.res

@@ -0,0 +1,24 @@
+@bs.deriving(abstract)
+type renderToStringParams = {
+    @bs.optional components: Mdx.Components.t,
+    // TODO: optional mdxOptions and optional scope
+}
+
+type renderToStringResult = {
+    compiledSource: string,
+    renderedOutput: string,
+    //TODO: optional "scope"
+}
+
+@bs.module("next-mdx-remote/render-to-string") 
+    external renderToString: ('source, renderToStringParams) => Js.Promise.t<renderToStringResult> =
+        "default";
+
+@bs.deriving(abstract)
+type hydrateParams = {
+    @bs.optional components: Mdx.Components.t,
+}
+
+@bs.module("next-mdx-remote/hydrate") 
+    external hydrate: (renderToStringResult, hydrateParams) => ReasonReact.reactElement =
+        "default";

site/components/Markdown.js

@@ -0,0 +1,86 @@
+
+
+import * as React from "react";
+import Link from "next/link";
+
+function Markdown$P(Props) {
+  var children = Props.children;
+  return React.createElement("p", {
+              className: "mb-6"
+            }, children);
+}
+
+var P = {
+  make: Markdown$P
+};
+
+function Markdown$H1(Props) {
+  var children = Props.children;
+  return React.createElement("h1", {
+              className: "font-sans text-4xl font-bold leading-snug mb-2"
+            }, children);
+}
+
+var H1 = {
+  make: Markdown$H1
+};
+
+function Markdown$H2(Props) {
+  var children = Props.children;
+  return React.createElement("h2", {
+              className: "font-sans text-2xl font-bold leading-normal mb-2"
+            }, children);
+}
+
+var H2 = {
+  make: Markdown$H2
+};
+
+function Markdown$H3(Props) {
+  var children = Props.children;
+  return React.createElement("h3", {
+              className: "font-sans text-lg font-bold leading-normal mb-3"
+            }, children);
+}
+
+var H3 = {
+  make: Markdown$H3
+};
+
+function Markdown$LINK(Props) {
+  var href = Props.href;
+  var children = Props.children;
+  return React.createElement(Link, {
+              href: href,
+              children: React.createElement("a", {
+                    className: "text-ocamlorange hover:underline"
+                  }, children)
+            });
+}
+
+var LINK = {
+  make: Markdown$LINK
+};
+
+var $$default = {
+  p: Markdown$P,
+  h1: Markdown$H1,
+  h2: Markdown$H2,
+  h3: Markdown$H3,
+  a: Markdown$LINK
+};
+
+var Link$1;
+
+export {
+  Link$1 as Link,
+  P ,
+  H1 ,
+  H2 ,
+  H3 ,
+  LINK ,
+  $$default ,
+  $$default as default,
+
+}
+/* react Not a pure module */

site/components/Markdown.res

@@ -0,0 +1,45 @@
+module Link = Next.Link;
+
+module P = {
+  @react.component
+  let make = (~children) => <p className="mb-6"> children </p>;
+};
+module H1 = {
+  // TODO: use mb-1.5 and tailwind 2
+  @react.component
+  let make = (~children) => 
+    <h1 className="font-sans text-4xl font-bold leading-snug mb-2"> children </h1>;
+};
+module H2 = {
+  @react.component
+  let make = (~children) => 
+    <h2 className="font-sans text-2xl font-bold leading-normal mb-2"> children </h2>;
+};
+module H3 = {
+  // TODO: use mb-2.5 and tailwind 2
+  @react.component
+  let make = (~children) => 
+    <h3 className="font-sans text-lg font-bold leading-normal mb-3"> children </h3>;
+};
+// TODO: refactor to only "a" tag, using instructions in next/link docs
+module LINK = {
+  @react.component
+  let make = (~href, ~children) => 
+    <Link href={href}><a className="text-ocamlorange hover:underline"> children </a></Link>;
+};
+/* fold this code into a branch in "LINK"
+module AEXT = {
+  @react.component
+  let make = (~children, ~href) => 
+    <a href={href} className="text-ocamlorange hover:underline" target="_blank" > children </a>;
+};
+*/
+
+let default = Mdx.Components.t(
+    ~p=P.make,
+    ~h1=H1.make,
+    ~h2=H2.make,
+    ~h3=H3.make,
+    ~a=LINK.make,
+    (),
+)

site/next.config.js

@@ -11,6 +11,17 @@ const config = {
   env: {
     ENV: process.env.NODE_ENV,
   },
+  webpack: (config, options) => {
+    const { isServer } = options;
+    if (!isServer) {
+      // We shim fs for things like the blog slugs component
+      // where we need fs access in the server-side part
+      config.node = {
+        fs: 'empty'
+      }
+    }
+    return config
+  }
 };
 
 module.exports = withTM(withCSS(config));

site/package.json

@@ -11,6 +11,7 @@
     "@zeit/next-css": "^1.0.1",
     "gentype": "^3.39.0",
     "next": "^9.5.5",
+    "next-mdx-remote": "^1.0.1",
     "next-transpile-modules": "^4.1.0",
     "react": "^16.14.0",
     "react-dom": "^16.14.0",

site/pages/community/support.js

@@ -1,5 +1,7 @@
 import CommunitySupportRes from "res_pages/community/CommunitySupport";
 
-export default function Support(props) {
+export { getStaticProps } from "res_pages/community/CommunitySupport";
+
+export default function CommunitySupport(props) {
     return <CommunitySupportRes {...props} />
 }