From 99fa8e3b171919ba97b69172f919c46810c1971e Mon Sep 17 00:00:00 2001
From: Ben Briggs <beneb.info@gmail.com>
Date: Fri, 16 Dec 2016 17:16:54 +0000
Subject: [PATCH] Fix phenomic build.

---
 docs/web_modules/layouts/Usage/clipboard.js | 15 +++++++++++++++
 docs/web_modules/layouts/Usage/index.js     | 11 ++++++-----
 2 files changed, 21 insertions(+), 5 deletions(-)
 create mode 100644 docs/web_modules/layouts/Usage/clipboard.js

diff --git a/docs/web_modules/layouts/Usage/clipboard.js b/docs/web_modules/layouts/Usage/clipboard.js
new file mode 100644
index 000000000..36a047e4d
--- /dev/null
+++ b/docs/web_modules/layouts/Usage/clipboard.js
@@ -0,0 +1,15 @@
+import React, {PropTypes} from "react";
+import ClipboardButton from 'react-clipboard.js';
+import ClipboardIcon from 'react-clipboard-icon';
+
+const Clipboard = ({text}) => (
+    <ClipboardButton data-clipboard-text={text}>
+        <span><ClipboardIcon /> Copy</span>
+    </ClipboardButton>
+);
+
+Clipboard.propTypes = {
+    text: PropTypes.string.isRequired,
+};
+
+export default Clipboard;
diff --git a/docs/web_modules/layouts/Usage/index.js b/docs/web_modules/layouts/Usage/index.js
index 985cef091..6ad5e3b33 100644
--- a/docs/web_modules/layouts/Usage/index.js
+++ b/docs/web_modules/layouts/Usage/index.js
@@ -1,7 +1,5 @@
 import React, {Component, PropTypes} from "react";
 import Lowlight from 'react-lowlight';
-import ClipboardButton from 'react-clipboard.js';
-import ClipboardIcon from 'react-clipboard-icon';
 import js from 'highlight.js/lib/languages/javascript';
 import DangerousMarkdown from '../../DangerousMarkdown';
 import BasicPage from "../BasicPage";
@@ -29,6 +27,11 @@ export default class Optimisations extends Component {
                             </DangerousMarkdown>
                         );
                     }
+                    let clipboard = null;
+                    if (typeof window !== 'undefined') {
+                        const Clipboard = require('./clipboard').default;
+                        clipboard = (<Clipboard text={wrapper.install}/>);
+                    }
                     list.push(
                         <div className={content} key={index}>
                             <DangerousMarkdown>
@@ -39,9 +42,7 @@ export default class Optimisations extends Component {
                             </DangerousMarkdown>
                             <div className={styles.install}>
                                 <a href={wrapper.source}>{wrapper.install}</a>
-                                <ClipboardButton data-clipboard-text={wrapper.install}>
-                                  <ClipboardIcon /> Copy
-                                </ClipboardButton>
+                                {clipboard}
                             </div>
                             {alternate}
                         </div>