Merge pull request #225 from Superalgos/develop

Push to production

client/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "master-app-client",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1349,9 +1349,9 @@
       }
     },
     "@superalgos/operations-client": {
-      "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/@superalgos/operations-client/-/operations-client-0.0.31.tgz",
-      "integrity": "sha512-da+oMy4FSENNtqeJmgUSJKu4/cGH+F6jqfYBBwwHDWN2bh+ZrBnIuMt+NtxBwvMnJqe4RYlfyEWMYd5lPQQq4g==",
+      "version": "0.0.34",
+      "resolved": "https://registry.npmjs.org/@superalgos/operations-client/-/operations-client-0.0.34.tgz",
+      "integrity": "sha512-7VrPoEYATpyeKPQpBMFg3vpOgkEQN7Hny4Iq16mhWjsGxCTnKNIad3OxS/QeoaRB6mvY+r2DS3S3W6ZVoYT0Zw==",
       "dev": true,
       "requires": {
         "@material-ui/core": "^3.2.2",
@@ -1370,9 +1370,9 @@
       }
     },
     "@superalgos/strategizer-client": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/@superalgos/strategizer-client/-/strategizer-client-0.0.12.tgz",
-      "integrity": "sha512-7IN9JY66IBLtureVsGpyrpy4FGxr6gPRquJcSza/B7DLwWisyLlg9cgu21TZ8zXirm/1jzIZRRG039Rsc7UOEQ==",
+      "version": "0.0.15",
+      "resolved": "https://registry.npmjs.org/@superalgos/strategizer-client/-/strategizer-client-0.0.15.tgz",
+      "integrity": "sha512-wI/V8jsBlH391qLIY07Q05AOmHUPViES2Ow/klLYCslRaadMbWqYrWYJSoT618eH3Fnlr+M57lkQWIbrSLxvbg==",
       "dev": true,
       "requires": {
         "@material-ui/core": "^3.6.2",
@@ -1389,13 +1389,13 @@
       }
     },
     "@superalgos/teams-client": {
-      "version": "0.0.35",
-      "resolved": "https://registry.npmjs.org/@superalgos/teams-client/-/teams-client-0.0.35.tgz",
-      "integrity": "sha512-vG+eWQWqsfsyUaV266389GS/7w5seZr8pvcFrzHGGpcwFtMJMV9QBAxYTyqT1UXH3FGz/jWtRNPXFMinVZiPDA==",
+      "version": "0.0.38",
+      "resolved": "https://registry.npmjs.org/@superalgos/teams-client/-/teams-client-0.0.38.tgz",
+      "integrity": "sha512-Mbz0klKWyN9qP8Zds1khpXHx0FEHMWxDh7et5J2Rl/YTF3TqfBILtbgORJ6x6B8toz5FxBhvE6mZjHnvvY05fw==",
       "dev": true,
       "requires": {
         "@azure/storage-blob": "^10.0.0-preview",
-        "@superalgos/web-components": "0.0.19",
+        "@superalgos/web-components": "0.0.22",
         "apollo-cache-inmemory": "^1.3.5",
         "apollo-client": "^2.4.2",
         "apollo-link": "^1.2.3",
@@ -1410,7 +1410,7 @@
         "classnames": "^2.2.6",
         "cross-fetch": "^2.2.2",
         "dotenv-webpack": "^1.5.7",
-        "graphql": "^14.0.2",
+        "graphql": "^14.2.1",
         "graphql-tag": "^2.10.0",
         "minilog": "^3.1.0",
         "prop-types": "^15.6.2",
@@ -1423,29 +1423,13 @@
         "subscriptions-transport-ws": "^0.9.15"
       },
       "dependencies": {
-        "@superalgos/web-components": {
-          "version": "0.0.19",
-          "resolved": "https://registry.npmjs.org/@superalgos/web-components/-/web-components-0.0.19.tgz",
-          "integrity": "sha512-mXb7eb8/hjE09xV67q3UbbdqOU/7XiS/tMB6uWcL8fBvBfNGQqsNp35DYbt7gUvRrN3buVrlhq145Br+9vsdIQ==",
+        "graphql": {
+          "version": "14.2.1",
+          "resolved": "https://registry.npmjs.org/graphql/-/graphql-14.2.1.tgz",
+          "integrity": "sha512-2PL1UbvKeSjy/lUeJqHk+eR9CvuErXoCNwJI4jm3oNFEeY+9ELqHNKO1ZuSxAkasPkpWbmT/iMRMFxd3cEL3tQ==",
           "dev": true,
           "requires": {
-            "@azure/storage-blob": "^10.3.0",
-            "@bearcanrun/react-image-cropper": "^1.3.6",
-            "@material-ui/core": "^3.6.2",
-            "@material-ui/icons": "^3.0.1",
-            "apollo-client": "^2.4.7",
-            "blob-util": "^2.0.2",
-            "browser-image-resizer": "^1.2.0",
-            "deepmerge": "^3.1.0",
-            "graphql": "^14.0.2",
-            "graphql-tag": "^2.10.0",
-            "prop-types": "^15.6.2",
-            "react": "^16.8.4",
-            "react-apollo": "^2.3.2",
-            "react-dom": "^16.8.4",
-            "react-dropzone": "^5.1.0",
-            "react-helmet": "^5.2.0",
-            "react-router-dom": "^4.3.1"
+            "iterall": "^1.2.2"
           }
         }
       }
@@ -1508,9 +1492,9 @@
       }
     },
     "@superalgos/web-components": {
-      "version": "0.0.20",
-      "resolved": "https://registry.npmjs.org/@superalgos/web-components/-/web-components-0.0.20.tgz",
-      "integrity": "sha512-yH+oubFFLuWw1p62KDO8P5NS3Uh1pmSDNFxrz9cloCOTXBWRf6zmaLapum/146qCYE9OXtwJ6D49dNA6xr6Hng==",
+      "version": "0.0.22",
+      "resolved": "https://registry.npmjs.org/@superalgos/web-components/-/web-components-0.0.22.tgz",
+      "integrity": "sha512-TsPUllSXbZtIX1I4kAdA4vgarmEkVLHOhB6Kq5syAwm2gps6uNkl/pSMOb18h803H8osT/rHjhxA2Uyive4/4Q==",
       "dev": true,
       "requires": {
         "@azure/storage-blob": "^10.3.0",
@@ -1531,12 +1515,6 @@
         "react-router-dom": "^5.0.0"
       },
       "dependencies": {
-        "browser-image-resizer": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/browser-image-resizer/-/browser-image-resizer-2.0.1.tgz",
-          "integrity": "sha512-0fVKk7duXkvqZXdK96LpRii2v1rQfvPXSt7Ow5z1neoAmYZPnO66y1XAy8dRExjWPtSGk34Ehtk+w814iDAOWg==",
-          "dev": true
-        },
         "graphql": {
           "version": "14.2.1",
           "resolved": "https://registry.npmjs.org/graphql/-/graphql-14.2.1.tgz",
@@ -1546,29 +1524,17 @@
             "iterall": "^1.2.2"
           }
         },
