From 51fdcfae3778d3a979a2f9d1e162e909db5102aa Mon Sep 17 00:00:00 2001
From: Christopher Chedeau <vjeuxx@gmail.com>
Date: Tue, 17 Oct 2017 16:06:39 -0700
Subject: [PATCH 1/2] Add the ability to provide custom layout

When I designed the system, I added the ability to provide a custom layout that would use arbitrary JavaScript to render some custom pages. This is why files are called "DocsLayout.js", "BlogPostLayout.js"... This ability to customize it was [ripped out](https://github.com/facebook/react-native/blob/master/website/server/convert.js#L78) during the migration to Docusaurus but I need it for the project I'm working on right now (that should remain unnamed!).

This adds back the ability to do it in a way that fits the third party system. In order to provide a new layout:

1) Add a `layout` field in the header of your markdown file:

```js
---
layout: mylayout
---
```

2) In your `siteConfig`, add

```js
  layouts: {
    mylayout: function({React, Marked}) {
      return class extends React.Component {
        render() {
           return React.createElement('div', {}, this.props.metadata.layout);
         }
      }
    }
  }
```

I think that it's a reasonable to add and would unblock me :)
---
 lib/server/server.js | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/lib/server/server.js b/lib/server/server.js
index 27469500e7c0..f849a631daa1 100644
--- a/lib/server/server.js
+++ b/lib/server/server.js
@@ -212,8 +212,17 @@ function execute(port) {
 
     removeModuleAndChildrenFromCache("../core/DocsLayout.js");
     const DocsLayout = require("../core/DocsLayout.js");
+
+    let Doc;
+    if (metadata.layout && siteConfig.layouts[metadata.layout]) {
+      Doc = siteConfig.layouts[metadata.layout]({
+        React,
+        Marked: require("../core/Marked.js")
+      });
+    }
+
     const docComp = (
-      <DocsLayout metadata={metadata} language={language} config={siteConfig}>
+      <DocsLayout metadata={metadata} language={language} config={siteConfig} Doc={Doc}>
         {rawContent}
       </DocsLayout>
     );

From 138dbe81c54419df929d72a76277fb5685c07adc Mon Sep 17 00:00:00 2001
From: Christopher Chedeau <vjeuxx@gmail.com>
Date: Tue, 17 Oct 2017 16:08:06 -0700
Subject: [PATCH 2/2] Update DocsLayout.js

---
 lib/core/DocsLayout.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/lib/core/DocsLayout.js b/lib/core/DocsLayout.js
index 30f11410aeeb..9edd745a37cc 100644
--- a/lib/core/DocsLayout.js
+++ b/lib/core/DocsLayout.js
@@ -18,6 +18,10 @@ class DocsLayout extends React.Component {
     const metadata = this.props.metadata;
     const content = this.props.children;
     const i18n = translation[this.props.metadata.language];
+    let DocComponent = Doc;
+    if (this.props.Doc) {
+      DocComponent = this.props.Doc;
+    }
     return (
       <Site
         config={this.props.config}
@@ -36,7 +40,8 @@ class DocsLayout extends React.Component {
         <div className="docMainWrapper wrapper">
           <DocsSidebar metadata={metadata} />
           <Container className="mainContainer">
-            <Doc
+            <DocComponent
+              metadata={metadata}
               content={content}
               config={this.props.config}
               source={metadata.source}