From b3473e01c4bf6f3995d8f856a475647dedae53ae Mon Sep 17 00:00:00 2001 From: Barry Low Date: Fri, 12 Apr 2019 01:31:23 +0200 Subject: [PATCH] Add instructions to home on user login --- client/package-lock.json | 189 +++++++++++++++++++++++++++++---- client/package.json | 4 +- client/src/styles/styles.scss | 17 +++ client/src/views/home/index.js | 45 ++++++-- 4 files changed, 228 insertions(+), 27 deletions(-) diff --git a/client/package-lock.json b/client/package-lock.json index b5f35f1f4..d46b50933 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1508,28 +1508,145 @@ } }, "@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==", + "version": "0.0.20", + "resolved": "https://registry.npmjs.org/@superalgos/web-components/-/web-components-0.0.20.tgz", + "integrity": "sha512-yH+oubFFLuWw1p62KDO8P5NS3Uh1pmSDNFxrz9cloCOTXBWRf6zmaLapum/146qCYE9OXtwJ6D49dNA6xr6Hng==", "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", + "apollo-client": "^2.5.1", "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", + "browser-image-resizer": "^2.0.1", + "graphql": "^14.2.1", + "graphql-tag": "^2.10.1", + "prop-types": "^15.7.2", + "react": "^16.8.6", + "react-apollo": "^2.5.4", + "react-dom": "^16.8.6", + "react-dropzone": "^10.1.3", "react-helmet": "^5.2.0", - "react-router-dom": "^4.3.1" + "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", + "integrity": "sha512-2PL1UbvKeSjy/lUeJqHk+eR9CvuErXoCNwJI4jm3oNFEeY+9ELqHNKO1ZuSxAkasPkpWbmT/iMRMFxd3cEL3tQ==", + "dev": true, + "requires": { + "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==", + "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", + "tslib": "^1.9.3" + } + }, + "react-dom": { + "version": "16.8.6", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.8.6.tgz", + "integrity": "sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==", + "dev": true, + "requires": { + "loose-envify": "^1.1.0", + "object-assign": "^4.1.1", + "prop-types": "^15.6.2", + "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", + "integrity": "sha512-6EQDakGdLG/it2x9EaCt9ZpEEPxnd0OCLBHQ1AcITAAx7nCnyvnzf76jKWG1s2/oJ7SSviUgfWHofdYljFexsA==", + "dev": true, + "requires": { + "@babel/runtime": "^7.1.2", + "create-react-context": "^0.2.2", + "history": "^4.9.0", + "hoist-non-react-statics": "^3.1.0", + "loose-envify": "^1.3.1", + "path-to-regexp": "^1.7.0", + "prop-types": "^15.6.2", + "react-is": "^16.6.0", + "tiny-invariant": "^1.0.2", + "tiny-warning": "^1.0.0" + } + }, + "react-router-dom": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.0.0.tgz", + "integrity": "sha512-wSpja5g9kh5dIteZT3tUoggjnsa+TPFHSMrpHXMpFsaHhQkm/JNVGh2jiF9Dkh4+duj4MKCkwO6H08u6inZYgQ==", + "dev": true, + "requires": { + "@babel/runtime": "^7.1.2", + "history": "^4.9.0", + "loose-envify": "^1.3.1", + "prop-types": "^15.6.2", + "react-router": "5.0.0", + "tiny-invariant": "^1.0.2", + "tiny-warning": "^1.0.0" + } + }, + "scheduler": { + "version": "0.13.6", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.13.6.tgz", + "integrity": "sha512-IWnObHt413ucAYKsD9J1QShUKkbKLQQHdxRyw73sw4FN26iWr3DY/H34xGPe4nmL1DwXyWmSWmMrA9TfQbE/XQ==", + "dev": true, + "requires": { + "loose-envify": "^1.1.0", + "object-assign": "^4.1.1" + } + }, + "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==", + "dev": true, + "requires": { + "tslib": "^1.9.3" + } + } } }, "@svgr/babel-plugin-add-jsx-attribute": { @@ -5488,6 +5605,16 @@ "object-assign": "^4.1.1" } }, + "create-react-context": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.2.3.tgz", + "integrity": "sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==", + "dev": true, + "requires": { + "fbjs": "^0.8.0", + "gud": "^1.0.0" + } + }, "cross-fetch": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-2.2.3.tgz", @@ -7877,6 +8004,15 @@ "schema-utils": "^1.0.0" } }, + "file-selector": { + "version": "0.1.11", + "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.1.11.tgz", + "integrity": "sha512-NopCegJ7QuoqVzUdSLcZb0M9IFO69CSFZzuZhZBasfQxepNwa1ehL6L9UKe3EyBof3EUeraccfJocLCRAvtxdg==", + "dev": true, + "requires": { + "tslib": "^1.9.0" + } + }, "filename-regex": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz", @@ -9582,6 +9718,12 @@ "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=", "dev": true }, + "gud": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz", + "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw==", + "dev": true + }, "gzip-size": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.0.0.tgz", @@ -18870,14 +19012,25 @@ } }, "react": { - "version": "16.8.5", - "resolved": "https://registry.npmjs.org/react/-/react-16.8.5.tgz", - "integrity": "sha512-daCb9TD6FZGvJ3sg8da1tRAtIuw29PbKZW++NN4wqkbEvxL+bZpaaYb4xuftW/SpXmgacf1skXl/ddX6CdOlDw==", + "version": "16.8.6", + "resolved": "https://registry.npmjs.org/react/-/react-16.8.6.tgz", + "integrity": "sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", "prop-types": "^15.6.2", - "scheduler": "^0.13.5" + "scheduler": "^0.13.6" + }, + "dependencies": { + "scheduler": { + "version": "0.13.6", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.13.6.tgz", + "integrity": "sha512-IWnObHt413ucAYKsD9J1QShUKkbKLQQHdxRyw73sw4FN26iWr3DY/H34xGPe4nmL1DwXyWmSWmMrA9TfQbE/XQ==", + "requires": { + "loose-envify": "^1.1.0", + "object-assign": "^4.1.1" + } + } } }, "react-apollo": { diff --git a/client/package.json b/client/package.json index 5f2f8822c..6a1d3fb57 100644 --- a/client/package.json +++ b/client/package.json @@ -40,7 +40,7 @@ "@superalgos/strategizer-client": "0.0.11", "@superalgos/teams-client": "0.0.35", "@superalgos/users-client": "0.0.25", - "@superalgos/web-components": "0.0.19", + "@superalgos/web-components": "0.0.20", "autoprefixer": "^9.2.0", "babel-loader": "^8.0.4", "babel-preset-flow": "6.23.0", @@ -103,7 +103,7 @@ "optimize-css-assets-webpack-plugin": "^5.0.1", "prop-types": "^15.6.2", "query-string": "^6.2.0", - "react": "^16.8.4", + "react": "^16.8.6", "react-apollo": "^2.5.2", "react-dom": "^16.8.4", "react-redux": "^5.1.0", diff --git a/client/src/styles/styles.scss b/client/src/styles/styles.scss index 7b5d9e765..6900b5ddd 100644 --- a/client/src/styles/styles.scss +++ b/client/src/styles/styles.scss @@ -374,6 +374,23 @@ header.menu{ padding: 20px 0 0.5em 0; @include fluid-type($break-xs, $break-lg, 18px, 20px); } + .instructions{ + h5{ + color: white; + margin-top:25px; + } + h6{ + color: white; + font-weight: 600; + a { + color: white; + text-decoration: none; + &:hover { + color: #f55858; + } + } + } + } } } diff --git a/client/src/views/home/index.js b/client/src/views/home/index.js index 8a3082c19..d5558581b 100644 --- a/client/src/views/home/index.js +++ b/client/src/views/home/index.js @@ -1,17 +1,48 @@ import React, { Component } from 'react' +import { Link } from 'react-router-dom' + import { BannerTopBar } from '../common' import { Typography } from '@material-ui/core' class Home extends Component { + constructor (props) { + super(props) + this.state = { + user: null + } + } + componentDidMount () { + const user = window.localStorage.getItem('user') + this.setState({ user }) + } render () { + let user = JSON.parse(this.state.user) + if(this.state.user !== undefined && this.state.user !== null){} return ( - + {this.state.user !== undefined && this.state.user !== null && ( + +
+ 1. Create a Team and Financial Being → + 2. Visit the Strategizer and learn how to build a strategy → + 3. Run a clone instance of your simulator algobot to test the strategy → + 4. View the results of your strategy in the charts → +
+ + )} + {(this.state.user === undefined || this.state.user === null) && ( + + )}
Welcome to the Superalgos Platform! Enabling the evolutionary race towards the emergence of superalgos @@ -28,7 +59,7 @@ class Home extends Component {
- Feel free to explore the menu in the top-right corner or visit the Quick Start Guide. + Feel free to explore the menu in the top-right corner or visit the Quick Start Guide. Reporting of bugs at the corresponding Superalgos Github repository is highly appreciated.