-        "react": {
-          "version": "16.8.6",
-          "resolved": "https://registry.npmjs.org/react/-/react-16.8.6.tgz",
-          "integrity": "sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==",
-          "dev": true,
-          "requires": {
-            "loose-envify": "^1.1.0",
-            "object-assign": "^4.1.1",
-            "prop-types": "^15.6.2",
-            "scheduler": "^0.13.6"
-          }
-        },
         "react-apollo": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/react-apollo/-/react-apollo-2.5.4.tgz",
-          "integrity": "sha512-olH9zYijOXVfj14hD7bQlZ0POBJchxg2e+mfnxEiEdqZra4+58SfIY0KPhmM9jqbeeusc6J/P4zzWIHt5DdNDg==",
+          "version": "2.5.5",
+          "resolved": "https://registry.npmjs.org/react-apollo/-/react-apollo-2.5.5.tgz",
+          "integrity": "sha512-zoJYlkI3i7+f1ejCbFtWU2GLCxjrmB3Es6RANyEZcbl0yetf5TI6ofMjBzILTvwoqp6tiQHH/8q66vQF0KcLmQ==",
           "dev": true,
           "requires": {
             "apollo-utilities": "^1.2.1",
             "hoist-non-react-statics": "^3.3.0",
             "lodash.isequal": "^4.5.0",
             "prop-types": "^15.7.2",
-            "ts-invariant": "^0.3.2",
+            "ts-invariant": "^0.4.0",
             "tslib": "^1.9.3"
           }
         },
