render documentation with markdown

Author: thefringeninja

package.json

@@ -26,6 +26,7 @@
     "react": "16.5.2",
     "react-dom": "16.5.2",
     "react-inspector": "2.3.0",
+    "react-remarkable": "1.1.3",
     "react-schema-form": "0.5.0",
     "react-scripts": "2.0.5",
     "react-tap-event-plugin": "3.0.2",

src/SqlStreamStoreBrowser.js

@@ -49,7 +49,8 @@ const initialNavigation = ({ authorization }) =>
 const formActions = {
     [rels.append]: actions.post,
     [rels.metadata]: actions.post,
-    [rels.delete]: actions.delete,
+    [rels.deleteStream]: actions.delete,
+    [rels.deleteMessage]: actions.delete,
 };
 
 const Hero = () => (

src/components/HyperMediaControls/HelpButton.js

@@ -1,9 +1,11 @@
 import React, { PureComponent } from 'react';
 import { Button, Drawer, withStyles } from '@material-ui/core';
+import Remarkable from 'react-remarkable';
 import uriTemplate from 'uri-template';
 import { Help } from '../Icons';
 import { withAuthorization } from '../AuthorizationProvider';
 import { http } from '../../utils';
+import Typography from '@material-ui/core/es/Typography/Typography';
 
 const getCurie = (rel, curies) => {
     const [prefix, rest] = rel.split(':', 2);
@@ -20,11 +22,12 @@ const getCurie = (rel, curies) => {
               }))[0] || { href: rel };
 };
 
-const Documentation = withStyles({
+const Documentation = withStyles(theme => ({
     drawerPaper: {
-        width: 480,
+        width: '45%',
+        padding: theme.spacing.unit * 2,
     },
-})(({ open, children, onClose, classes }) => (
+}))(({ open, children, onClose, classes }) => (
     <Drawer
         open={open}
         onClose={onClose}
@@ -33,7 +36,15 @@ const Documentation = withStyles({
             paper: classes.drawerPaper,
         }}
     >
-        {children}
+        <Typography>
+            <Remarkable
+                options={{
+                    typographer: true,
+                }}
+            >
+                {children}
+            </Remarkable>
+        </Typography>
     </Drawer>
 ));
 

src/components/RelIcon.js

@@ -25,7 +25,8 @@ const fontIconByRel = {
     [rels.feed]: RssFeed,
     [rels.append]: Publish,
     [rels.metadata]: Settings,
-    [rels.delete]: DeleteForever,
+    [rels.deleteStream]: DeleteForever,
+    [rels.deleteMessage]: DeleteForever,
     [rels.find]: Search,
     [rels.browse]: List,
     [rels.curies]: Help,

src/stream-store/rels.js

@@ -10,7 +10,8 @@ const rels = {
     metadata: 'streamStore:metadata',
     index: 'streamStore:index',
     append: 'streamStore:append',
-    delete: 'streamStore:delete',
+    deleteStream: 'streamStore:delete-stream',
+    deleteMessage: 'streamStore:delete-message',
     find: 'streamStore:find',
     browse: 'streamStore:feed-browser',
 };

src/stream-store/store.js

@@ -15,7 +15,7 @@ const forms$ = body$.map(({ _embedded }) =>
         .filter(
             rel =>
                 _embedded[rel].$schema &&
-                _embedded[rel].$schema.endsWith('hyper-schema#'),
+                _embedded[rel].$schema.endsWith('schema#'),
         )
         .reduce((akk, rel) => ({ ...akk, [rel]: _embedded[rel] }), {}),
 );

src/utils/http.js

@@ -1,6 +1,13 @@
 import mediaTypes from './mediaTypes';
 
-const tryParseJson = body => {
+const isJson = mediaType =>
+    mediaType === mediaTypes.json || (mediaType || '').endsWith('+json');
+
+const getBody = async (response, headers) => {
+    const body = await response.text();
+    if (!isJson(headers['content-type'])) {
+        return body;
+    }
     try {
         return JSON.parse(body);
     } catch (e) {
@@ -18,11 +25,13 @@ const getHeaders = headers =>
     );
 
 const mapResponse = async response => {
-    const { ok, status, statusText, url, headers } = response;
+    const { ok, status, statusText, url } = response;
+
+    const headers = getHeaders(response.headers);
 
     return {
-        body: tryParseJson(await response.text()),
-        headers: getHeaders(headers),
+        body: await getBody(response, headers),
+        headers,
         ok,
         status,
         statusText,

yarn.lock

@@ -1130,6 +1130,13 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
+argparse@~0.1.15:
+  version "0.1.16"
+  resolved "https://registry.yarnpkg.com/argparse/-/argparse-0.1.16.tgz#cfd01e0fbba3d6caed049fbd758d40f65196f57c"
+  dependencies:
+    underscore "~1.7.0"
+    underscore.string "~2.4.0"
+
 aria-query@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-3.0.0.tgz#65b3fcc1ca1155a8c9ae64d6eee297f15d5133cc"
@@ -1272,6 +1279,10 @@ atob@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.1.tgz#ae2d5a729477f289d60dd7f96a6314a22dd6c22a"
 
+autolinker@~0.15.0:
+  version "0.15.3"
+  resolved "https://registry.yarnpkg.com/autolinker/-/autolinker-0.15.3.tgz#342417d8f2f3461b14cf09088d5edf8791dc9832"
+
 autoprefixer@^9.1.5:
   version "9.2.0"
   resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.2.0.tgz#e46f893882b19a160370e7bcd3ec6bbeaace4d10"
@@ -7156,6 +7167,12 @@ react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
 
+react-remarkable@1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/react-remarkable/-/react-remarkable-1.1.3.tgz#6ef3861812d806fbf747cc1d1e151ee3172130a6"
+  dependencies:
+    remarkable "^1.x"
+
 react-schema-form@0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/react-schema-form/-/react-schema-form-0.5.0.tgz#77b4865d2f1c25f00e166f940ca376bfbfacfb6c"
@@ -7453,6 +7470,13 @@ relateurl@0.2.x:
   version "0.2.7"
   resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
 
+remarkable@^1.x:
+  version "1.7.1"
+  resolved "https://registry.yarnpkg.com/remarkable/-/remarkable-1.7.1.tgz#aaca4972100b66a642a63a1021ca4bac1be3bff6"
+  dependencies:
+    argparse "~0.1.15"
+    autolinker "~0.15.0"
+
 remove-trailing-separator@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
@@ -8548,10 +8572,18 @@ uglifyjs-webpack-plugin@^1.2.4:
     webpack-sources "^1.1.0"
     worker-farm "^1.5.2"
 
+underscore.string@~2.4.0:
+  version "2.4.0"
+  resolved "http://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz#8cdd8fbac4e2d2ea1e7e2e8097c42f442280f85b"
+
 underscore@^1.8.3:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.9.1.tgz#06dce34a0e68a7babc29b365b8e74b8925203961"
 
+underscore@~1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.7.0.tgz#6bbaf0877500d36be34ecaa584e0db9fef035209"
+
 unicode-canonical-property-names-ecmascript@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"