From fe08ccc8b259468902b82a0c1223e7736299fed2 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 12:02:51 +0200 Subject: [PATCH 01/18] fix search titles --- .../src/components/templates/Route.module.scss | 9 --------- client/src/components/templates/Route.tsx | 10 +--------- client/src/routes/Search.module.scss | 11 +++++++++++ client/src/routes/Search.tsx | 18 +++++++++++------- 4 files changed, 23 insertions(+), 25 deletions(-) diff --git a/client/src/components/templates/Route.module.scss b/client/src/components/templates/Route.module.scss index 3728aef..828f380 100644 --- a/client/src/components/templates/Route.module.scss +++ b/client/src/components/templates/Route.module.scss @@ -18,12 +18,3 @@ margin-top: $spacer / 2; font-size: $font-size-large; } - -.titleReverse { - composes: title; - color: $brand-grey-light; - - span { - color: $brand-grey-dark; - } -} diff --git a/client/src/components/templates/Route.tsx b/client/src/components/templates/Route.tsx index 38a982b..e11d3cb 100644 --- a/client/src/components/templates/Route.tsx +++ b/client/src/components/templates/Route.tsx @@ -7,14 +7,12 @@ import meta from '../../data/meta.json' const Route = ({ title, description, - titleReverse, wide, children, className }: { title: string description?: string - titleReverse?: boolean children: any wide?: boolean className?: string @@ -29,13 +27,7 @@ const Route = ({
-

- {title} -

+

{title}

{description && (

{ const { totalResults, totalPages, currentPage } = this.state return ( - 0 ? totalResults : '' - } Results for ${this.searchTerm}`} - titleReverse - wide - > + + {totalResults > 0 && ( +

${ + this.searchTerm + }` + }} + /> + )} {this.renderResults()} Date: Mon, 29 Apr 2019 12:14:32 +0200 Subject: [PATCH 02/18] update telegram link --- client/src/data/meta.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/data/meta.json b/client/src/data/meta.json index 29ee49e..05fc46c 100644 --- a/client/src/data/meta.json +++ b/client/src/data/meta.json @@ -25,7 +25,7 @@ }, { "title": "Telegram", - "url": "https://t.me/joinchat/GUyxrE0Hi154D0NrlOqLFg" + "url": "https://t.me/OceanProtocolCommunity" } ] } From 8f832b63220a46a8de0061ffc2498186e2099315 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 12:25:22 +0200 Subject: [PATCH 03/18] Release 0.2.4 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6cd3cc7..0d290a9 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "commons", "description": "Ocean Protocol marketplace to explore, download, and publish open data sets.", - "version": "0.2.3", + "version": "0.2.4", "license": "Apache-2.0", "scripts": { "install": "./scripts/install.sh", From 0d3afc821900fada63013fc8aec434a634c67199 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 12:25:37 +0200 Subject: [PATCH 04/18] update changelog --- CHANGELOG.md | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index a378513..d3181da 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,22 @@ All notable changes to this project will be documented in this file. Dates are d Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). +#### [v0.2.4](https://github.com/oceanprotocol/commons/compare/v0.2.3...v0.2.4) + +> 29 April 2019 + +- fix search titles [`#112`](https://github.com/oceanprotocol/commons/pull/112) +- Release 0.2.4 [`8f832b6`](https://github.com/oceanprotocol/commons/commit/8f832b63220a46a8de0061ffc2498186e2099315) + +#### [v0.2.3](https://github.com/oceanprotocol/commons/compare/v0.2.2...v0.2.3) + +> 25 April 2019 + +- fix datepicker styles [`#109`](https://github.com/oceanprotocol/commons/pull/109) +- update changelog [`8a79db0`](https://github.com/oceanprotocol/commons/commit/8a79db04c8792e48224e225b70232441d9653283) +- hotfix for asset title user input [`17082c8`](https://github.com/oceanprotocol/commons/commit/17082c817f11f5124eb5865371dd07e6806a77da) +- lock Travis to Node.js v11 [`7e9013e`](https://github.com/oceanprotocol/commons/commit/7e9013e7cd37d060ce897dd84a55e471372ed843) + #### [v0.2.2](https://github.com/oceanprotocol/commons/compare/v0.2.1...v0.2.2) > 23 April 2019 From 039c7b2fe5b059d4cbb7db0b2cf328104b96591f Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 17:57:45 +0200 Subject: [PATCH 05/18] sanitize search input --- client/src/routes/Home.tsx | 4 +++- client/src/routes/Search.tsx | 27 ++++++++++++++++----------- 2 files changed, 19 insertions(+), 12 deletions(-) diff --git a/client/src/routes/Home.tsx b/client/src/routes/Home.tsx index ce70175..8eb4ad5 100644 --- a/client/src/routes/Home.tsx +++ b/client/src/routes/Home.tsx @@ -54,7 +54,9 @@ class Home extends Component { private searchAssets = (event: FormEvent) => { event.preventDefault() - this.props.history.push(`/search?text=${this.state.search}`) + this.props.history.push( + `/search?text=${JSON.stringify(this.state.search)}` + ) } } diff --git a/client/src/routes/Search.tsx b/client/src/routes/Search.tsx index 0f7c866..ec192b8 100644 --- a/client/src/routes/Search.tsx +++ b/client/src/routes/Search.tsx @@ -20,6 +20,7 @@ interface SearchState { totalPages: number currentPage: number isLoading: boolean + searchTerm: string } export default class Search extends PureComponent { @@ -29,18 +30,22 @@ export default class Search extends PureComponent { offset: 25, totalPages: 1, currentPage: 1, - isLoading: true + isLoading: true, + searchTerm: '' } - private readonly searchTerm = queryString.parse(this.props.location.search) - .text - private readonly searchPage = queryString.parse(this.props.location.search) - .page - public async componentDidMount() { + const searchTerm = await queryString.parse(this.props.location.search) + .text + const searchPage = queryString.parse(this.props.location.search).page + + await this.setState({ + searchTerm: JSON.stringify(searchTerm) + }) + // switch to respective page if query string is present - if (this.searchPage) { - const currentPage = Number(this.searchPage) + if (searchPage) { + const currentPage = Number(searchPage) await this.setState({ currentPage }) } @@ -52,7 +57,7 @@ export default class Search extends PureComponent { offset: this.state.offset, page: this.state.currentPage, query: { - text: [this.searchTerm], + text: [this.state.searchTerm], price: [-1, 1] }, sort: { @@ -78,7 +83,7 @@ export default class Search extends PureComponent { this.props.history.push({ pathname: this.props.location.pathname, - search: `?text=${this.searchTerm}&page=${toPage}` + search: `?text=${this.state.searchTerm}&page=${toPage}` }) await this.setState({ currentPage: toPage, isLoading: true }) @@ -108,7 +113,7 @@ export default class Search extends PureComponent { className={styles.resultsTitle} dangerouslySetInnerHTML={{ __html: `${totalResults} results for ${ - this.searchTerm + this.state.searchTerm }` }} /> From 82906093e60f4b52302b6f08f19787f65b24fafd Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 18:44:12 +0200 Subject: [PATCH 06/18] Release 0.2.5 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 0d290a9..6648864 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "commons", "description": "Ocean Protocol marketplace to explore, download, and publish open data sets.", - "version": "0.2.4", + "version": "0.2.5", "license": "Apache-2.0", "scripts": { "install": "./scripts/install.sh", From da47751442747fbb95297c00f98b964df4beeda3 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Mon, 29 Apr 2019 21:04:33 +0200 Subject: [PATCH 07/18] add blockies for account display --- client/package-lock.json | 605 ++++++++++++++++-- client/package.json | 3 +- .../src/@types/ethereum-blockies/index.d.ts | 5 + .../src/components/atoms/Account.module.scss | 24 + client/src/components/atoms/Account.tsx | 19 + .../AccountStatus/Popover.module.scss | 8 - .../molecules/AccountStatus/Popover.tsx | 49 +- .../organisms/Web3message.module.scss | 13 +- .../src/components/organisms/Web3message.tsx | 13 +- 9 files changed, 638 insertions(+), 101 deletions(-) create mode 100644 client/src/@types/ethereum-blockies/index.d.ts create mode 100644 client/src/components/atoms/Account.module.scss create mode 100644 client/src/components/atoms/Account.tsx diff --git a/client/package-lock.json b/client/package-lock.json index 0e0cd8f..a929be0 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1260,6 +1260,345 @@ "uuid": "^3.3.2", "web3": "1.0.0-beta.37", "whatwg-url": "^7.0.0" + }, + "dependencies": { + "bn.js": { + "version": "4.11.6", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz", + "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU=" + }, + "elliptic": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.3.3.tgz", + "integrity": "sha1-VILZZG1UvLif19mU/J4ulWiHbj8=", + "requires": { + "bn.js": "^4.4.0", + "brorand": "^1.0.1", + "hash.js": "^1.0.0", + "inherits": "^2.0.1" + } + }, + "ethers": { + "version": "4.0.0-beta.1", + "resolved": "https://registry.npmjs.org/ethers/-/ethers-4.0.0-beta.1.tgz", + "integrity": "sha512-SoYhktEbLxf+fiux5SfCEwdzWENMvgIbMZD90I62s4GZD9nEjgEWy8ZboI3hck193Vs0bDoTohDISx84f2H2tw==", + "requires": { + "@types/node": "^10.3.2", + "aes-js": "3.0.0", + "bn.js": "^4.4.0", + "elliptic": "6.3.3", + "hash.js": "1.1.3", + "js-sha3": "0.5.7", + "scrypt-js": "2.0.3", + "setimmediate": "1.0.4", + "uuid": "2.0.1", + "xmlhttprequest": "1.8.0" + }, + "dependencies": { + "setimmediate": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.4.tgz", + "integrity": "sha1-IOgd5iLUoCWIzgyNqJc8vPHTE48=" + }, + "uuid": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.1.tgz", + "integrity": "sha1-wqMN7bPlNdcsz4LjQ5QaULqFM6w=" + } + } + }, + "eventemitter3": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.1.1.tgz", + "integrity": "sha1-R3hr2qCHyvext15zq8XH1UAVjNA=" + }, + "fs-extra": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-2.1.2.tgz", + "integrity": "sha1-BGxwFjzvmq1GsOSn+kZ/si1x3jU=", + "requires": { + "graceful-fs": "^4.1.2", + "jsonfile": "^2.1.0" + } + }, + "hash.js": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.3.tgz", + "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA==", + "requires": { + "inherits": "^2.0.3", + "minimalistic-assert": "^1.0.0" + } + }, + "js-sha3": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.5.7.tgz", + "integrity": "sha1-DU/9gALVMzqrr0oj7tL2N0yfKOc=" + }, + "jsonfile": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz", + "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=", + "requires": { + "graceful-fs": "^4.1.6" + } + }, + "scrypt-js": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/scrypt-js/-/scrypt-js-2.0.3.tgz", + "integrity": "sha1-uwBAvgMEPamgEqLOqfyfhSz8h9Q=" + }, + "swarm-js": { + "version": "0.1.37", + "resolved": "https://registry.npmjs.org/swarm-js/-/swarm-js-0.1.37.tgz", + "integrity": "sha512-G8gi5fcXP/2upwiuOShJ258sIufBVztekgobr3cVgYXObZwJ5AXLqZn52AI+/ffft29pJexF9WNdUxjlkVehoQ==", + "requires": { + "bluebird": "^3.5.0", + "buffer": "^5.0.5", + "decompress": "^4.0.0", + "eth-lib": "^0.1.26", + "fs-extra": "^2.1.2", + "fs-promise": "^2.0.0", + "got": "^7.1.0", + "mime-types": "^2.1.16", + "mkdirp-promise": "^5.0.1", + "mock-fs": "^4.1.0", + "setimmediate": "^1.0.5", + "tar.gz": "^1.0.5", + "xhr-request-promise": "^0.1.2" + } + }, + "web3": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3/-/web3-1.0.0-beta.37.tgz", + "integrity": "sha512-8XLgUspdzicC/xHG82TLrcF/Fxzj2XYNJ1KTYnepOI77bj5rvpsxxwHYBWQ6/JOjk0HkZqoBfnXWgcIHCDhZhQ==", + "requires": { + "web3-bzz": "1.0.0-beta.37", + "web3-core": "1.0.0-beta.37", + "web3-eth": "1.0.0-beta.37", + "web3-eth-personal": "1.0.0-beta.37", + "web3-net": "1.0.0-beta.37", + "web3-shh": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-bzz": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-bzz/-/web3-bzz-1.0.0-beta.37.tgz", + "integrity": "sha512-E+dho49Nsm/QpQvYWOF35YDsQrMvLB19AApENxhlQsu6HpWQt534DQul0t3Y/aAh8rlKD6Kanxt8LhHDG3vejQ==", + "requires": { + "got": "7.1.0", + "swarm-js": "0.1.37", + "underscore": "1.8.3" + } + }, + "web3-core": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core/-/web3-core-1.0.0-beta.37.tgz", + "integrity": "sha512-cIwEqCj7OJyefQNauI0HOgW4sSaOQ98V99H2/HEIlnCZylsDzfw7gtQUdwnRFiIyIxjbWy3iWsjwDPoXNPZBYg==", + "requires": { + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-core-requestmanager": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-core-helpers": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-helpers/-/web3-core-helpers-1.0.0-beta.37.tgz", + "integrity": "sha512-efaLOzN28RMnbugnyelgLwPWWaSwElQzcAJ/x3PZu+uPloM/lE5x0YuBKvIh7/PoSMlHqtRWj1B8CpuQOUQ5Ew==", + "requires": { + "underscore": "1.8.3", + "web3-eth-iban": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-core-method": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-method/-/web3-core-method-1.0.0-beta.37.tgz", + "integrity": "sha512-pKWFUeqnVmzx3VrZg+CseSdrl/Yrk2ioid/HzolNXZE6zdoITZL0uRjnsbqXGEzgRRd1Oe/pFndpTlRsnxXloA==", + "requires": { + "underscore": "1.8.3", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-promievent": "1.0.0-beta.37", + "web3-core-subscriptions": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-core-subscriptions": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-subscriptions/-/web3-core-subscriptions-1.0.0-beta.37.tgz", + "integrity": "sha512-FdXl8so9kwkRRWziuCSpFsAuAdg9KvpXa1fQlT16uoGcYYfxwFO/nkwyBGQzkZt7emShI2IRugcazyPCZDwkOA==", + "requires": { + "eventemitter3": "1.1.1", + "underscore": "1.8.3", + "web3-core-helpers": "1.0.0-beta.37" + } + }, + "web3-eth": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth/-/web3-eth-1.0.0-beta.37.tgz", + "integrity": "sha512-Eb3aGtkz3G9q+Z9DKgSQNbn/u8RtcZQQ0R4sW9hy5KK47GoT6vab5c6DiD3QWzI0BzitHzR5Ji+3VHf/hPUGgw==", + "requires": { + "underscore": "1.8.3", + "web3-core": "1.0.0-beta.37", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-core-subscriptions": "1.0.0-beta.37", + "web3-eth-abi": "1.0.0-beta.37", + "web3-eth-accounts": "1.0.0-beta.37", + "web3-eth-contract": "1.0.0-beta.37", + "web3-eth-ens": "1.0.0-beta.37", + "web3-eth-iban": "1.0.0-beta.37", + "web3-eth-personal": "1.0.0-beta.37", + "web3-net": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-abi": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-abi/-/web3-eth-abi-1.0.0-beta.37.tgz", + "integrity": "sha512-g9DKZGM2OqwKp/tX3W/yihcj7mQCtJ6CXyZXEIZfuDyRBED/iSEIFfieDOd+yo16sokLMig6FG7ADhhu+19hdA==", + "requires": { + "ethers": "4.0.0-beta.1", + "underscore": "1.8.3", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-accounts": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-accounts/-/web3-eth-accounts-1.0.0-beta.37.tgz", + "integrity": "sha512-uvbHL62/zwo4GDmwKdqH9c/EgYd8QVnAfpVw8D3epSISpgbONNY7Hr4MRMSd/CqAP12l2Ls9JVQGLhhC83bW6g==", + "requires": { + "any-promise": "1.3.0", + "crypto-browserify": "3.12.0", + "eth-lib": "0.2.7", + "scrypt.js": "0.2.0", + "underscore": "1.8.3", + "uuid": "2.0.1", + "web3-core": "1.0.0-beta.37", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + }, + "dependencies": { + "elliptic": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.1.tgz", + "integrity": "sha512-BsXLz5sqX8OHcsh7CqBMztyXARmGQ3LWPtGjJi6DiJHq5C/qvi9P3OqgswKSDftbu8+IoI/QDTAm2fFnQ9SZSQ==", + "requires": { + "bn.js": "^4.4.0", + "brorand": "^1.0.1", + "hash.js": "^1.0.0", + "hmac-drbg": "^1.0.0", + "inherits": "^2.0.1", + "minimalistic-assert": "^1.0.0", + "minimalistic-crypto-utils": "^1.0.0" + } + }, + "eth-lib": { + "version": "0.2.7", + "resolved": "https://registry.npmjs.org/eth-lib/-/eth-lib-0.2.7.tgz", + "integrity": "sha1-L5Pxex4jrsN1nNSj/iDBKGo/wco=", + "requires": { + "bn.js": "^4.11.6", + "elliptic": "^6.4.0", + "xhr-request-promise": "^0.1.2" + } + }, + "uuid": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.1.tgz", + "integrity": "sha1-wqMN7bPlNdcsz4LjQ5QaULqFM6w=" + } + } + }, + "web3-eth-contract": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-contract/-/web3-eth-contract-1.0.0-beta.37.tgz", + "integrity": "sha512-h1B3A8Z/C7BlnTCHkrWbXZQTViDxfR12lKMeTkT8Sqj5phFmxrBlPE4ORy4lf1Dk5b23mZYE0r/IRACx4ThCrQ==", + "requires": { + "underscore": "1.8.3", + "web3-core": "1.0.0-beta.37", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-core-promievent": "1.0.0-beta.37", + "web3-core-subscriptions": "1.0.0-beta.37", + "web3-eth-abi": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-ens": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-ens/-/web3-eth-ens-1.0.0-beta.37.tgz", + "integrity": "sha512-dR3UkrVzdRrJhfP57xBPx0CMiVnCcYFvh+u2XMkGydrhHgupSUkjqGr89xry/j1T0BkuN9mikpbyhdCVMXqMbg==", + "requires": { + "eth-ens-namehash": "2.0.8", + "underscore": "1.8.3", + "web3-core": "1.0.0-beta.37", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-promievent": "1.0.0-beta.37", + "web3-eth-abi": "1.0.0-beta.37", + "web3-eth-contract": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-iban": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-iban/-/web3-eth-iban-1.0.0-beta.37.tgz", + "integrity": "sha512-WQRniGJFxH/XCbd7miO6+jnUG+6bvuzfeufPIiOtCbeIC1ypp1kSqER8YVBDrTyinU1xnf1U5v0KBZ2yiWBJxQ==", + "requires": { + "bn.js": "4.11.6", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-personal": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-personal/-/web3-eth-personal-1.0.0-beta.37.tgz", + "integrity": "sha512-B4dZpGbD+nGnn48i6nJBqrQ+HB7oDmd+Q3wGRKOsHSK5HRWO/KwYeA7wgwamMAElkut50lIsT9EJl4Apfk3G5Q==", + "requires": { + "web3-core": "1.0.0-beta.37", + "web3-core-helpers": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-net": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-net": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-net/-/web3-net-1.0.0-beta.37.tgz", + "integrity": "sha512-xG/uBtMdDa1UMXw9KjDUgf3fXA/fDEJUYUS0TDn+U9PMgngA+UVECHNNvQTrVVDxEky38V3sahwIDiopNsQdsw==", + "requires": { + "web3-core": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-shh": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-shh/-/web3-shh-1.0.0-beta.37.tgz", + "integrity": "sha512-h5STG/xqZNQWtCLYOu7NiMqwqPea8SfkKQUPUFxXKIPVCFVKpHuQEwW1qcPQRJMLhlQIv17xuoUe1A+RzDNbrw==", + "requires": { + "web3-core": "1.0.0-beta.37", + "web3-core-method": "1.0.0-beta.37", + "web3-core-subscriptions": "1.0.0-beta.37", + "web3-net": "1.0.0-beta.37" + } + }, + "web3-utils": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-utils/-/web3-utils-1.0.0-beta.37.tgz", + "integrity": "sha512-kA1fyhO8nKgU21wi30oJQ/ssvu+9srMdjOTKbHYbQe4ATPcr5YNwwrxG3Bcpbu1bEwRUVKHCkqi+wTvcAWBdlQ==", + "requires": { + "bn.js": "4.11.6", + "eth-lib": "0.1.27", + "ethjs-unit": "0.1.6", + "number-to-bn": "1.7.0", + "randomhex": "0.1.5", + "underscore": "1.8.3", + "utf8": "2.1.1" + } + } } }, "@oceanprotocol/typographies": { @@ -4800,15 +5139,6 @@ "version": "3.9.0", "resolved": "https://registry.npmjs.org/file-type/-/file-type-3.9.0.tgz", "integrity": "sha1-JXoHg4TR24CHvESdEH1SpSZyuek=" - }, - "get-stream": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-2.3.1.tgz", - "integrity": "sha1-Xzj5PzRgCWZu4BUKBUFn+Rvdld4=", - "requires": { - "object-assign": "^4.0.1", - "pinkie-promise": "^2.0.0" - } } } }, @@ -5871,6 +6201,10 @@ "xhr-request-promise": "^0.1.2" } }, + "ethereum-blockies": { + "version": "github:MyEtherWallet/blockies#d36f87e50149aacafb34f099fe0bea1df76e010c", + "from": "github:MyEtherWallet/blockies" + }, "ethereumjs-util": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/ethereumjs-util/-/ethereumjs-util-6.1.0.tgz", @@ -6655,6 +6989,25 @@ "fs-extra": "^2.0.0", "mz": "^2.6.0", "thenify-all": "^1.6.0" + }, + "dependencies": { + "fs-extra": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-2.1.2.tgz", + "integrity": "sha1-BGxwFjzvmq1GsOSn+kZ/si1x3jU=", + "requires": { + "graceful-fs": "^4.1.2", + "jsonfile": "^2.1.0" + } + }, + "jsonfile": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz", + "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=", + "requires": { + "graceful-fs": "^4.1.6" + } + } } }, "fs-write-stream-atomic": { @@ -6747,9 +7100,13 @@ "dev": true }, "get-stream": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz", - "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=" + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-2.3.1.tgz", + "integrity": "sha1-Xzj5PzRgCWZu4BUKBUFn+Rvdld4=", + "requires": { + "object-assign": "^4.0.1", + "pinkie-promise": "^2.0.0" + } }, "get-value": { "version": "2.0.6", @@ -6913,6 +7270,13 @@ "timed-out": "^4.0.0", "url-parse-lax": "^1.0.0", "url-to-options": "^1.0.1" + }, + "dependencies": { + "get-stream": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz", + "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ=" + } } }, "graceful-fs": { @@ -9991,35 +10355,17 @@ "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=", "dev": true }, - "lodash.assign": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz", - "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=", - "dev": true - }, "lodash.camelcase": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz", "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY=" }, - "lodash.clonedeep": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz", - "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=", - "dev": true - }, "lodash.memoize": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz", "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=", "dev": true }, - "lodash.mergewith": { - "version": "4.6.1", - "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz", - "integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ==", - "dev": true - }, "lodash.sortby": { "version": "4.7.0", "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz", @@ -10767,9 +11113,9 @@ } }, "node-sass": { - "version": "4.11.0", - "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.11.0.tgz", - "integrity": "sha512-bHUdHTphgQJZaF1LASx0kAviPH7sGlcyNhWade4eVIpFp6tsn7SV8xNMTbsQFpEV9VXpnwTTnNYlfsZXgGgmkA==", + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.12.0.tgz", + "integrity": "sha512-A1Iv4oN+Iel6EPv77/HddXErL2a+gZ4uBeZUy+a8O35CFYTXhgA8MgLCWBtwpGZdCvTvQ9d+bQxX/QC36GDPpQ==", "dev": true, "requires": { "async-foreach": "^0.1.3", @@ -10779,12 +11125,10 @@ "get-stdin": "^4.0.1", "glob": "^7.0.3", "in-publish": "^2.0.0", - "lodash.assign": "^4.2.0", - "lodash.clonedeep": "^4.3.2", - "lodash.mergewith": "^4.6.0", + "lodash": "^4.17.11", "meow": "^3.7.0", "mkdirp": "^0.5.1", - "nan": "^2.10.0", + "nan": "^2.13.2", "node-gyp": "^3.8.0", "npmlog": "^4.0.0", "request": "^2.88.0", @@ -16093,6 +16437,13 @@ "requires": { "any-promise": "1.3.0", "eventemitter3": "1.1.1" + }, + "dependencies": { + "eventemitter3": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.1.1.tgz", + "integrity": "sha1-R3hr2qCHyvext15zq8XH1UAVjNA=" + } } }, "web3-core-requestmanager": { @@ -16105,6 +16456,46 @@ "web3-providers-http": "1.0.0-beta.37", "web3-providers-ipc": "1.0.0-beta.37", "web3-providers-ws": "1.0.0-beta.37" + }, + "dependencies": { + "bn.js": { + "version": "4.11.6", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz", + "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU=" + }, + "web3-core-helpers": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-helpers/-/web3-core-helpers-1.0.0-beta.37.tgz", + "integrity": "sha512-efaLOzN28RMnbugnyelgLwPWWaSwElQzcAJ/x3PZu+uPloM/lE5x0YuBKvIh7/PoSMlHqtRWj1B8CpuQOUQ5Ew==", + "requires": { + "underscore": "1.8.3", + "web3-eth-iban": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-iban": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-iban/-/web3-eth-iban-1.0.0-beta.37.tgz", + "integrity": "sha512-WQRniGJFxH/XCbd7miO6+jnUG+6bvuzfeufPIiOtCbeIC1ypp1kSqER8YVBDrTyinU1xnf1U5v0KBZ2yiWBJxQ==", + "requires": { + "bn.js": "4.11.6", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-utils": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-utils/-/web3-utils-1.0.0-beta.37.tgz", + "integrity": "sha512-kA1fyhO8nKgU21wi30oJQ/ssvu+9srMdjOTKbHYbQe4ATPcr5YNwwrxG3Bcpbu1bEwRUVKHCkqi+wTvcAWBdlQ==", + "requires": { + "bn.js": "4.11.6", + "eth-lib": "0.1.27", + "ethjs-unit": "0.1.6", + "number-to-bn": "1.7.0", + "randomhex": "0.1.5", + "underscore": "1.8.3", + "utf8": "2.1.1" + } + } } }, "web3-core-subscriptions": { @@ -16256,6 +16647,46 @@ "requires": { "web3-core-helpers": "1.0.0-beta.37", "xhr2-cookies": "1.1.0" + }, + "dependencies": { + "bn.js": { + "version": "4.11.6", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz", + "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU=" + }, + "web3-core-helpers": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-helpers/-/web3-core-helpers-1.0.0-beta.37.tgz", + "integrity": "sha512-efaLOzN28RMnbugnyelgLwPWWaSwElQzcAJ/x3PZu+uPloM/lE5x0YuBKvIh7/PoSMlHqtRWj1B8CpuQOUQ5Ew==", + "requires": { + "underscore": "1.8.3", + "web3-eth-iban": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-iban": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-iban/-/web3-eth-iban-1.0.0-beta.37.tgz", + "integrity": "sha512-WQRniGJFxH/XCbd7miO6+jnUG+6bvuzfeufPIiOtCbeIC1ypp1kSqER8YVBDrTyinU1xnf1U5v0KBZ2yiWBJxQ==", + "requires": { + "bn.js": "4.11.6", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-utils": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-utils/-/web3-utils-1.0.0-beta.37.tgz", + "integrity": "sha512-kA1fyhO8nKgU21wi30oJQ/ssvu+9srMdjOTKbHYbQe4ATPcr5YNwwrxG3Bcpbu1bEwRUVKHCkqi+wTvcAWBdlQ==", + "requires": { + "bn.js": "4.11.6", + "eth-lib": "0.1.27", + "ethjs-unit": "0.1.6", + "number-to-bn": "1.7.0", + "randomhex": "0.1.5", + "underscore": "1.8.3", + "utf8": "2.1.1" + } + } } }, "web3-providers-ipc": { @@ -16266,6 +16697,46 @@ "oboe": "2.1.3", "underscore": "1.8.3", "web3-core-helpers": "1.0.0-beta.37" + }, + "dependencies": { + "bn.js": { + "version": "4.11.6", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz", + "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU=" + }, + "web3-core-helpers": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-helpers/-/web3-core-helpers-1.0.0-beta.37.tgz", + "integrity": "sha512-efaLOzN28RMnbugnyelgLwPWWaSwElQzcAJ/x3PZu+uPloM/lE5x0YuBKvIh7/PoSMlHqtRWj1B8CpuQOUQ5Ew==", + "requires": { + "underscore": "1.8.3", + "web3-eth-iban": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-iban": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-iban/-/web3-eth-iban-1.0.0-beta.37.tgz", + "integrity": "sha512-WQRniGJFxH/XCbd7miO6+jnUG+6bvuzfeufPIiOtCbeIC1ypp1kSqER8YVBDrTyinU1xnf1U5v0KBZ2yiWBJxQ==", + "requires": { + "bn.js": "4.11.6", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-utils": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-utils/-/web3-utils-1.0.0-beta.37.tgz", + "integrity": "sha512-kA1fyhO8nKgU21wi30oJQ/ssvu+9srMdjOTKbHYbQe4ATPcr5YNwwrxG3Bcpbu1bEwRUVKHCkqi+wTvcAWBdlQ==", + "requires": { + "bn.js": "4.11.6", + "eth-lib": "0.1.27", + "ethjs-unit": "0.1.6", + "number-to-bn": "1.7.0", + "randomhex": "0.1.5", + "underscore": "1.8.3", + "utf8": "2.1.1" + } + } } }, "web3-providers-ws": { @@ -16276,6 +16747,56 @@ "underscore": "1.8.3", "web3-core-helpers": "1.0.0-beta.37", "websocket": "git://github.com/frozeman/WebSocket-Node.git#browserifyCompatible" + }, + "dependencies": { + "bn.js": { + "version": "4.11.6", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz", + "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU=" + }, + "web3-core-helpers": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-core-helpers/-/web3-core-helpers-1.0.0-beta.37.tgz", + "integrity": "sha512-efaLOzN28RMnbugnyelgLwPWWaSwElQzcAJ/x3PZu+uPloM/lE5x0YuBKvIh7/PoSMlHqtRWj1B8CpuQOUQ5Ew==", + "requires": { + "underscore": "1.8.3", + "web3-eth-iban": "1.0.0-beta.37", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-eth-iban": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-eth-iban/-/web3-eth-iban-1.0.0-beta.37.tgz", + "integrity": "sha512-WQRniGJFxH/XCbd7miO6+jnUG+6bvuzfeufPIiOtCbeIC1ypp1kSqER8YVBDrTyinU1xnf1U5v0KBZ2yiWBJxQ==", + "requires": { + "bn.js": "4.11.6", + "web3-utils": "1.0.0-beta.37" + } + }, + "web3-utils": { + "version": "1.0.0-beta.37", + "resolved": "https://registry.npmjs.org/web3-utils/-/web3-utils-1.0.0-beta.37.tgz", + "integrity": "sha512-kA1fyhO8nKgU21wi30oJQ/ssvu+9srMdjOTKbHYbQe4ATPcr5YNwwrxG3Bcpbu1bEwRUVKHCkqi+wTvcAWBdlQ==", + "requires": { + "bn.js": "4.11.6", + "eth-lib": "0.1.27", + "ethjs-unit": "0.1.6", + "number-to-bn": "1.7.0", + "randomhex": "0.1.5", + "underscore": "1.8.3", + "utf8": "2.1.1" + } + }, + "websocket": { + "version": "git://github.com/frozeman/WebSocket-Node.git#6c72925e3f8aaaea8dc8450f97627e85263999f2", + "from": "git://github.com/frozeman/WebSocket-Node.git#browserifyCompatible", + "requires": { + "debug": "^2.2.0", + "nan": "^2.3.3", + "typedarray-to-buffer": "^3.1.2", + "yaeti": "^0.0.6" + } + } } }, "web3-shh": { @@ -16624,16 +17145,6 @@ "source-map": "~0.6.1" } }, - "websocket": { - "version": "git://github.com/frozeman/WebSocket-Node.git#6c72925e3f8aaaea8dc8450f97627e85263999f2", - "from": "git://github.com/frozeman/WebSocket-Node.git#browserifyCompatible", - "requires": { - "debug": "^2.2.0", - "nan": "^2.3.3", - "typedarray-to-buffer": "^3.1.2", - "yaeti": "^0.0.6" - } - }, "websocket-driver": { "version": "0.7.0", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz", diff --git a/client/package.json b/client/package.json index 0c5d0dc..46acbb7 100644 --- a/client/package.json +++ b/client/package.json @@ -15,6 +15,7 @@ "@oceanprotocol/squid": "^0.5.7", "@oceanprotocol/typographies": "^0.1.0", "classnames": "^2.2.6", + "ethereum-blockies": "MyEtherWallet/blockies", "filesize": "^4.1.2", "history": "^4.9.0", "is-url": "^1.2.4", @@ -50,7 +51,7 @@ "@types/react-transition-group": "^2.8.0", "@types/web3": "^1.0.18", "jest-dom": "^3.1.3", - "node-sass": "^4.11.0", + "node-sass": "^4.12.0", "react-scripts": "^3.0.0", "react-testing-library": "^6.1.2", "typescript": "^3.4.3" diff --git a/client/src/@types/ethereum-blockies/index.d.ts b/client/src/@types/ethereum-blockies/index.d.ts new file mode 100644 index 0000000..6180f3a --- /dev/null +++ b/client/src/@types/ethereum-blockies/index.d.ts @@ -0,0 +1,5 @@ +/// + +declare module 'ethereum-blockies' { + export function toDataUrl(address: string): string +} diff --git a/client/src/components/atoms/Account.module.scss b/client/src/components/atoms/Account.module.scss new file mode 100644 index 0000000..f658d5d --- /dev/null +++ b/client/src/components/atoms/Account.module.scss @@ -0,0 +1,24 @@ +@import '../../styles/variables'; + +.account { + display: flex; + align-items: center; + text-align: left; + + > div { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + font-family: $font-family-monospace; + font-size: $font-size-small; + } +} + +.blockies { + width: 1.5rem; + height: 1.5rem; + border-radius: 50%; + display: inline-block; + margin-right: $spacer / 3; + margin-left: 0; +} diff --git a/client/src/components/atoms/Account.tsx b/client/src/components/atoms/Account.tsx new file mode 100644 index 0000000..0ff8cd3 --- /dev/null +++ b/client/src/components/atoms/Account.tsx @@ -0,0 +1,19 @@ +import React from 'react' +import Dotdotdot from 'react-dotdotdot' +import { toDataUrl } from 'ethereum-blockies' +import styles from './Account.module.scss' + +const Account = ({ account }: { account: string }) => { + const blockies = toDataUrl(account) + + return account && blockies ? ( +
+ Blockies + {account} +
+ ) : ( + No account selected + ) +} + +export default Account diff --git a/client/src/components/molecules/AccountStatus/Popover.module.scss b/client/src/components/molecules/AccountStatus/Popover.module.scss index 7cd0a34..5972204 100644 --- a/client/src/components/molecules/AccountStatus/Popover.module.scss +++ b/client/src/components/molecules/AccountStatus/Popover.module.scss @@ -45,14 +45,6 @@ $popoverWidth: 18rem; } } -.address { - display: block; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - font-family: $font-family-monospace; -} - .balance { font-size: $font-size-small; margin-left: $spacer / 2; diff --git a/client/src/components/molecules/AccountStatus/Popover.tsx b/client/src/components/molecules/AccountStatus/Popover.tsx index 5ae2041..040a744 100644 --- a/client/src/components/molecules/AccountStatus/Popover.tsx +++ b/client/src/components/molecules/AccountStatus/Popover.tsx @@ -1,5 +1,5 @@ import React, { PureComponent } from 'react' -import Dotdotdot from 'react-dotdotdot' +import Account from '../../atoms/Account' import { User } from '../../../context' import styles from './Popover.module.scss' @@ -15,23 +15,6 @@ export default class Popover extends PureComponent<{ ref={this.props.forwardedRef} style={this.props.style} > - {account && balance && ( -
- - - {(balance.eth / 1e18).toFixed(3).slice(0, -1)} - {' '} - ETH - - - {balance.ocn} OCEAN - -
- )} - {!isWeb3 ? (
No Web3 detected. Use a browser with MetaMask installed @@ -40,16 +23,28 @@ export default class Popover extends PureComponent<{ ) : ( <>
- {account ? ( - - - {account} - - - ) : ( - No account selected - )} +
+ + {account && balance && ( +
+ + + {(balance.eth / 1e18) + .toFixed(3) + .slice(0, -1)} + {' '} + ETH + + + {balance.ocn} OCEAN + +
+ )} +
{network && !isNile ? 'Please connect to Custom RPC\n https://nile.dev-ocean.com' diff --git a/client/src/components/organisms/Web3message.module.scss b/client/src/components/organisms/Web3message.module.scss index 2abcc23..5a86272 100644 --- a/client/src/components/organisms/Web3message.module.scss +++ b/client/src/components/organisms/Web3message.module.scss @@ -3,27 +3,20 @@ .message { margin-bottom: $spacer; color: $brand-grey; - padding-left: 2rem; position: relative; border-bottom: .1rem solid $brand-grey-lighter; border-top: .1rem solid $brand-grey-lighter; padding-top: $spacer / 2; padding-bottom: $spacer / 2; text-align: left; - - > div { - display: inline-block; - } } -.account { - display: inline-block; - margin-left: $spacer / 8; - background: none; +.warnings { + padding-left: $spacer; } .status { margin-left: -($spacer); - margin-right: $spacer / 3; + margin-right: $spacer / 2; padding: 0; } diff --git a/client/src/components/organisms/Web3message.tsx b/client/src/components/organisms/Web3message.tsx index bc93c57..6657ab3 100644 --- a/client/src/components/organisms/Web3message.tsx +++ b/client/src/components/organisms/Web3message.tsx @@ -1,5 +1,5 @@ import React, { PureComponent } from 'react' -import Dotdotdot from 'react-dotdotdot' +import Account from '../atoms/Account' import Button from '../atoms/Button' import AccountStatus from '../molecules/AccountStatus' import styles from './Web3message.module.scss' @@ -13,21 +13,18 @@ export default class Web3message extends PureComponent { unlockAccounts?: () => any ) => (
- {' '} {account ? ( - - {message} - {account} - + ) : ( - <> +
+ {' '} {unlockAccounts && ( )} - +
)}
) From 5e8ed026d556e98471fb9e0fbb5b680955e0dc8a Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 12:21:43 +0200 Subject: [PATCH 08/18] report test coverage to Codacy --- .travis.yml | 5 +++++ client/package.json | 3 ++- scripts/coverage.sh | 12 ++++++++++++ scripts/install.sh | 2 +- server/package.json | 3 ++- 5 files changed, 22 insertions(+), 3 deletions(-) create mode 100755 scripts/coverage.sh diff --git a/.travis.yml b/.travis.yml index 4235e2b..e7e65dc 100644 --- a/.travis.yml +++ b/.travis.yml @@ -3,9 +3,14 @@ language: node_js node_js: - '11' +before_install: + - npm install -g npm + - npm install -g codacy-coverage + script: # - ./scripts/install.sh # runs automatically with npm ci - ./scripts/test.sh + - ./scripts/coverage.sh - ./scripts/build.sh notifications: diff --git a/client/package.json b/client/package.json index 0c5d0dc..405093b 100644 --- a/client/package.json +++ b/client/package.json @@ -8,7 +8,8 @@ "build": "react-scripts --max_old_space_size=4096 build", "test": "react-scripts test --coverage", "test:watch": "react-scripts test --coverage --watch", - "eject": "react-scripts eject" + "eject": "react-scripts eject", + "coverage": "cat coverage/lcov.info | codacy-coverage --token 8801f827fe1144ffa85cd7da94f2bbf7" }, "dependencies": { "@oceanprotocol/art": "^2.2.0", diff --git a/scripts/coverage.sh b/scripts/coverage.sh new file mode 100755 index 0000000..2d0de92 --- /dev/null +++ b/scripts/coverage.sh @@ -0,0 +1,12 @@ +#/usr/bin/env/sh +set -e + +components="server client" + +for component in $components +do + printf "\n\nReporting coverage: $component\n" + cd $component + npm run coverage + cd .. +done diff --git a/scripts/install.sh b/scripts/install.sh index 34b2077..3d1c539 100755 --- a/scripts/install.sh +++ b/scripts/install.sh @@ -5,7 +5,7 @@ components="server client" for component in $components do - echo "\n\nInstalling dependencies: $component\n" + printf "\n\nInstalling dependencies: $component\n" cd $component npm install cd .. diff --git a/server/package.json b/server/package.json index 516639a..3ba4362 100644 --- a/server/package.json +++ b/server/package.json @@ -9,7 +9,8 @@ "serve": "node dist/server.js", "build": "tsc", "test": "jest --coverage", - "test:watch": "jest --coverage --watch" + "test:watch": "jest --coverage --watch", + "coverage": "cat coverage/lcov.info | codacy-coverage --token 8801f827fe1144ffa85cd7da94f2bbf7" }, "dependencies": { "body-parser": "^1.18.3", From 2e7ed31e2e3e40db748968a1f2d7fcd0c0d6a00d Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 13:37:25 +0200 Subject: [PATCH 09/18] add codacy badges --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 12122f7..d401af6 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,8 @@ > https://commons.oceanprotocol.com [![Build Status](https://travis-ci.com/oceanprotocol/commons.svg?branch=master)](https://travis-ci.com/oceanprotocol/commons) +[![Codacy Badge](https: //api.codacy.com/project/badge/Grade/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) +[![Codacy Badge](https: //api.codacy.com/project/badge/Coverage/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-7b1173.svg?style=flat-square)](https://github.com/prettier/prettier) [![js oceanprotocol](https://img.shields.io/badge/js-oceanprotocol-7b1173.svg)](https://github.com/oceanprotocol/eslint-config-oceanprotocol) [![css bigchaindb](https://img.shields.io/badge/css-bigchaindb-39BA91.svg)](https://github.com/bigchaindb/stylelint-config-bigchaindb) From a8969bb70c0f206ea38c969d3b22706d8a9af29d Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 18:36:51 +0200 Subject: [PATCH 10/18] hotfix for search input --- client/src/routes/Home.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/client/src/routes/Home.tsx b/client/src/routes/Home.tsx index 8eb4ad5..ce70175 100644 --- a/client/src/routes/Home.tsx +++ b/client/src/routes/Home.tsx @@ -54,9 +54,7 @@ class Home extends Component { private searchAssets = (event: FormEvent) => { event.preventDefault() - this.props.history.push( - `/search?text=${JSON.stringify(this.state.search)}` - ) + this.props.history.push(`/search?text=${this.state.search}`) } } From 269acdfc8fc106090232b0fa9716d04c7e195062 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 18:45:41 +0200 Subject: [PATCH 11/18] Release 0.2.6 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6648864..e6070f2 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "commons", "description": "Ocean Protocol marketplace to explore, download, and publish open data sets.", - "version": "0.2.5", + "version": "0.2.6", "license": "Apache-2.0", "scripts": { "install": "./scripts/install.sh", From 30d6679eb2ae1cb40f8deb053b49d5a6fb71f089 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 18:46:02 +0200 Subject: [PATCH 12/18] update changelog --- CHANGELOG.md | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d3181da..1cb1493 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,12 +4,32 @@ All notable changes to this project will be documented in this file. Dates are d Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). +#### [v0.2.6](https://github.com/oceanprotocol/commons/compare/v0.2.5...v0.2.6) + +> 30 April 2019 + +- add blockies for account display [`#115`](https://github.com/oceanprotocol/commons/pull/115) +- Setup coverage reporting [`#116`](https://github.com/oceanprotocol/commons/pull/116) +- report test coverage to Codacy [`5e8ed02`](https://github.com/oceanprotocol/commons/commit/5e8ed026d556e98471fb9e0fbb5b680955e0dc8a) +- hotfix for search input [`a8969bb`](https://github.com/oceanprotocol/commons/commit/a8969bb70c0f206ea38c969d3b22706d8a9af29d) +- Release 0.2.6 [`269acdf`](https://github.com/oceanprotocol/commons/commit/269acdfc8fc106090232b0fa9716d04c7e195062) + +#### [v0.2.5](https://github.com/oceanprotocol/commons/compare/v0.2.4...v0.2.5) + +> 29 April 2019 + +- sanitize search input [`#114`](https://github.com/oceanprotocol/commons/pull/114) +- update telegram link [`#113`](https://github.com/oceanprotocol/commons/pull/113) +- update changelog [`0d3afc8`](https://github.com/oceanprotocol/commons/commit/0d3afc821900fada63013fc8aec434a634c67199) +- Release 0.2.5 [`8290609`](https://github.com/oceanprotocol/commons/commit/82906093e60f4b52302b6f08f19787f65b24fafd) + #### [v0.2.4](https://github.com/oceanprotocol/commons/compare/v0.2.3...v0.2.4) > 29 April 2019 - fix search titles [`#112`](https://github.com/oceanprotocol/commons/pull/112) - Release 0.2.4 [`8f832b6`](https://github.com/oceanprotocol/commons/commit/8f832b63220a46a8de0061ffc2498186e2099315) +- update telegram link [`e6806f4`](https://github.com/oceanprotocol/commons/commit/e6806f467d6e2299bc0886eba53d0646dfa4df31) #### [v0.2.3](https://github.com/oceanprotocol/commons/compare/v0.2.2...v0.2.3) From 08143be524b143e539c9948ba977986964966bfc Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 19:24:50 +0200 Subject: [PATCH 13/18] fix badges --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index d401af6..7857071 100644 --- a/README.md +++ b/README.md @@ -6,8 +6,8 @@ > https://commons.oceanprotocol.com [![Build Status](https://travis-ci.com/oceanprotocol/commons.svg?branch=master)](https://travis-ci.com/oceanprotocol/commons) -[![Codacy Badge](https: //api.codacy.com/project/badge/Grade/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) -[![Codacy Badge](https: //api.codacy.com/project/badge/Coverage/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) +[![Codacy Badge](https://api.codacy.com/project/badge/Grade/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) +[![Codacy Badge](https://api.codacy.com/project/badge/Coverage/6a19987e62344b1c9c1d5bc9f315c733)](https://www.codacy.com/app/ocean-protocol/commons) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-7b1173.svg?style=flat-square)](https://github.com/prettier/prettier) [![js oceanprotocol](https://img.shields.io/badge/js-oceanprotocol-7b1173.svg)](https://github.com/oceanprotocol/eslint-config-oceanprotocol) [![css bigchaindb](https://img.shields.io/badge/css-bigchaindb-39BA91.svg)](https://github.com/bigchaindb/stylelint-config-bigchaindb) From 9bdfca4be4bc4568035f5335ea997413c699d22a Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Tue, 30 Apr 2019 19:19:28 +0200 Subject: [PATCH 14/18] more tests --- client/__mocks__/user-mock.ts | 31 + client/package-lock.json | 108 +- client/package.json | 43 +- client/src/App.test.tsx | 15 + client/src/App.tsx | 45 +- client/src/Routes.test.tsx | 15 + client/src/components/atoms/Account.test.tsx | 28 + client/src/components/atoms/Account.tsx | 2 +- .../components/atoms/CategoryImage.test.tsx | 16 +- client/src/components/atoms/CategoryImage.tsx | 1 - .../src/components/atoms/Form/Form.test.tsx | 29 + .../src/components/atoms/Form/Input.test.tsx | 90 + client/src/components/atoms/Form/Input.tsx | 12 +- .../components/atoms/Form/InputGroup.test.tsx | 10 + .../src/components/atoms/Form/Label.test.tsx | 20 + client/src/components/atoms/Form/Row.test.tsx | 10 + client/src/components/atoms/Markdown.test.tsx | 10 + client/src/components/atoms/Markdown.tsx | 4 +- .../molecules/AccountStatus/Popover.test.tsx | 49 + .../molecules/AccountStatus/Popover.tsx | 1 + .../molecules/AccountStatus/index.test.tsx | 20 + .../molecules/AccountStatus/index.tsx | 2 +- .../components/molecules/Pagination.test.tsx | 2 +- client/src/components/organisms/Header.tsx | 32 +- .../components/organisms/Web3message.test.tsx | 59 +- .../src/components/templates/Route.test.tsx | 24 + client/src/context/UserProvider.tsx | 8 +- client/src/data/web3message.json | 2 +- client/src/hoc/withTracker.tsx | 2 +- client/src/index.test.tsx | 22 + client/src/index.tsx | 18 +- client/src/ocean.test.ts | 17 + client/src/ocean.ts | 2 +- client/src/routes/About.test.tsx | 10 + .../src/routes/Details/AssetDetails.test.tsx | 68 + client/src/routes/Details/AssetDetails.tsx | 31 +- client/src/routes/Details/AssetFile.test.tsx | 77 + client/src/routes/Details/AssetFile.tsx | 11 +- .../routes/Details/AssetFilesDetails.test.tsx | 43 + .../src/routes/Details/AssetFilesDetails.tsx | 17 +- client/src/routes/Details/index.test.tsx | 21 + client/src/routes/Details/index.tsx | 33 +- client/src/routes/Faucet.test.tsx | 43 + client/src/routes/Faucet.tsx | 2 +- client/src/routes/History.test.tsx | 38 + client/src/routes/Home.test.tsx | 10 + client/src/routes/Home.tsx | 3 +- client/src/routes/NotFound.test.tsx | 10 + client/src/routes/Publish/Files/Item.test.tsx | 39 + .../routes/Publish/Files/ItemForm.test.tsx | 63 + client/src/routes/Publish/Files/ItemForm.tsx | 8 +- .../src/routes/Publish/Files/index.test.tsx | 90 + client/src/routes/Publish/Files/index.tsx | 18 +- client/src/routes/Publish/Progress.test.tsx | 19 + client/src/routes/Publish/Step.test.tsx | 46 + .../Publish/StepRegisterContent.test.tsx | 76 + .../routes/Publish/StepRegisterContent.tsx | 7 +- client/src/routes/Publish/index.test.tsx | 11 + client/src/routes/Search.test.tsx | 51 + client/src/routes/Search.tsx | 27 +- client/src/routes/Styleguide.test.tsx | 10 + package-lock.json | 1688 ++--------------- package.json | 14 +- server/package-lock.json | 1106 +++++------ server/package.json | 9 +- server/src/routes/UrlCheckRouter.ts | 4 +- server/src/server.ts | 1 + server/test/api.test.ts | 20 +- 68 files changed, 2037 insertions(+), 2436 deletions(-) create mode 100644 client/__mocks__/user-mock.ts create mode 100644 client/src/Routes.test.tsx create mode 100644 client/src/components/atoms/Account.test.tsx create mode 100644 client/src/components/atoms/Form/Form.test.tsx create mode 100644 client/src/components/atoms/Form/Input.test.tsx create mode 100644 client/src/components/atoms/Form/InputGroup.test.tsx create mode 100644 client/src/components/atoms/Form/Label.test.tsx create mode 100644 client/src/components/atoms/Form/Row.test.tsx create mode 100644 client/src/components/atoms/Markdown.test.tsx create mode 100644 client/src/components/molecules/AccountStatus/Popover.test.tsx create mode 100644 client/src/components/molecules/AccountStatus/index.test.tsx create mode 100644 client/src/components/templates/Route.test.tsx create mode 100644 client/src/index.test.tsx create mode 100644 client/src/ocean.test.ts create mode 100644 client/src/routes/About.test.tsx create mode 100644 client/src/routes/Details/AssetDetails.test.tsx create mode 100644 client/src/routes/Details/AssetFile.test.tsx create mode 100644 client/src/routes/Details/AssetFilesDetails.test.tsx create mode 100644 client/src/routes/Details/index.test.tsx create mode 100644 client/src/routes/Faucet.test.tsx create mode 100644 client/src/routes/History.test.tsx create mode 100644 client/src/routes/Home.test.tsx create mode 100644 client/src/routes/NotFound.test.tsx create mode 100644 client/src/routes/Publish/Files/Item.test.tsx create mode 100644 client/src/routes/Publish/Files/ItemForm.test.tsx create mode 100644 client/src/routes/Publish/Files/index.test.tsx create mode 100644 client/src/routes/Publish/Progress.test.tsx create mode 100644 client/src/routes/Publish/Step.test.tsx create mode 100644 client/src/routes/Publish/StepRegisterContent.test.tsx create mode 100644 client/src/routes/Publish/index.test.tsx create mode 100644 client/src/routes/Search.test.tsx create mode 100644 client/src/routes/Styleguide.test.tsx diff --git a/client/__mocks__/user-mock.ts b/client/__mocks__/user-mock.ts new file mode 100644 index 0000000..1f4e32e --- /dev/null +++ b/client/__mocks__/user-mock.ts @@ -0,0 +1,31 @@ +const userMock = { + isLogged: false, + isLoading: false, + isWeb3: false, + isNile: false, + account: '', + web3: {}, + ocean: {}, + balance: { eth: 0, ocn: 0 }, + network: '', + requestFromFaucet: jest.fn(), + unlockAccounts: jest.fn(), + message: '' +} + +const userMockConnected = { + isLogged: true, + isLoading: false, + isWeb3: true, + isNile: true, + account: '0xxxxxx', + web3: {}, + ocean: {}, + balance: { eth: 0, ocn: 0 }, + network: '', + requestFromFaucet: jest.fn(), + unlockAccounts: jest.fn(), + message: '' +} + +export { userMock, userMockConnected } diff --git a/client/package-lock.json b/client/package-lock.json index a929be0..fc68d7b 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1242,14 +1242,14 @@ "integrity": "sha512-p2n505t2K0zD1ZvGPhI6EsSviEVLCB7BYowhf/ONmVaWED138PaG4Z9nY6YuHU383uOoIWT+Lq3dLkFzDzstXw==" }, "@oceanprotocol/keeper-contracts": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/@oceanprotocol/keeper-contracts/-/keeper-contracts-0.9.1.tgz", - "integrity": "sha512-c1LvaH+e1tzow0gZLwSWe19ap+DrZuNmZfxBdwEVEPQXarI0jTXa5qVDoiBow8kBWaqSIUgFAzQOJW8rKdlS1A==" + "version": "0.9.7", + "resolved": "https://registry.npmjs.org/@oceanprotocol/keeper-contracts/-/keeper-contracts-0.9.7.tgz", + "integrity": "sha512-nOpbSE/BG+tQBfLXZ/EqSOvUPzOuot84vHxjAfEU8K3v4eOnqFJVo+oyB7KlcF87wBJXDmi/Ir9qHY4c0Saipg==" }, "@oceanprotocol/squid": { - "version": "0.5.7", - "resolved": "https://registry.npmjs.org/@oceanprotocol/squid/-/squid-0.5.7.tgz", - "integrity": "sha512-q2rdlVT4n0IW8FcTrE9sfyl8lC0moAKJillUSfWadZHjdaVikBTS3iiPiKn8RIvfBL4j3RxlVHdGQdEl8rIDfA==", + "version": "0.5.8", + "resolved": "https://registry.npmjs.org/@oceanprotocol/squid/-/squid-0.5.8.tgz", + "integrity": "sha512-1hEOA5rF8qsLF6uSMVBAN4c6Licn2FCGdWLCHpZ6ePzyA2/3RXxhreUE/0mcTkmdITwlx1rCFFO+rYhDqgyPVQ==", "requires": { "@oceanprotocol/keeper-contracts": "^0.9.1", "bignumber.js": "^8.1.1", @@ -1606,6 +1606,16 @@ "resolved": "https://registry.npmjs.org/@oceanprotocol/typographies/-/typographies-0.1.0.tgz", "integrity": "sha512-kMsZsqvzpz9KzVbVZzllwhPoIC3zbqsdRrClagZL/C2PHzgLrKGC1kYn3gPt0RMIFg9ZjrwieKaxlgIK9i9zzg==" }, + "@react-mock/state": { + "version": "0.1.8", + "resolved": "https://registry.npmjs.org/@react-mock/state/-/state-0.1.8.tgz", + "integrity": "sha512-oX16w3FKhfF2+nQE+C4frrfVddzwhF4YEYxF8frXzboEDZsxCRpFuQC0za3T59ZxI4ygBarBqDrhYzipGsD9TQ==", + "dev": true, + "requires": { + "@babel/runtime": "^7.1.2", + "lodash": "^4.17.11" + } + }, "@sheerun/mutationobserver-shim": { "version": "0.3.2", "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz", @@ -1900,9 +1910,9 @@ "dev": true }, "@types/jest": { - "version": "24.0.11", - "resolved": "https://registry.npmjs.org/@types/jest/-/jest-24.0.11.tgz", - "integrity": "sha512-2kLuPC5FDnWIDvaJBzsGTBQaBbnDweznicvK7UGYzlIJP4RJR2a4A/ByLUXEyEgag6jz8eHdlWExGDtH3EYUXQ==", + "version": "24.0.12", + "resolved": "https://registry.npmjs.org/@types/jest/-/jest-24.0.12.tgz", + "integrity": "sha512-60sjqMhat7i7XntZckcSGV8iREJyXXI6yFHZkSZvCPUeOnEJ/VP1rU/WpEWQ56mvoh8NhC+sfKAuJRTyGtCOow==", "dev": true, "requires": { "@types/jest-diff": "*" @@ -1932,9 +1942,9 @@ "dev": true }, "@types/react": { - "version": "16.8.14", - "resolved": "https://registry.npmjs.org/@types/react/-/react-16.8.14.tgz", - "integrity": "sha512-26tFVJ1omGmzIdFTFmnC5zhz1GTaqCjxgUxV4KzWvsybF42P7/j4RBn6UeO3KbHPXqKWZszMXMoI65xIWm954A==", + "version": "16.8.15", + "resolved": "https://registry.npmjs.org/@types/react/-/react-16.8.15.tgz", + "integrity": "sha512-dMhzw1rWK+wwJWvPp5Pk12ksSrm/z/C/+lOQbMZ7YfDQYnJ02bc0wtg4EJD9qrFhuxFrf/ywNgwTboucobJqQg==", "dev": true, "requires": { "@types/prop-types": "*", @@ -2009,9 +2019,9 @@ } }, "@types/react-transition-group": { - "version": "2.9.0", - "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-2.9.0.tgz", - "integrity": "sha512-hP7vUaZMVSWKxo133P8U51U6UZ7+pbY+eAQb8+p6SZ2rB1rj3mOTDgTzhhi+R2SCB4S+sWekAAGoxdiZPG0ReQ==", + "version": "2.9.1", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-2.9.1.tgz", + "integrity": "sha512-1usq4DRUVBFnxc9KGJAlJO9EpQrLZGDDEC8wDOn2+2ODSyudYo8FiIzPDRaX/hfQjHqGeeoNaNdA2bj0l35hZQ==", "dev": true, "requires": { "@types/react": "*" @@ -5145,7 +5155,8 @@ "deep-equal": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz", - "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=" + "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=", + "dev": true }, "deep-is": { "version": "0.1.3", @@ -5439,15 +5450,15 @@ } }, "dom-testing-library": { - "version": "3.19.3", - "resolved": "https://registry.npmjs.org/dom-testing-library/-/dom-testing-library-3.19.3.tgz", - "integrity": "sha512-oiI+oq91iO/Vpp+pt8PqfqLfBK074FH0eprhoFNvBCvJOk7vL4ozbe/yj/kEEGR6kiT4F3MAam19AX1fdGFjrA==", + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/dom-testing-library/-/dom-testing-library-4.0.1.tgz", + "integrity": "sha512-Yr0yWlpI2QdTDEgPEk0TEekwP4VyZlJpl9E7nKP2FCKni44cb1jzjsy9KX6hBDsNA7EVlPpq9DHzO2eoEaqDZg==", "dev": true, "requires": { - "@babel/runtime": "^7.3.4", + "@babel/runtime": "^7.4.3", "@sheerun/mutationobserver-shim": "^0.3.2", - "pretty-format": "^24.5.0", - "wait-for-expect": "^1.1.0" + "pretty-format": "^24.7.0", + "wait-for-expect": "^1.1.1" } }, "dom-walk": { @@ -8810,9 +8821,9 @@ } }, "jest-dom": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/jest-dom/-/jest-dom-3.1.3.tgz", - "integrity": "sha512-V9LdySiA74/spcAKEG3FRMRKnisKlcYr3EeCNYI4n7CWNE7uYg5WoBUHeGXirjWjRYLLZ5vx8rUaR/6x6o75oQ==", + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/jest-dom/-/jest-dom-3.1.4.tgz", + "integrity": "sha512-ruIRHoRVnqPRt/HSS2aFukfhTpjEoq1I6PkYptKK5U2EeRm1eeOXG7BFiaMncTaGu4COSoCF84oLHj02+J5VDg==", "dev": true, "requires": { "chalk": "^2.4.1", @@ -10984,9 +10995,9 @@ } }, "node-fetch": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.3.0.tgz", - "integrity": "sha512-MOd8pV3fxENbryESLgVIeaGKrdl+uaYhCSSVkjeOb/31/njTpcis5aWfdqgNlHIrKOLRbMnfPINPOML2CIFeXA==" + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.5.0.tgz", + "integrity": "sha512-YuZKluhWGJwCcUu4RlZstdAxr8bFfOVHakc1mplwHkk8J+tqM1Y5yraYvIUpeX8aY7+crCwiELJq7Vl0o0LWXw==" }, "node-forge": { "version": "0.7.5", @@ -13049,9 +13060,9 @@ "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==" }, "query-string": { - "version": "6.4.2", - "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.4.2.tgz", - "integrity": "sha512-DfJqAen17LfLA3rQ+H5S4uXphrF+ANU1lT2ijds4V/Tj4gZxA3gx5/tg1bz7kYCmwna7LyJNCYqO7jNRzo3aLw==", + "version": "6.5.0", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.5.0.tgz", + "integrity": "sha512-TYC4hDjZSvVxLMEucDMySkuAS9UIzSbAiYGyA9GWCjLKB8fQpviFbjd20fD7uejCDxZS+ftSdBKE6DS+xucJFg==", "requires": { "decode-uri-component": "^0.2.0", "split-on-first": "^1.0.0", @@ -13178,9 +13189,9 @@ } }, "react-datepicker": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-2.4.0.tgz", - "integrity": "sha512-ZOY7oYmZt+jeSFGj4NHNdCg7WzzIljPui98lGRd7YHNPO3B8Re4WVNALktp/x+mz1ofNO+TPzodMLMXzqjAUnw==", + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-2.5.0.tgz", + "integrity": "sha512-X8D+5CqumSUwoq/x5d8O0neYDRmPmwVcyCktVbs5juXV4s73beV6sMf87hM6lxMSanWeB+jpx8waxJcPqsmCIg==", "requires": { "classnames": "^2.2.5", "date-fns": "^2.0.0-alpha.23", @@ -13359,19 +13370,24 @@ "integrity": "sha512-O9JRum1Zq/qCPFH5qVEvDDrVun8Jv9vbHtZXCR1EuRj9sKg1xJTlHxBzU6AkCzpvxRLuiY4OKImy3cDLQ+UTdg==", "dev": true }, + "react-fast-compare": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz", + "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==" + }, "react-ga": { "version": "2.5.7", "resolved": "https://registry.npmjs.org/react-ga/-/react-ga-2.5.7.tgz", "integrity": "sha512-UmATFaZpEQDO96KFjB5FRLcT6hFcwaxOmAJZnjrSiFN/msTqylq9G+z5Z8TYzN/dbamDTiWf92m6MnXXJkAivQ==" }, "react-helmet": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-5.2.0.tgz", - "integrity": "sha1-qBgR3yExOm1VxfBYxK66XW89l6c=", + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-5.2.1.tgz", + "integrity": "sha512-CnwD822LU8NDBnjCpZ4ySh8L6HYyngViTZLfBBb3NjtrpN8m49clH8hidHouq20I51Y6TpCTISCBbqiY5GamwA==", "requires": { - "deep-equal": "^1.0.1", "object-assign": "^4.1.1", "prop-types": "^15.5.4", + "react-fast-compare": "^2.0.2", "react-side-effect": "^1.1.0" } }, @@ -13568,13 +13584,13 @@ } }, "react-testing-library": { - "version": "6.1.2", - "resolved": "https://registry.npmjs.org/react-testing-library/-/react-testing-library-6.1.2.tgz", - "integrity": "sha512-z69lhRDGe7u/NOjDCeFRoe1cB5ckJ4656n0tj/Fdcr6OoBUu7q9DBw0ftR7v5i3GRpdSWelnvl+feZFOyXyxwg==", + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/react-testing-library/-/react-testing-library-7.0.0.tgz", + "integrity": "sha512-8SHqwG+uhN9VhAgNVkVa3f7VjTw/L5CIaoAxKmy+EZuDQ6O+VsfcpRAyUw3MDL1h8S/gGrEiazmHBVL/uXsftA==", "dev": true, "requires": { - "@babel/runtime": "^7.4.2", - "dom-testing-library": "^3.19.0" + "@babel/runtime": "^7.4.3", + "dom-testing-library": "^4.0.0" } }, "react-transition-group": { @@ -15826,9 +15842,9 @@ } }, "typescript": { - "version": "3.4.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.4.4.tgz", - "integrity": "sha512-xt5RsIRCEaf6+j9AyOBgvVuAec0i92rgCaS3S+UVf5Z/vF2Hvtsw08wtUTJqp4djwznoAgjSxeCcU4r+CcDBJA==", + "version": "3.4.5", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.4.5.tgz", + "integrity": "sha512-YycBxUb49UUhdNMU5aJ7z5Ej2XGmaIBL0x34vZ82fn3hGvD+bgrMrVDpatgz2f7YxUMJxMkbWxJZeAvDxVe7Vw==", "dev": true }, "ua-parser-js": { diff --git a/client/package.json b/client/package.json index c5f0def..6984755 100644 --- a/client/package.json +++ b/client/package.json @@ -6,14 +6,14 @@ "scripts": { "start": "react-scripts start", "build": "react-scripts --max_old_space_size=4096 build", - "test": "react-scripts test --coverage", - "test:watch": "react-scripts test --coverage --watch", + "test": "react-scripts test --coverage --watchAll=false", + "test:watch": "react-scripts test --coverage", "eject": "react-scripts eject", "coverage": "cat coverage/lcov.info | codacy-coverage --token 8801f827fe1144ffa85cd7da94f2bbf7" }, "dependencies": { "@oceanprotocol/art": "^2.2.0", - "@oceanprotocol/squid": "^0.5.7", + "@oceanprotocol/squid": "^0.5.8", "@oceanprotocol/typographies": "^0.1.0", "classnames": "^2.2.6", "ethereum-blockies": "MyEtherWallet/blockies", @@ -21,14 +21,14 @@ "history": "^4.9.0", "is-url": "^1.2.4", "moment": "^2.24.0", - "query-string": "^6.4.2", + "query-string": "^6.5.0", "react": "^16.8.6", - "react-datepicker": "^2.3.0", + "react-datepicker": "^2.5.0", "react-dom": "^16.8.6", - "react-dotdotdot": "^1.2.3", + "react-dotdotdot": "^1.3.0", "react-ga": "^2.5.7", - "react-helmet": "^5.2.0", - "react-markdown": "^4.0.6", + "react-helmet": "^5.2.1", + "react-markdown": "^4.0.8", "react-moment": "^0.9.2", "react-paginate": "^6.3.0", "react-popper": "^1.3.3", @@ -38,24 +38,25 @@ "web3": "1.0.0-beta.37" }, "devDependencies": { + "@react-mock/state": "^0.1.8", "@types/classnames": "^2.2.7", "@types/filesize": "^4.1.0", "@types/is-url": "^1.2.28", - "@types/jest": "^24.0.11", - "@types/react": "^16.8.13", - "@types/react-datepicker": "^2.2.1", - "@types/react-dom": "^16.8.3", + "@types/jest": "^24.0.12", + "@types/react": "^16.8.15", + "@types/react-datepicker": "^2.3.0", + "@types/react-dom": "^16.8.4", "@types/react-dotdotdot": "^1.2.0", "@types/react-helmet": "^5.0.8", "@types/react-paginate": "^6.2.1", - "@types/react-router-dom": "^4.3.1", - "@types/react-transition-group": "^2.8.0", + "@types/react-router-dom": "^4.3.2", + "@types/react-transition-group": "^2.9.1", "@types/web3": "^1.0.18", - "jest-dom": "^3.1.3", + "jest-dom": "^3.1.4", "node-sass": "^4.12.0", "react-scripts": "^3.0.0", - "react-testing-library": "^6.1.2", - "typescript": "^3.4.3" + "react-testing-library": "^7.0.0", + "typescript": "^3.4.5" }, "repository": { "type": "git", @@ -66,5 +67,11 @@ "not dead", "not ie <= 11", "not op_mini all" - ] + ], + "jest": { + "collectCoverageFrom": [ + "src/**/*.{ts,tsx}", + "!src/serviceWorker.ts" + ] + } } diff --git a/client/src/App.test.tsx b/client/src/App.test.tsx index fa6de58..8c85a79 100644 --- a/client/src/App.test.tsx +++ b/client/src/App.test.tsx @@ -1,10 +1,25 @@ import React from 'react' import { render } from 'react-testing-library' import App from './App' +import { User } from './context' +import { userMock } from '../__mocks__/user-mock' describe('App', () => { + it('should be able to run tests', () => { + expect(1 + 2).toEqual(3) + }) + it('renders without crashing', () => { const { container } = render() expect(container.firstChild).toBeInTheDocument() }) + + it('renders loading state', () => { + const { container } = render( + + + + ) + expect(container.querySelector('.spinner')).toBeInTheDocument() + }) }) diff --git a/client/src/App.tsx b/client/src/App.tsx index bddc57f..6fb1692 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -4,7 +4,6 @@ import Header from './components/organisms/Header' import Footer from './components/organisms/Footer' import Spinner from './components/atoms/Spinner' import { User } from './context' -import UserProvider from './context/UserProvider' import Routes from './Routes' import './styles/global.scss' import styles from './App.module.scss' @@ -12,33 +11,27 @@ import styles from './App.module.scss' export default class App extends Component { public render() { return ( - -
- - <> -
+
+ + <> +
-
- - {states => - states.isLoading ? ( -
- -
- ) : ( - - ) - } - -
+
+ {this.context.isLoading ? ( +
+ +
+ ) : ( + + )} +
-
- - -
- +
+ + +
) } } + +App.contextType = User diff --git a/client/src/Routes.test.tsx b/client/src/Routes.test.tsx new file mode 100644 index 0000000..5ae671b --- /dev/null +++ b/client/src/Routes.test.tsx @@ -0,0 +1,15 @@ +import React from 'react' +import { BrowserRouter as Router } from 'react-router-dom' +import { render } from 'react-testing-library' +import Routes from './Routes' + +describe('Routes', () => { + it('renders without crashing', () => { + const { container } = render( + + + + ) + expect(container.firstChild).toBeInTheDocument() + }) +}) diff --git a/client/src/components/atoms/Account.test.tsx b/client/src/components/atoms/Account.test.tsx new file mode 100644 index 0000000..da39bd7 --- /dev/null +++ b/client/src/components/atoms/Account.test.tsx @@ -0,0 +1,28 @@ +import React from 'react' +import { render } from 'react-testing-library' +import { toDataUrl } from 'ethereum-blockies' +import Account from './Account' + +describe('Account', () => { + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) + + it('outputs empty state without account', () => { + const { container } = render() + expect(container.firstChild).toHaveTextContent('No account selected') + }) + + it('outputs blockie img', () => { + const account = '0xxxxxxxxxxxxxxx' + const blockies = toDataUrl(account) + + const { container } = render() + expect(container.querySelector('.blockies')).toBeInTheDocument() + expect(container.querySelector('.blockies')).toHaveAttribute( + 'src', + blockies + ) + }) +}) diff --git a/client/src/components/atoms/Account.tsx b/client/src/components/atoms/Account.tsx index 0ff8cd3..de656e2 100644 --- a/client/src/components/atoms/Account.tsx +++ b/client/src/components/atoms/Account.tsx @@ -4,7 +4,7 @@ import { toDataUrl } from 'ethereum-blockies' import styles from './Account.module.scss' const Account = ({ account }: { account: string }) => { - const blockies = toDataUrl(account) + const blockies = account && toDataUrl(account) return account && blockies ? (
diff --git a/client/src/components/atoms/CategoryImage.test.tsx b/client/src/components/atoms/CategoryImage.test.tsx index 8e9fca4..1b07d03 100644 --- a/client/src/components/atoms/CategoryImage.test.tsx +++ b/client/src/components/atoms/CategoryImage.test.tsx @@ -1,16 +1,13 @@ import React from 'react' import { render } from 'react-testing-library' -import slugify from 'slugify' import CategoryImage from './CategoryImage' import formPublish from '../../data/form-publish.json' describe('CategoryImage', () => { it('renders fallback image', () => { - const { container, getByTestId } = render( - - ) + const { container } = render() expect(container.firstChild).toBeInTheDocument() - expect(getByTestId('image').style.backgroundImage).toMatch( + expect(container.firstChild.style.backgroundImage).toMatch( /jellyfish-back/ ) }) @@ -21,13 +18,8 @@ describe('CategoryImage', () => { : [] options.map((category: string) => { - const { getByTestId } = render( - - ) - expect(getByTestId('image')).toBeInTheDocument() - // expect(getByTestId('image').style.backgroundImage).toMatch( - // slugify(category, { lower: true }) - // ) + const { container } = render() + expect(container.firstChild).toBeInTheDocument() }) }) }) diff --git a/client/src/components/atoms/CategoryImage.tsx b/client/src/components/atoms/CategoryImage.tsx index 52c77c4..a02df06 100644 --- a/client/src/components/atoms/CategoryImage.tsx +++ b/client/src/components/atoms/CategoryImage.tsx @@ -148,7 +148,6 @@ export default class CategoryImage extends PureComponent<{ category: string }> { style={{ backgroundImage: `url(${image})` }} - {...this.props} /> ) } diff --git a/client/src/components/atoms/Form/Form.test.tsx b/client/src/components/atoms/Form/Form.test.tsx new file mode 100644 index 0000000..99a9d4c --- /dev/null +++ b/client/src/components/atoms/Form/Form.test.tsx @@ -0,0 +1,29 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Form from './Form' + +describe('Form', () => { + it('renders without crashing', () => { + const { container } = render(
Hello
) + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders title & description when set', () => { + const { container } = render( +
+ Hello +
+ ) + expect(container.querySelector('.formTitle')).toHaveTextContent( + 'Hello Title' + ) + expect(container.querySelector('.formDescription')).toHaveTextContent( + 'Hello Description' + ) + }) + + it('can switch to minimal', () => { + const { container } = render(
Hello
) + expect(container.firstChild).toHaveClass('formMinimal') + }) +}) diff --git a/client/src/components/atoms/Form/Input.test.tsx b/client/src/components/atoms/Form/Input.test.tsx new file mode 100644 index 0000000..9fa42ed --- /dev/null +++ b/client/src/components/atoms/Form/Input.test.tsx @@ -0,0 +1,90 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Input from './Input' + +describe('Input', () => { + it('renders default without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + expect(container.querySelector('.label')).toHaveTextContent('My Input') + expect(container.querySelector('.input')).toHaveAttribute( + 'id', + 'my-input' + ) + }) + + it('renders as text input by default', () => { + const { container } = render() + expect(container.querySelector('.input')).toHaveAttribute( + 'type', + 'text' + ) + }) + + it('renders search', () => { + const { container } = render( + + ) + expect(container.querySelector('.input')).toHaveAttribute( + 'type', + 'search' + ) + expect(container.querySelector('label + div')).toHaveClass( + 'inputWrapSearch' + ) + }) + + it('renders select', () => { + const { container } = render( + + ) + expect(container.querySelector('select')).toBeInTheDocument() + }) + + it('renders textarea', () => { + const { container } = render( + + ) + expect(container.querySelector('textarea')).toBeInTheDocument() + }) + + it('renders radios', () => { + const { container } = render( + + ) + expect(container.querySelector('input[type=radio]')).toBeInTheDocument() + }) + + it('renders checkboxes', () => { + const { container } = render( + + ) + expect( + container.querySelector('input[type=checkbox]') + ).toBeInTheDocument() + }) + + it('renders date picker', () => { + const { container } = render( + + ) + expect( + container.querySelector('.react-datepicker-wrapper') + ).toBeInTheDocument() + }) +}) diff --git a/client/src/components/atoms/Form/Input.tsx b/client/src/components/atoms/Form/Input.tsx index 3f732e5..d6e5433 100644 --- a/client/src/components/atoms/Form/Input.tsx +++ b/client/src/components/atoms/Form/Input.tsx @@ -60,9 +60,8 @@ export default class Input extends PureComponent { } private handleDateChange = (date: Date) => { - this.setState({ - dateCreated: date - }) + this.setState({ dateCreated: date }) + const event = { currentTarget: { name: 'dateCreated', @@ -80,7 +79,8 @@ export default class Input extends PureComponent { name, required, onChange, - value + value, + rows } = this.props const wrapClass = this.inputWrapClasses() @@ -119,7 +119,7 @@ export default class Input extends PureComponent { className={styles.input} onFocus={this.toggleFocus} onBlur={this.toggleFocus} - {...this.props} + rows={rows} />
) @@ -174,6 +174,7 @@ export default class Input extends PureComponent { { ) : ( { + it('renders without crashing', () => { + const { container } = render(Hello) + expect(container.firstChild).toBeInTheDocument() + }) +}) diff --git a/client/src/components/atoms/Form/Label.test.tsx b/client/src/components/atoms/Form/Label.test.tsx new file mode 100644 index 0000000..a0a6604 --- /dev/null +++ b/client/src/components/atoms/Form/Label.test.tsx @@ -0,0 +1,20 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Label from './Label' + +describe('Label', () => { + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders required state', () => { + const { container } = render( + + ) + expect(container.firstChild).toHaveAttribute('title', 'Required') + expect(container.firstChild).toHaveClass('required') + }) +}) diff --git a/client/src/components/atoms/Form/Row.test.tsx b/client/src/components/atoms/Form/Row.test.tsx new file mode 100644 index 0000000..3416d91 --- /dev/null +++ b/client/src/components/atoms/Form/Row.test.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Row from './Row' + +describe('Row', () => { + it('renders without crashing', () => { + const { container } = render(Hello) + expect(container.firstChild).toBeInTheDocument() + }) +}) diff --git a/client/src/components/atoms/Markdown.test.tsx b/client/src/components/atoms/Markdown.test.tsx new file mode 100644 index 0000000..2a48656 --- /dev/null +++ b/client/src/components/atoms/Markdown.test.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Markdown from './Markdown' + +describe('Markdown', () => { + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) +}) diff --git a/client/src/components/atoms/Markdown.tsx b/client/src/components/atoms/Markdown.tsx index b9b92f6..0a51726 100644 --- a/client/src/components/atoms/Markdown.tsx +++ b/client/src/components/atoms/Markdown.tsx @@ -1,7 +1,7 @@ import React from 'react' import ReactMarkdown from 'react-markdown' -const Description = ({ +const Markdown = ({ text, className }: { @@ -15,4 +15,4 @@ const Description = ({ return } -export default Description +export default Markdown diff --git a/client/src/components/molecules/AccountStatus/Popover.test.tsx b/client/src/components/molecules/AccountStatus/Popover.test.tsx new file mode 100644 index 0000000..8e6b2a9 --- /dev/null +++ b/client/src/components/molecules/AccountStatus/Popover.test.tsx @@ -0,0 +1,49 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Popover from './Popover' +import { userMock, userMockConnected } from '../../../../__mocks__/user-mock' +import { User } from '../../../context' + +describe('Popover', () => { + it('renders without crashing', () => { + const { container } = render( + + null} style={{}} /> + + ) + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders connected without crashing', () => { + const { container } = render( + + null} style={{}} /> + + ) + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders correct network', () => { + const { container } = render( + + null} style={{}} /> + + ) + expect(container.firstChild).toBeInTheDocument() + expect(container.firstChild).toHaveTextContent('Connected to Nile') + }) + + it('renders with wrong network', () => { + const { container } = render( + + null} style={{}} /> + + ) + expect(container.firstChild).toBeInTheDocument() + expect(container.firstChild).toHaveTextContent( + 'Please connect to Custom RPC' + ) + }) +}) diff --git a/client/src/components/molecules/AccountStatus/Popover.tsx b/client/src/components/molecules/AccountStatus/Popover.tsx index 040a744..ea18d02 100644 --- a/client/src/components/molecules/AccountStatus/Popover.tsx +++ b/client/src/components/molecules/AccountStatus/Popover.tsx @@ -9,6 +9,7 @@ export default class Popover extends PureComponent<{ }> { public render() { const { account, balance, network, isWeb3, isNile } = this.context + return (
{ + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) + + it('togglePopover fires', () => { + const { container } = render() + + const indicator = container.querySelector('.statusIndicator') + + indicator && fireEvent.mouseOver(indicator) + expect(container.querySelector('.popover')).toBeInTheDocument() + indicator && fireEvent.mouseOut(indicator) + }) +}) diff --git a/client/src/components/molecules/AccountStatus/index.tsx b/client/src/components/molecules/AccountStatus/index.tsx index 8c420bb..91fdd09 100644 --- a/client/src/components/molecules/AccountStatus/index.tsx +++ b/client/src/components/molecules/AccountStatus/index.tsx @@ -19,7 +19,7 @@ export default class AccountStatus extends PureComponent< isPopoverOpen: false } - public togglePopover() { + private togglePopover() { this.setState(prevState => ({ isPopoverOpen: !prevState.isPopoverOpen })) diff --git a/client/src/components/molecules/Pagination.test.tsx b/client/src/components/molecules/Pagination.test.tsx index c93ec93..9d0b51b 100644 --- a/client/src/components/molecules/Pagination.test.tsx +++ b/client/src/components/molecules/Pagination.test.tsx @@ -2,7 +2,7 @@ import React from 'react' import { render } from 'react-testing-library' import Pagination from './Pagination' -describe('Button', () => { +describe('Pagination', () => { it('renders without crashing', () => { const { container } = render( { - if (item.web3 && !isWeb3) return null - - return ( - - {item.title} - - ) -} +const MenuItem = ({ item }: { item: any }) => ( + + {item.title} + +) export default class Header extends PureComponent { public render() { - const { isWeb3 } = this.context - return (
@@ -37,11 +31,7 @@ export default class Header extends PureComponent { diff --git a/client/src/components/organisms/Web3message.test.tsx b/client/src/components/organisms/Web3message.test.tsx index ca0384c..e38e7c8 100644 --- a/client/src/components/organisms/Web3message.test.tsx +++ b/client/src/components/organisms/Web3message.test.tsx @@ -1,11 +1,62 @@ import React from 'react' -import { render } from 'react-testing-library' +import { render, fireEvent } from 'react-testing-library' import Web3message from './Web3message' +import { User } from '../../context' +import { userMock, userMockConnected } from '../../../__mocks__/user-mock' describe('Web3message', () => { - it('default renders without crashing', () => { - const { container } = render() + it('renders with noWeb3 message', () => { + const { container } = render( + + + + ) + expect(container.firstChild).toHaveTextContent('Not a Web3 Browser') + }) - expect(container.firstChild).toBeInTheDocument() + it('renders with wrongNetwork message', () => { + const { container } = render( + + + + ) + expect(container.firstChild).toHaveTextContent( + 'Not connected to Nile network' + ) + }) + + it('renders with noAccount message', () => { + const { container } = render( + + + + ) + expect(container.firstChild).toHaveTextContent('No accounts detected') + }) + + it('renders with hasAccount message', () => { + const { container } = render( + + + + ) + expect(container.firstChild).toHaveTextContent('0xxxxxx') + }) + + it('button click fires unlockAccounts', () => { + const { getByText } = render( + + + + ) + + fireEvent.click(getByText('Unlock Account')) + expect(userMock.unlockAccounts).toBeCalled() }) }) diff --git a/client/src/components/templates/Route.test.tsx b/client/src/components/templates/Route.test.tsx new file mode 100644 index 0000000..014c0d2 --- /dev/null +++ b/client/src/components/templates/Route.test.tsx @@ -0,0 +1,24 @@ +import React from 'react' +import { render } from 'react-testing-library' +import Route from './Route' + +describe('Route', () => { + it('renders without crashing', () => { + const { container } = render(Hello) + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders title & description', () => { + const { container } = render( + + Hello + + ) + expect(container.querySelector('.title')).toHaveTextContent( + 'Hello Title' + ) + expect(container.querySelector('.description')).toHaveTextContent( + 'Hello Description' + ) + }) +}) diff --git a/client/src/context/UserProvider.tsx b/client/src/context/UserProvider.tsx index 335c6b4..f6c1dff 100644 --- a/client/src/context/UserProvider.tsx +++ b/client/src/context/UserProvider.tsx @@ -1,6 +1,6 @@ import React, { PureComponent } from 'react' import Web3 from 'web3' -import { Logger } from '@oceanprotocol/squid' +import { Logger, Ocean, Account } from '@oceanprotocol/squid' import { User } from '.' import { provideOcean, requestFromFaucet, FaucetResponse } from '../ocean' import { nodeHost, nodePort, nodeScheme } from '../config' @@ -54,7 +54,7 @@ interface UserProviderState { } network: string web3: Web3 - ocean: any + ocean: Ocean requestFromFaucet(account: string): Promise unlockAccounts(): Promise message: string @@ -117,7 +117,7 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> { } } - private getWeb3 = async () => { + private getWeb3 = () => { // Modern dapp browsers if (window.ethereum) { window.web3 = new Web3(window.ethereum) @@ -236,7 +236,7 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> { } } - private fetchBalance = async (account: any) => { + private fetchBalance = async (account: Account) => { const balance = await account.getBalance() const { eth, ocn } = balance if (eth !== this.state.balance.eth || ocn !== this.state.balance.ocn) { diff --git a/client/src/data/web3message.json b/client/src/data/web3message.json index db9dc81..a441d40 100644 --- a/client/src/data/web3message.json +++ b/client/src/data/web3message.json @@ -1,6 +1,6 @@ { "noweb3": "Not a Web3 Browser. For publishing and downloading an asset you need to setup MetaMask or use any other Web3-capable plugin or browser.", "noAccount": "No accounts detected. For publishing and downloading an asset you need to unlock your Web3 account.", - "hasAccount": "Connected with account ", + "hasAccount": "", "wrongNetwork": "Not connected to Nile network.
Please connect in MetaMask with Custom RPC https://nile.dev-ocean.com" } diff --git a/client/src/hoc/withTracker.tsx b/client/src/hoc/withTracker.tsx index f976590..f5a74b2 100644 --- a/client/src/hoc/withTracker.tsx +++ b/client/src/hoc/withTracker.tsx @@ -8,7 +8,7 @@ const withTracker =

( options: FieldsObject = {} ) => { ReactGA.initialize(analyticsId, { - testMode: process.env.NODE_ENV === 'development', + testMode: process.env.NODE_ENV === 'test', debug: false }) diff --git a/client/src/index.test.tsx b/client/src/index.test.tsx new file mode 100644 index 0000000..4bf2b26 --- /dev/null +++ b/client/src/index.test.tsx @@ -0,0 +1,22 @@ +import ReactDOM from 'react-dom' +import { renderToDOM } from './index' + +describe('test ReactDOM.render', () => { + const originalRender = ReactDOM.render + const originalGetElement = global.document.getElementById + + beforeEach(() => { + global.document.getElementById = () => true + ReactDOM.render = jest.fn() + }) + + afterAll(() => { + global.document.getElementById = originalGetElement + ReactDOM.render = originalRender + }) + + it('should call ReactDOM.render', () => { + renderToDOM() + expect(ReactDOM.render).toHaveBeenCalled() + }) +}) diff --git a/client/src/index.tsx b/client/src/index.tsx index 9dd7ba7..54596d0 100644 --- a/client/src/index.tsx +++ b/client/src/index.tsx @@ -1,9 +1,25 @@ import React from 'react' import ReactDOM from 'react-dom' +import UserProvider from './context/UserProvider' import App from './App' import * as serviceWorker from './serviceWorker' -ReactDOM.render(, document.getElementById('root')) +function renderToDOM() { + const root = document.getElementById('root') + + if (root !== null) { + ReactDOM.render( + + + , + root + ) + } +} + +export { renderToDOM } + +renderToDOM() // If you want your app to work offline and load faster, you can change // unregister() to register() below. Note this comes with some pitfalls. diff --git a/client/src/ocean.test.ts b/client/src/ocean.test.ts new file mode 100644 index 0000000..2628ee6 --- /dev/null +++ b/client/src/ocean.test.ts @@ -0,0 +1,17 @@ +import Web3 from 'web3' +import { provideOcean, requestFromFaucet } from './ocean' + +describe('ocean', () => { + const web3 = new Web3(Web3.givenProvider) + + it('provideOcean can be called', async () => { + const response = await provideOcean(web3) + expect(response.ocean).toBeTruthy() + }) + + it('requestFromFaucet can be called', async () => { + const response = await requestFromFaucet('0xxxxxx') + response && + expect(response.errors[0].msg).toBe('Invalid Ethereum address') + }) +}) diff --git a/client/src/ocean.ts b/client/src/ocean.ts index e752aec..511788a 100644 --- a/client/src/ocean.ts +++ b/client/src/ocean.ts @@ -72,6 +72,6 @@ export async function requestFromFaucet(account: string) { }) return response.json() } catch (error) { - Logger.log('requestFromFaucet', error) + Logger.error('requestFromFaucet', error) } } diff --git a/client/src/routes/About.test.tsx b/client/src/routes/About.test.tsx new file mode 100644 index 0000000..0b1f795 --- /dev/null +++ b/client/src/routes/About.test.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import { render } from 'react-testing-library' +import About from './About' + +describe('About', () => { + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) +}) diff --git a/client/src/routes/Details/AssetDetails.test.tsx b/client/src/routes/Details/AssetDetails.test.tsx new file mode 100644 index 0000000..8de750c --- /dev/null +++ b/client/src/routes/Details/AssetDetails.test.tsx @@ -0,0 +1,68 @@ +import React from 'react' +import { render } from 'react-testing-library' +import { DDO, MetaData } from '@oceanprotocol/squid' +import { BrowserRouter as Router } from 'react-router-dom' +import AssetDetails, { datafilesLine } from './AssetDetails' + +/* eslint-disable @typescript-eslint/no-explicit-any */ +describe('AssetDetails', () => { + it('renders loading without crashing', () => { + const { container } = render( + + ) + expect(container.firstChild).toBeInTheDocument() + }) + + it('renders with data', () => { + const { container } = render( + + + + ) + expect(container.querySelector('.description')).toHaveTextContent( + 'Description' + ) + expect(container.firstChild).toHaveTextContent('Category') + }) + + it('datafilesLine renders correctly for one file', () => { + const files = [ + { + index: 0, + url: 'https://hello.com' + } + ] + const { container } = render(datafilesLine(files)) + expect(container.firstChild).toHaveTextContent('1 data file') + }) + + it('datafilesLine renders correctly for multiple files', () => { + const files = [ + { + index: 0, + url: 'https://hello.com' + }, + { + index: 1, + url: 'https://hello2.com' + } + ] + const { container } = render(datafilesLine(files)) + expect(container.firstChild).toHaveTextContent('2 data files') + }) +}) diff --git a/client/src/routes/Details/AssetDetails.tsx b/client/src/routes/Details/AssetDetails.tsx index 1c418ac..655cd9c 100644 --- a/client/src/routes/Details/AssetDetails.tsx +++ b/client/src/routes/Details/AssetDetails.tsx @@ -1,23 +1,24 @@ import React, { PureComponent } from 'react' import { Link } from 'react-router-dom' import Moment from 'react-moment' +import { DDO, MetaData, File } from '@oceanprotocol/squid' import Markdown from '../../components/atoms/Markdown' import styles from './AssetDetails.module.scss' import AssetFilesDetails from './AssetFilesDetails' interface AssetDetailsProps { - metadata: any - ddo: any + metadata: MetaData + ddo: DDO +} + +export function datafilesLine(files: File[]) { + if (files.length === 1) { + return {files.length} data file + } + return {files.length} data files } export default class AssetDetails extends PureComponent { - private datafilesLine = (files: any) => { - if (files.length === 1) { - return {files.length} data file - } - return {files.length} data files - } - public render() { const { metadata, ddo } = this.props const { base } = metadata @@ -51,14 +52,16 @@ export default class AssetDetails extends PureComponent { )} - {base.files && this.datafilesLine(base.files)} + {base.files && datafilesLine(base.files)}

- + {base.description && ( + + )}
  • diff --git a/client/src/routes/Details/AssetFile.test.tsx b/client/src/routes/Details/AssetFile.test.tsx new file mode 100644 index 0000000..576e154 --- /dev/null +++ b/client/src/routes/Details/AssetFile.test.tsx @@ -0,0 +1,77 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ + +import React from 'react' +import { render, fireEvent } from 'react-testing-library' +import { DDO } from '@oceanprotocol/squid' +import { StateMock } from '@react-mock/state' +import { User } from '../../context' +import AssetFile from './AssetFile' + +const file = { + index: 0, + url: 'https://hello.com', + contentType: 'zip', + contentLength: 100 +} + +const ddo = ({ id: 'xxx' } as any) as DDO + +const contextConnectedMock = { + isLogged: true, + isLoading: false, + isWeb3: true, + isNile: true, + account: '', + web3: {}, + ocean: {}, + balance: { eth: 0, ocn: 0 }, + network: '', + requestFromFaucet: () => {}, + unlockAccounts: () => {}, + message: '' +} + +describe('AssetFile', () => { + it('renders without crashing', () => { + const { container } = render() + expect(container.firstChild).toBeInTheDocument() + }) + + it('button to be disabled when not connected', () => { + const { container } = render() + expect(container.querySelector('button')).toHaveAttribute('disabled') + }) + + it('button to be enabled when connected', async () => { + const { getByText } = render( + + + + ) + const button = getByText('Get file') + expect(button).not.toHaveAttribute('disabled') + + fireEvent.click(button) + }) + + it('renders loading state', async () => { + const { container } = render( + + + + ) + expect(container.querySelector('.spinner')).toBeInTheDocument() + }) + + it('renders error', async () => { + const { container } = render( + + + + ) + expect(container.querySelector('.error')).toBeInTheDocument() + expect(container.querySelector('.error')).toHaveTextContent( + 'Hello Error' + ) + }) +}) diff --git a/client/src/routes/Details/AssetFile.tsx b/client/src/routes/Details/AssetFile.tsx index 32f7374..a67f2d1 100644 --- a/client/src/routes/Details/AssetFile.tsx +++ b/client/src/routes/Details/AssetFile.tsx @@ -1,5 +1,5 @@ import React, { PureComponent } from 'react' -import { Logger } from '@oceanprotocol/squid' +import { Logger, DDO, File } from '@oceanprotocol/squid' import filesize from 'filesize' import Button from '../../components/atoms/Button' import Spinner from '../../components/atoms/Spinner' @@ -8,8 +8,8 @@ import styles from './AssetFile.module.scss' import ReactGA from 'react-ga' interface AssetFileProps { - file: any - ddo: any + file: File + ddo: DDO } interface AssetFileState { @@ -30,7 +30,7 @@ export default class AssetFile extends PureComponent< private resetState = () => this.setState({ isLoading: true, error: '' }) - private purchaseAsset = async (ddo: any, index: number) => { + private purchaseAsset = async (ddo: DDO, index: number) => { this.resetState() ReactGA.event({ @@ -77,6 +77,7 @@ export default class AssetFile extends PureComponent< const { ddo, file } = this.props const { isLoading, message, error } = this.state const { isLogged, isNile } = this.context + const { index } = file return (
    @@ -97,7 +98,7 @@ export default class AssetFile extends PureComponent<