@@ -1584,17 +1550,6 @@
             "scheduler": "^0.13.6"
           }
         },
-        "react-dropzone": {
-          "version": "10.1.3",
-          "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-10.1.3.tgz",
-          "integrity": "sha512-ry17scg+B/itdBJn0Qd2UxYQIeQyuTgLDyb1o+BM1jQ6CAgtuaYo4W/UA+UK9VnzwvFuwMcmZJjjju2rMFPMLg==",
-          "dev": true,
-          "requires": {
-            "attr-accept": "^1.1.3",
-            "file-selector": "^0.1.11",
-            "prop-types": "^15.7.2"
-          }
-        },
         "react-router": {
           "version": "5.0.0",
           "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.0.0.tgz",
@@ -1639,9 +1594,9 @@
           }
         },
         "ts-invariant": {
-          "version": "0.3.3",
-          "resolved": "https://registry.npmjs.org/ts-invariant/-/ts-invariant-0.3.3.tgz",
-          "integrity": "sha512-UReOKsrJFGC9tUblgSRWo+BsVNbEd77Cl6WiV/XpMlkifXwNIJbknViCucHvVZkXSC/mcWeRnIGdY7uprcwvdQ==",
+          "version": "0.4.1",
+          "resolved": "https://registry.npmjs.org/ts-invariant/-/ts-invariant-0.4.1.tgz",
+          "integrity": "sha512-fdL8AZinDiVKMsOI0cOWHLprS85LWy2p/eVSctVe6fpZF9BAvO59sQYMEWQ37yybBtlKU2zkmILYmy1jrOf6+g==",
           "dev": true,
           "requires": {
             "tslib": "^1.9.3"
@@ -4065,9 +4020,9 @@
       "dev": true
     },
     "browser-image-resizer": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/browser-image-resizer/-/browser-image-resizer-1.2.0.tgz",
-      "integrity": "sha512-xMiB6BnRsD6RWmkD6Av90qXY7uaAOXJPaS5D8cSazyao/bx6ENCm67XGl6BIhn1ETjK52yEs8A/atmMPp74M4A==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/browser-image-resizer/-/browser-image-resizer-2.0.1.tgz",
+      "integrity": "sha512-0fVKk7duXkvqZXdK96LpRii2v1rQfvPXSt7Ow5z1neoAmYZPnO66y1XAy8dRExjWPtSGk34Ehtk+w814iDAOWg==",
       "dev": true
     },
     "browser-process-hrtime": {
@@ -5258,9 +5213,9 @@
       "dev": true
     },
     "collapse-white-space": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-1.0.4.tgz",
-      "integrity": "sha512-YfQ1tAUZm561vpYD+5eyWN8+UsceQbSrqqlc/6zDY2gtAE+uZLSdkkovhnGpmCThsvKBFakq4EdY/FF93E8XIw==",
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-1.0.5.tgz",
+      "integrity": "sha512-703bOOmytCYAX9cXYqoikYIx6twmFCXsnzRQheBcTG3nzKYBR4P/+wkYeH+Mvj7qUz8zZDtdyzbxfnEi/kYzRQ==",
       "dev": true
     },
     "collection-visit": {
@@ -8927,7 +8882,8 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -8955,6 +8911,7 @@
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -8969,7 +8926,8 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
@@ -8980,7 +8938,8 @@
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -9097,7 +9056,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -9109,6 +9069,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -9123,6 +9084,7 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -9130,12 +9092,14 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -9154,6 +9118,7 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -9234,7 +9199,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -9246,6 +9212,7 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -9331,7 +9298,8 @@
         "safe-buffer": {
           "version": "5.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -9367,6 +9335,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -9386,6 +9355,7 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -9429,12 +9399,14 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "yallist": {
           "version": "3.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         }
       }
     },
@@ -19213,13 +19185,14 @@
       }
     },
     "react-dropzone": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-5.1.1.tgz",
-      "integrity": "sha512-C9kXI3D95rVXbLLg9DvzCnmjplKwpfj/2F/MwvGVM05kDwWMzKVKZnmgZHZUebmiVj4mFOmBs2ObLiKvAxunGw==",
+      "version": "10.1.4",
+      "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-10.1.4.tgz",
+      "integrity": "sha512-Dc/yxW6AWaNhZcN6e6sl6Q+5nbDgLargDsldqS+FVUDyMOyuWBiTGJex9WHA0S0CU6x1EoUeVItNctd4yTjdLw==",
       "dev": true,
       "requires": {
         "attr-accept": "^1.1.3",
-        "prop-types": "^15.6.2"
+        "file-selector": "^0.1.11",
+        "prop-types": "^15.7.2"
       }
     },
     "react-error-overlay": {
@@ -19316,14 +19289,14 @@
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
     },
     "react-markdown": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/react-markdown/-/react-markdown-4.0.6.tgz",
-      "integrity": "sha512-E1d/q+OBk5eumId42oYqVrJRB/+whrZdk+YHqUBCCNeWxqeV+Qzt+yLTsft9+4HRDj89Od7eAbUPQBYq8ZwShQ==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/react-markdown/-/react-markdown-4.0.8.tgz",
+      "integrity": "sha512-Z6oa648rufvzyO0KwYJ/9p9AsdYGIluqK6OlpJ35ouJ8HPF0Ko1WDNdyymjDSHxNrkb7HDyEcIDJCQs8NlET5A==",
       "dev": true,
       "requires": {
         "html-to-react": "^1.3.4",
         "mdast-add-list-metadata": "1.0.1",
-        "prop-types": "^15.6.1",
+        "prop-types": "^15.7.2",
         "remark-parse": "^5.0.0",
         "unified": "^6.1.5",
         "unist-util-visit": "^1.3.0",

client/package.json

@@ -32,15 +32,15 @@
     "@babel/plugin-transform-runtime": "^7.1.0",
     "@babel/preset-env": "^7.1.0",
     "@babel/preset-react": "^7.0.0",
+    "@superalgos/cockpit-client": "0.0.5",
     "@superalgos/events-client": "0.0.2",
     "@superalgos/key-vault-client": "0.0.32",
     "@superalgos/logs-client": "0.0.1",
-    "@superalgos/strategizer-client": "0.0.13",
     "@superalgos/operations-client": "0.0.34",
-    "@superalgos/teams-client": "0.0.35",
+    "@superalgos/strategizer-client": "0.0.15",
+    "@superalgos/teams-client": "0.0.38",
     "@superalgos/users-client": "0.0.25",
-    "@superalgos/web-components": "0.0.20",
-    "@superalgos/cockpit-client": "0.0.5",
+    "@superalgos/web-components": "0.0.22",
     "autoprefixer": "^9.2.0",
     "babel-loader": "^8.0.4",
     "babel-preset-flow": "6.23.0",

client/src/styles/styles.scss

@@ -63,6 +63,10 @@ body{
     background-color: #737272;
     border: 1px solid #000;
   }
+  pre {
+    white-space: pre-wrap;
+    margin: 0;
+  }
 }
 
 .container{
@@ -271,8 +275,8 @@ header.menu{
             position: relative;
             padding-top: ( $height-nav-bar - $text-height ) / 2;
             padding-bottom: ( $height-nav-bar - $text-height ) / 2;
-            padding-right: 14px;
-            padding-left: 14px;
+            padding-left: 10px;
+            padding-right: 10px;
             &.hasChildren{
               &:after{
                 content: '';
@@ -299,6 +303,10 @@ header.menu{
               }
               svg{
                 padding-top: 10px;
+                margin-bottom: -2px; 
+                &.tutorialIcon {
+                  padding-top: 0px;
+                }
               }
             }
             ul.subMenu{
@@ -347,6 +355,12 @@ header.menu{
       display: block;
       top: 42%;
     }
+    &.landing {
+      .caption{
+        display: block;
+        top: 25%;
+      }
+    }
   }
   &.medium{
     height: 50vh;
@@ -371,10 +385,24 @@ header.menu{
       color: white;
       line-height: 30px;
       font-weight: 600;
-      padding: 20px 0 0.5em 0;
+      padding: 2em 20% 0.5em;
       @include fluid-type($break-xs, $break-lg, 18px, 20px);
     }
     .instructions{
+      h4{
+        color: white;
+        margin-top: 25px;
+        margin-bottom: 10px;
+        font-size: 1.6em;
+        a {
+          color: white;
+          text-decoration: none;
+          font-size: 0.9em;
+          &:hover {
+            color: #f55858;
+          }
+        }
+      }
       h5{
         color: white;
         margin-top:25px;

client/src/views/home/index.js

@@ -22,16 +22,19 @@ class Home extends Component {
       <React.Fragment>
         {this.state.user !== undefined && this.state.user !== null && (
           <BannerTopBar
-            size='big'
+            size='big landing'
             title='Superalgos Platform Demo'
-            text='Get Started Using the Demo'
+            text='The platform demo is a functional prototype built for exposing and evaluating the multitude of Superalgos platform services. The user experience has not been optimized and will be refined in future use case implementations.'
             backgroundUrl='https://superalgos.org/img/photos/superalgos-platform.jpg'
           >
             <div className='instructions'>
-              <Typography align='center' variant='subtitle1' >1. <Link to='/teams/manage-teams'>Create a Team and Financial Being →</Link></Typography>
+              <Typography align='center' variant='h4' >DEMO OVERVIEW</Typography>
+              <Typography align='center' variant='subtitle1' >1. <Link to='/teams/manage-teams'>Create a Team and Fork the Template Bots →</Link></Typography>
               <Typography align='center' variant='subtitle1' >2. <Link to='/strategizer'>Visit the Strategizer and learn how to build a strategy →</Link></Typography>
-              <Typography align='center' variant='subtitle1' >3. <Link to='/clones/add'>Run a clone instance of your simulator algobot to test the strategy →</Link></Typography>
+              <Typography align='center' variant='subtitle1' >3. <Link to='/clones/add'>Run a clone instance of your Simulator bot to test the strategy →</Link></Typography>
               <Typography align='center' variant='subtitle1' >4. <Link to='/charts'>View the results of your strategy in the charts →</Link></Typography>
+              <Typography align='center' variant='subtitle1' >5. <Link to='/clones/add'>Now use your strategy with your trading bot by running a backtest clone instance →</Link></Typography>
+              <Typography align='center' variant='subtitle1' gutterBottom>5. <Link to='/keys/addKey'>(Optional) Add an exchange API key to run your trading bot live →</Link></Typography>
             </div>
           </BannerTopBar>
         )}

client/src/views/layout/header/index.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types'
 import { Link } from 'react-router-dom'
 import jwtDecode from 'jwt-decode'
 import withWidth from '@material-ui/core/withWidth'
+import { NotListedLocation as TutorialIcon } from '@material-ui/icons'
 
 // components
 import { LoggedIn } from './LoggedIn'
@@ -112,6 +113,9 @@ class Header extends Component {
             </div>
             <nav className={mobileOpen ? 'links openedMobile' : 'links'}>
               <ul className='primaryMenu'>
+                <li className='primaryLink'>
+                  <Link to='/'><TutorialIcon className='tutorialIcon' /></Link>
+                </li>
                 <li className='primaryLink'>
                   <Link to='/charts'> Charts </Link>
                 </li>
@@ -145,7 +149,7 @@ class Header extends Component {
     )
   }
 
-  renderSubMenu(Icon, to, title, submenus, authenticated, index, bigScreen) {
+  renderSubMenu (Icon, to, title, submenus, authenticated, index, bigScreen) {
     return submenus.length === 0 ? null : (
       <ul className='subMenu'>
         { bigScreen