From 4a444591c11933a4dc2ee74b8eca1b4d7172362d Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 13 Nov 2018 17:14:13 +0100 Subject: Implement 0x launch kit landing page --- .../public/images/launch_kit/0x_cupboard.svg | 53 ++++ .../public/images/launch_kit/enable_trading.svg | 9 + packages/website/public/images/launch_kit/fork.svg | 4 + .../images/launch_kit/in_game_marketplace.svg | 11 + .../public/images/launch_kit/local_market.svg | 12 + .../public/images/launch_kit/secondary_market.svg | 6 + .../public/images/launch_kit/shared_liquidity.svg | 28 ++ packages/website/translations/chinese.json | 6 + packages/website/translations/english.json | 6 + packages/website/translations/korean.json | 6 + packages/website/translations/russian.json | 6 + packages/website/translations/spanish.json | 6 + packages/website/ts/components/footer.tsx | 6 +- packages/website/ts/components/ui/container.tsx | 2 + packages/website/ts/containers/launch_kit.ts | 27 ++ packages/website/ts/index.tsx | 2 + .../website/ts/pages/launch_kit/launch_kit.tsx | 297 +++++++++++++++++++++ packages/website/ts/types.ts | 7 + 18 files changed, 493 insertions(+), 1 deletion(-) create mode 100644 packages/website/public/images/launch_kit/0x_cupboard.svg create mode 100644 packages/website/public/images/launch_kit/enable_trading.svg create mode 100644 packages/website/public/images/launch_kit/fork.svg create mode 100644 packages/website/public/images/launch_kit/in_game_marketplace.svg create mode 100644 packages/website/public/images/launch_kit/local_market.svg create mode 100644 packages/website/public/images/launch_kit/secondary_market.svg create mode 100644 packages/website/public/images/launch_kit/shared_liquidity.svg create mode 100644 packages/website/ts/containers/launch_kit.ts create mode 100644 packages/website/ts/pages/launch_kit/launch_kit.tsx diff --git a/packages/website/public/images/launch_kit/0x_cupboard.svg b/packages/website/public/images/launch_kit/0x_cupboard.svg new file mode 100644 index 000000000..4c4e6ba1b --- /dev/null +++ b/packages/website/public/images/launch_kit/0x_cupboard.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/website/public/images/launch_kit/enable_trading.svg b/packages/website/public/images/launch_kit/enable_trading.svg new file mode 100644 index 000000000..84a081629 --- /dev/null +++ b/packages/website/public/images/launch_kit/enable_trading.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/packages/website/public/images/launch_kit/fork.svg b/packages/website/public/images/launch_kit/fork.svg new file mode 100644 index 000000000..83d2f6d65 --- /dev/null +++ b/packages/website/public/images/launch_kit/fork.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/website/public/images/launch_kit/in_game_marketplace.svg b/packages/website/public/images/launch_kit/in_game_marketplace.svg new file mode 100644 index 000000000..853efe7ca --- /dev/null +++ b/packages/website/public/images/launch_kit/in_game_marketplace.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/packages/website/public/images/launch_kit/local_market.svg b/packages/website/public/images/launch_kit/local_market.svg new file mode 100644 index 000000000..05f7fd993 --- /dev/null +++ b/packages/website/public/images/launch_kit/local_market.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/packages/website/public/images/launch_kit/secondary_market.svg b/packages/website/public/images/launch_kit/secondary_market.svg new file mode 100644 index 000000000..bc7d94f65 --- /dev/null +++ b/packages/website/public/images/launch_kit/secondary_market.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/packages/website/public/images/launch_kit/shared_liquidity.svg b/packages/website/public/images/launch_kit/shared_liquidity.svg new file mode 100644 index 000000000..0647ecf0d --- /dev/null +++ b/packages/website/public/images/launch_kit/shared_liquidity.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/website/translations/chinese.json b/packages/website/translations/chinese.json index 95b9bda62..489b6b5ae 100644 --- a/packages/website/translations/chinese.json +++ b/packages/website/translations/chinese.json @@ -95,6 +95,12 @@ "LIBRARIES_AND_TOOLS_DESCRIPTION": "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", + "LAUNCH_KIT": "0x launch kit", + "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "GET_STARTED": "get started", + "GET_IN_TOUCH": "get in touch", + "EXPLORE_THE_DOCS": "explore the docs", + "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": "Follow one of our \"Getting started\" guides to learn more about building ontop of 0x." diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 465bd49b4..02c7f2e8a 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -99,6 +99,12 @@ "LIBRARIES_AND_TOOLS_DESCRIPTION": "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", + "LAUNCH_KIT": "0x launch kit", + "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "GET_STARTED": "get started", + "GET_IN_TOUCH": "get in touch", + "EXPLORE_THE_DOCS": "explore the docs", + "LEARN_MORE": "learn more", "OUR_MISSION_AND_VALUES": "our mission & values", "GAMING_AND_COLLECTABLES": "gaming & collectables", "GAMING_AND_COLLECTABLES_DESCRIPTION": diff --git a/packages/website/translations/korean.json b/packages/website/translations/korean.json index 5485e5583..aa2a24c5b 100644 --- a/packages/website/translations/korean.json +++ b/packages/website/translations/korean.json @@ -95,6 +95,12 @@ "LIBRARIES_AND_TOOLS_DESCRIPTION": "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", + "LAUNCH_KIT": "0x launch kit", + "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "GET_STARTED": "get started", + "GET_IN_TOUCH": "get in touch", + "EXPLORE_THE_DOCS": "explore the docs", + "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": "Follow one of our \"Getting started\" guides to learn more about building ontop of 0x." diff --git a/packages/website/translations/russian.json b/packages/website/translations/russian.json index a2e2a8cef..6d35452ca 100644 --- a/packages/website/translations/russian.json +++ b/packages/website/translations/russian.json @@ -95,6 +95,12 @@ "LIBRARIES_AND_TOOLS_DESCRIPTION": "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", + "LAUNCH_KIT": "0x launch kit", + "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "GET_STARTED": "get started", + "GET_IN_TOUCH": "get in touch", + "EXPLORE_THE_DOCS": "explore the docs", + "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": "Follow one of our \"Getting started\" guides to learn more about building ontop of 0x." diff --git a/packages/website/translations/spanish.json b/packages/website/translations/spanish.json index acbc59c3d..31b9e1a7a 100644 --- a/packages/website/translations/spanish.json +++ b/packages/website/translations/spanish.json @@ -96,6 +96,12 @@ "LIBRARIES_AND_TOOLS_DESCRIPTION": "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", + "LAUNCH_KIT": "0x launch kit", + "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "GET_STARTED": "get started", + "GET_IN_TOUCH": "get in touch", + "EXPLORE_THE_DOCS": "explore the docs", + "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": "Follow one of our \"Getting started\" guides to learn more about building ontop of 0x." diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index dfedcba55..e10005a0a 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -23,6 +23,7 @@ const languageToMenuTitle = { export interface FooterProps { translate: Translate; dispatcher: Dispatcher; + backgroundColor?: string; } interface FooterState { @@ -30,6 +31,9 @@ interface FooterState { } export class Footer extends React.Component { + public static defaultProps = { + backgroundColor: colors.darkerGrey, + }; constructor(props: FooterProps) { super(props); this.state = { @@ -112,7 +116,7 @@ export class Footer extends React.Component { return ; }); return ( -
+
diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx index ece077563..7eab2a50f 100644 --- a/packages/website/ts/components/ui/container.tsx +++ b/packages/website/ts/components/ui/container.tsx @@ -1,3 +1,4 @@ +import { TextAlignProperty } from 'csstype'; import * as React from 'react'; type StringOrNum = string | number; @@ -26,6 +27,7 @@ export interface ContainerProps { height?: StringOrNum; minWidth?: StringOrNum; minHeight?: StringOrNum; + textAlign?: TextAlignProperty; isHidden?: boolean; className?: string; position?: 'absolute' | 'fixed' | 'relative' | 'unset'; diff --git a/packages/website/ts/containers/launch_kit.ts b/packages/website/ts/containers/launch_kit.ts new file mode 100644 index 000000000..2557f38a5 --- /dev/null +++ b/packages/website/ts/containers/launch_kit.ts @@ -0,0 +1,27 @@ +import * as React from 'react'; +import { connect } from 'react-redux'; +import { Dispatch } from 'redux'; +import { LaunchKit as LaunchKitComponent, LaunchKitProps } from 'ts/pages/launch_kit/launch_kit'; +import { Dispatcher } from 'ts/redux/dispatcher'; +import { State } from 'ts/redux/reducer'; +import { Translate } from 'ts/utils/translate'; + +interface ConnectedState { + translate: Translate; +} + +interface ConnectedDispatch { + dispatcher: Dispatcher; +} + +const mapStateToProps = (state: State, _ownProps: LaunchKitProps): ConnectedState => ({ + translate: state.translate, +}); + +const mapDispatchToProps = (dispatch: Dispatch): ConnectedDispatch => ({ + dispatcher: new Dispatcher(dispatch), +}); + +export const LaunchKit: React.ComponentClass = connect(mapStateToProps, mapDispatchToProps)( + LaunchKitComponent, +); diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index 21157e427..96e7184f8 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -9,6 +9,7 @@ import { DocsHome } from 'ts/containers/docs_home'; import { FAQ } from 'ts/containers/faq'; import { Jobs } from 'ts/containers/jobs'; import { Landing } from 'ts/containers/landing'; +import { LaunchKit } from 'ts/containers/launch_kit'; import { NotFound } from 'ts/containers/not_found'; import { Wiki } from 'ts/containers/wiki'; import { createLazyComponent } from 'ts/lazy_component'; @@ -87,6 +88,7 @@ render( + diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx new file mode 100644 index 000000000..7c3cc1c99 --- /dev/null +++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx @@ -0,0 +1,297 @@ +import { colors, Link } from '@0x/react-shared'; +import * as _ from 'lodash'; +import * as React from 'react'; +import DocumentTitle from 'react-document-title'; +import { Footer } from 'ts/components/footer'; +import { TopBar } from 'ts/components/top_bar/top_bar'; +import { Button } from 'ts/components/ui/button'; +import { Container } from 'ts/components/ui/container'; +import { Image } from 'ts/components/ui/image'; +import { Text } from 'ts/components/ui/text'; +import { Dispatcher } from 'ts/redux/dispatcher'; +import { Deco, Key, ScreenWidths, WebsitePaths } from 'ts/types'; +import { constants } from 'ts/utils/constants'; +import { Translate } from 'ts/utils/translate'; +import { utils } from 'ts/utils/utils'; + +export interface LaunchKitProps { + location: Location; + translate: Translate; + dispatcher: Dispatcher; +} + +interface LaunchKitState { + screenWidth: ScreenWidths; +} + +const THROTTLE_TIMEOUT = 100; +const lighterBackgroundColor = '#222222'; +const darkerBackgroundColor = '#1B1B1B'; + +interface Benefit { + icon: string; + description: string; +} +const BENEFITS_1: Benefit[] = [ + { + icon: '/images/launch_kit/shared_liquidity.svg', + description: 'Tap into and share liquidity with other relayers', + }, + { + icon: '/images/launch_kit/fork.svg', + description: 'Fork and extend to support new modes of exchange', + }, + { + icon: '/images/launch_kit/enable_trading.svg', + description: 'Enable trading for any ERC-20 or ERC-721 asset', + }, +]; +const BENEFITS_2: Benefit[] = [ + { + icon: '/images/launch_kit/secondary_market.svg', + description: 'Quickly form a secondary market for your own token', + }, + { + icon: '/images/launch_kit/in_game_marketplace.svg', + description: 'Seamlessly create an in-game marketplace for digital items and collectables', + }, + { + icon: '/images/launch_kit/local_market.svg', + description: 'Easily build a 0x relayer for your local market', + }, +]; + +export class LaunchKit extends React.Component { + private readonly _throttledScreenWidthUpdate: () => void; + constructor(props: LaunchKitProps) { + super(props); + this.state = { + screenWidth: utils.getScreenWidth(), + }; + this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT); + } + public componentDidMount(): void { + window.addEventListener('resize', this._throttledScreenWidthUpdate); + window.scrollTo(0, 0); + } + public componentWillUnmount(): void { + window.removeEventListener('resize', this._throttledScreenWidthUpdate); + } + public render(): React.ReactNode { + return ( +
+ + + {this._renderHero()} + {this._renderSection()} + {this._renderCallToAction()} +
+
+ ); + } + private _renderHero(): React.ReactNode { + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; + const smallButtonPadding = '12px 30px 12px 30px'; + const largeButtonPadding = '14px 60px 14px 60px'; + const left = 'col lg-col-6 md-col-6 col-12 lg-pl2 md-pl2 sm-pl0 sm-px3 sm-center'; + const flexClassName = isSmallScreen + ? 'flex items-center flex-column justify-center' + : 'flex items-center justify-center'; + return ( +
+
+
+
+
+ + {this.props.translate.get(Key.LaunchKit, Deco.CapWords)} + + + + {this.props.translate.get(Key.LaunchKitPitch, Deco.Cap)} + + + + + + + + +
+ + + +
+ +
+
+ + + +
+
; + {this._renderBenefits(BENEFITS_1)} +
+ ); + } + private _renderSection(): React.ReactNode { + return ( +
+ + + Perfect for developers who need simple exchange functionality + + + {this._renderBenefits(BENEFITS_2)} +
+ ); + } + private _renderCallToAction(): React.ReactNode { + const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; + const smallButtonPadding = '8px 14px 8px 14px'; + const largeButtonPadding = '8px 14px 8px 14px'; + return ( + + + + + View our comprehensive documentation to start building today. + + + + + + + + +
+ + + +
+ + + + ); + } + private _renderBenefits(benefits: Benefit[]): React.ReactNode { + return ( + + {_.map(benefits, benefit => { + return ( + + + + + + + {benefit.description} + + + + ); + })} + + ); + } + private _updateScreenWidth(): void { + const newScreenWidth = utils.getScreenWidth(); + if (newScreenWidth !== this.state.screenWidth) { + this.setState({ + screenWidth: newScreenWidth, + }); + } + } +} diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index ce4b50a58..7065097d9 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -352,6 +352,7 @@ export enum WebsitePaths { Home = '/', FAQ = '/faq', About = '/about', + LaunchKit = '/launch-kit', Whitepaper = '/pdfs/0x_white_paper.pdf', SmartContracts = '/docs/contracts', Connect = '/docs/connect', @@ -479,6 +480,12 @@ export enum Key { More = 'MORE', StartBuildOn0x = 'START_BUILDING_ON_0X', StartBuildOn0xDescription = 'START_BUILDING_ON_0X_DESCRIPTION', + LaunchKit = 'LAUNCH_KIT', + LaunchKitPitch = 'LAUNCH_KIT_PITCH', + ExploreTheDocs = 'EXPLORE_THE_DOCS', + GetInTouch = 'GET_IN_TOUCH', + LearnMore = 'LEARN_MORE', + GetStarted = 'GET_STARTED', } export enum SmartContractDocSections { -- cgit From 954fe3f549fcb171d7d16b5c048983ad524cd2fa Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 13 Nov 2018 17:14:21 +0100 Subject: update yarn.lock --- yarn.lock | 39 +-------------------------------------- 1 file changed, 1 insertion(+), 38 deletions(-) diff --git a/yarn.lock b/yarn.lock index b23ec92d6..f33adb227 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1906,10 +1906,6 @@ aes-js@^0.2.3: version "0.2.4" resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-0.2.4.tgz#94b881ab717286d015fa219e08fb66709dda5a3d" -aes-js@^3.1.1: - version "3.1.1" - resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-3.1.1.tgz#89fd1f94ae51b4c72d62466adc1a7323ff52f072" - agent-base@4, agent-base@^4.1.0, agent-base@~4.2.0: version "4.2.1" resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9" @@ -3347,7 +3343,7 @@ bs-logger@0.x: dependencies: fast-json-stable-stringify "^2.0.0" -bs58@=4.0.1, bs58@^4.0.0: +bs58@=4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/bs58/-/bs58-4.0.1.tgz#be161e76c354f6f788ae4071f63f34e8c4f0a42a" dependencies: @@ -3370,14 +3366,6 @@ bs58check@^1.0.8: bs58 "^3.1.0" create-hash "^1.1.0" -bs58check@^2.1.2: - version "2.1.2" - resolved "https://registry.yarnpkg.com/bs58check/-/bs58check-2.1.2.tgz#53b018291228d82a5aa08e7d796fdafda54aebfc" - dependencies: - bs58 "^4.0.0" - create-hash "^1.1.0" - safe-buffer "^5.1.2" - bser@^2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz#9ac78d3ed5d915804fd87acb158bc797147a1719" @@ -5965,19 +5953,6 @@ ethereumjs-wallet@0.6.0: utf8 "^2.1.1" uuid "^2.0.1" -ethereumjs-wallet@~0.6.0: - version "0.6.2" - resolved "https://registry.yarnpkg.com/ethereumjs-wallet/-/ethereumjs-wallet-0.6.2.tgz#67244b6af3e8113b53d709124b25477b64aeccda" - dependencies: - aes-js "^3.1.1" - bs58check "^2.1.2" - ethereumjs-util "^5.2.0" - hdkey "^1.0.0" - safe-buffer "^5.1.2" - scrypt.js "^0.2.0" - utf8 "^3.0.0" - uuid "^3.3.2" - ethers@~4.0.4: version "4.0.4" resolved "https://registry.yarnpkg.com/ethers/-/ethers-4.0.4.tgz#d3f85e8b27f4b59537e06526439b0fb15b44dc65" @@ -7511,14 +7486,6 @@ hdkey@^0.7.0, hdkey@^0.7.1: coinstring "^2.0.0" secp256k1 "^3.0.1" -hdkey@^1.0.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/hdkey/-/hdkey-1.1.0.tgz#e74e7b01d2c47f797fa65d1d839adb7a44639f29" - dependencies: - coinstring "^2.0.0" - safe-buffer "^5.1.1" - secp256k1 "^3.0.1" - he@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd" @@ -15605,10 +15572,6 @@ utf8@^2.1.1: version "2.1.2" resolved "https://registry.yarnpkg.com/utf8/-/utf8-2.1.2.tgz#1fa0d9270e9be850d9b05027f63519bf46457d96" -utf8@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/utf8/-/utf8-3.0.0.tgz#f052eed1364d696e769ef058b183df88c87f69d1" - util-deprecate@~1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf" -- cgit From 9b1ec5baaa6011d8d0034cb823aebd7ddfc80eb3 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 13 Nov 2018 21:00:37 +0100 Subject: Move benefits to language files and fix copy --- packages/website/translations/chinese.json | 9 +++- packages/website/translations/english.json | 9 +++- packages/website/translations/korean.json | 9 +++- packages/website/translations/russian.json | 9 +++- packages/website/translations/spanish.json | 9 +++- .../website/ts/pages/launch_kit/launch_kit.tsx | 60 +++++++++++----------- packages/website/ts/types.ts | 7 +++ 7 files changed, 78 insertions(+), 34 deletions(-) diff --git a/packages/website/translations/chinese.json b/packages/website/translations/chinese.json index 489b6b5ae..83ecef40e 100644 --- a/packages/website/translations/chinese.json +++ b/packages/website/translations/chinese.json @@ -96,10 +96,17 @@ "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", "LAUNCH_KIT": "0x launch kit", - "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.", "GET_STARTED": "get started", "GET_IN_TOUCH": "get in touch", "EXPLORE_THE_DOCS": "explore the docs", + "LOCAL_MARKET": "Easily build a 0x relayer for your local market", + "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables", + "QUICKLY_LAUNCH": "Quickly launch a market for your community token", + "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset", + "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange", + "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers", + "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace", "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 02c7f2e8a..663587e6a 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -100,10 +100,17 @@ "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", "LAUNCH_KIT": "0x launch kit", - "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.", "GET_STARTED": "get started", "GET_IN_TOUCH": "get in touch", "EXPLORE_THE_DOCS": "explore the docs", + "LOCAL_MARKET": "Easily build a 0x relayer for your local market", + "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables", + "QUICKLY_LAUNCH": "Quickly launch a market for your community token", + "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset", + "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange", + "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers", + "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace", "LEARN_MORE": "learn more", "OUR_MISSION_AND_VALUES": "our mission & values", "GAMING_AND_COLLECTABLES": "gaming & collectables", diff --git a/packages/website/translations/korean.json b/packages/website/translations/korean.json index aa2a24c5b..2ce7e52c4 100644 --- a/packages/website/translations/korean.json +++ b/packages/website/translations/korean.json @@ -96,10 +96,17 @@ "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", "LAUNCH_KIT": "0x launch kit", - "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.", "GET_STARTED": "get started", "GET_IN_TOUCH": "get in touch", "EXPLORE_THE_DOCS": "explore the docs", + "LOCAL_MARKET": "Easily build a 0x relayer for your local market", + "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables", + "QUICKLY_LAUNCH": "Quickly launch a market for your community token", + "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset", + "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange", + "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers", + "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace", "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": diff --git a/packages/website/translations/russian.json b/packages/website/translations/russian.json index 6d35452ca..2bb047510 100644 --- a/packages/website/translations/russian.json +++ b/packages/website/translations/russian.json @@ -96,10 +96,17 @@ "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", "LAUNCH_KIT": "0x launch kit", - "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.", "GET_STARTED": "get started", "GET_IN_TOUCH": "get in touch", "EXPLORE_THE_DOCS": "explore the docs", + "LOCAL_MARKET": "Easily build a 0x relayer for your local market", + "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables", + "QUICKLY_LAUNCH": "Quickly launch a market for your community token", + "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset", + "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange", + "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers", + "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace", "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": diff --git a/packages/website/translations/spanish.json b/packages/website/translations/spanish.json index 31b9e1a7a..88ea54c40 100644 --- a/packages/website/translations/spanish.json +++ b/packages/website/translations/spanish.json @@ -97,10 +97,17 @@ "A list of available tools maintained by the 0x core developers and wider community for building on top of 0x Protocol and Ethereum", "MORE": "more", "LAUNCH_KIT": "0x launch kit", - "LAUNCH_KIT_PITCH": "Launch an exchange in under a minute.", + "LAUNCH_KIT_PITCH": "launch a relayer in under a minute.", "GET_STARTED": "get started", "GET_IN_TOUCH": "get in touch", "EXPLORE_THE_DOCS": "explore the docs", + "LOCAL_MARKET": "Easily build a 0x relayer for your local market", + "SEEMLESSLY_CREATE": "Seamlessly create an in-game marketplace for digital items and collectables", + "QUICKLY_LAUNCH": "Quickly launch a market for your community token", + "ENABLE_TRADING": "Enable trading for any ERC-20 or ERC-721 asset", + "FORK_AND_EXTEND": "Fork and extend to support new modes of exchange", + "TAP_INTO_AND_SHARE": "Tap into and share liquidity with other relayers", + "PERFECT_FOR_DEVELOPERS": "Perfect for developers who need a simple drop-in marketplace", "LEARN_MORE": "learn more", "START_BUILDING_ON_0X": "Start building on 0x", "START_BUILDING_ON_0X_DESCRIPTION": diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx index 7c3cc1c99..208e84b12 100644 --- a/packages/website/ts/pages/launch_kit/launch_kit.tsx +++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx @@ -32,34 +32,6 @@ interface Benefit { icon: string; description: string; } -const BENEFITS_1: Benefit[] = [ - { - icon: '/images/launch_kit/shared_liquidity.svg', - description: 'Tap into and share liquidity with other relayers', - }, - { - icon: '/images/launch_kit/fork.svg', - description: 'Fork and extend to support new modes of exchange', - }, - { - icon: '/images/launch_kit/enable_trading.svg', - description: 'Enable trading for any ERC-20 or ERC-721 asset', - }, -]; -const BENEFITS_2: Benefit[] = [ - { - icon: '/images/launch_kit/secondary_market.svg', - description: 'Quickly form a secondary market for your own token', - }, - { - icon: '/images/launch_kit/in_game_marketplace.svg', - description: 'Seamlessly create an in-game marketplace for digital items and collectables', - }, - { - icon: '/images/launch_kit/local_market.svg', - description: 'Easily build a 0x relayer for your local market', - }, -]; export class LaunchKit extends React.Component { private readonly _throttledScreenWidthUpdate: () => void; @@ -100,6 +72,20 @@ export class LaunchKit extends React.Component { ); } private _renderHero(): React.ReactNode { + const BENEFITS_1: Benefit[] = [ + { + icon: '/images/launch_kit/shared_liquidity.svg', + description: this.props.translate.get(Key.TapIntoAndShare, Deco.Cap), + }, + { + icon: '/images/launch_kit/fork.svg', + description: this.props.translate.get(Key.ForkAndExtend, Deco.Cap), + }, + { + icon: '/images/launch_kit/enable_trading.svg', + description: this.props.translate.get(Key.EnableTrading, Deco.Cap), + }, + ]; const isSmallScreen = this.state.screenWidth === ScreenWidths.Sm; const smallButtonPadding = '12px 30px 12px 30px'; const largeButtonPadding = '14px 60px 14px 60px'; @@ -190,6 +176,20 @@ export class LaunchKit extends React.Component { ); } private _renderSection(): React.ReactNode { + const BENEFITS_2: Benefit[] = [ + { + icon: '/images/launch_kit/secondary_market.svg', + description: this.props.translate.get(Key.QuicklyLaunch, Deco.Cap), + }, + { + icon: '/images/launch_kit/in_game_marketplace.svg', + description: this.props.translate.get(Key.SeemlesslyCreate, Deco.Cap), + }, + { + icon: '/images/launch_kit/local_market.svg', + description: this.props.translate.get(Key.LocalMarket, Deco.Cap), + }, + ]; return (
{ paddingTop="89px" paddingBottom="89px" maxWidth="421px" + paddingLeft="10px" + paddingRight="10px" > - Perfect for developers who need simple exchange functionality + {this.props.translate.get(Key.PerfectForDevelopers, Deco.CapWords)} {this._renderBenefits(BENEFITS_2)} diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 7065097d9..444a8348d 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -483,6 +483,13 @@ export enum Key { LaunchKit = 'LAUNCH_KIT', LaunchKitPitch = 'LAUNCH_KIT_PITCH', ExploreTheDocs = 'EXPLORE_THE_DOCS', + EnableTrading = 'ENABLE_TRADING', + ForkAndExtend = 'FORK_AND_EXTEND', + LocalMarket = 'LOCAL_MARKET', + SeemlesslyCreate = 'SEEMLESSLY_CREATE', + QuicklyLaunch = 'QUICKLY_LAUNCH', + TapIntoAndShare = 'TAP_INTO_AND_SHARE', + PerfectForDevelopers = 'PERFECT_FOR_DEVELOPERS', GetInTouch = 'GET_IN_TOUCH', LearnMore = 'LEARN_MORE', GetStarted = 'GET_STARTED', -- cgit From 7ccf9cd48efc3be7ca0ed3637e2b7b7dd02dc908 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 14 Nov 2018 15:09:23 -0800 Subject: chore: update yarn lock --- yarn.lock | 41 ++--------------------------------------- 1 file changed, 2 insertions(+), 39 deletions(-) diff --git a/yarn.lock b/yarn.lock index 568ba5564..c62e57816 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1906,10 +1906,6 @@ aes-js@^0.2.3: version "0.2.4" resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-0.2.4.tgz#94b881ab717286d015fa219e08fb66709dda5a3d" -aes-js@^3.1.1: - version "3.1.2" - resolved "https://registry.npmjs.org/aes-js/-/aes-js-3.1.2.tgz#db9aabde85d5caabbfc0d4f2a4446960f627146a" - agent-base@4, agent-base@^4.1.0, agent-base@~4.2.0: version "4.2.1" resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9" @@ -3351,7 +3347,7 @@ bs-logger@0.x: dependencies: fast-json-stable-stringify "^2.0.0" -bs58@=4.0.1, bs58@^4.0.0: +bs58@=4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/bs58/-/bs58-4.0.1.tgz#be161e76c354f6f788ae4071f63f34e8c4f0a42a" dependencies: @@ -3374,14 +3370,6 @@ bs58check@^1.0.8: bs58 "^3.1.0" create-hash "^1.1.0" -bs58check@^2.1.2: - version "2.1.2" - resolved "https://registry.npmjs.org/bs58check/-/bs58check-2.1.2.tgz#53b018291228d82a5aa08e7d796fdafda54aebfc" - dependencies: - bs58 "^4.0.0" - create-hash "^1.1.0" - safe-buffer "^5.1.2" - bser@^2.0.0: version "2.0.0" resolved "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz#9ac78d3ed5d915804fd87acb158bc797147a1719" @@ -5969,19 +5957,6 @@ ethereumjs-wallet@0.6.0: utf8 "^2.1.1" uuid "^2.0.1" -ethereumjs-wallet@~0.6.0: - version "0.6.2" - resolved "https://registry.npmjs.org/ethereumjs-wallet/-/ethereumjs-wallet-0.6.2.tgz#67244b6af3e8113b53d709124b25477b64aeccda" - dependencies: - aes-js "^3.1.1" - bs58check "^2.1.2" - ethereumjs-util "^5.2.0" - hdkey "^1.0.0" - safe-buffer "^5.1.2" - scrypt.js "^0.2.0" - utf8 "^3.0.0" - uuid "^3.3.2" - ethers@~4.0.4: version "4.0.4" resolved "https://registry.yarnpkg.com/ethers/-/ethers-4.0.4.tgz#d3f85e8b27f4b59537e06526439b0fb15b44dc65" @@ -6790,7 +6765,7 @@ ganache-core@0xProject/ganache-core#monorepo-dep: ethereumjs-tx "0xProject/ethereumjs-tx#fake-tx-include-signature-by-default" ethereumjs-util "^5.2.0" ethereumjs-vm "2.3.5" - ethereumjs-wallet "~0.6.0" + ethereumjs-wallet "0.6.0" fake-merkle-patricia-tree "~1.0.1" heap "~0.2.6" js-scrypt "^0.2.0" @@ -7515,14 +7490,6 @@ hdkey@^0.7.0, hdkey@^0.7.1: coinstring "^2.0.0" secp256k1 "^3.0.1" -hdkey@^1.0.0: - version "1.1.0" - resolved "https://registry.npmjs.org/hdkey/-/hdkey-1.1.0.tgz#e74e7b01d2c47f797fa65d1d839adb7a44639f29" - dependencies: - coinstring "^2.0.0" - safe-buffer "^5.1.1" - secp256k1 "^3.0.1" - he@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd" @@ -15609,10 +15576,6 @@ utf8@^2.1.1: version "2.1.2" resolved "https://registry.yarnpkg.com/utf8/-/utf8-2.1.2.tgz#1fa0d9270e9be850d9b05027f63519bf46457d96" -utf8@^3.0.0: - version "3.0.0" - resolved "https://registry.npmjs.org/utf8/-/utf8-3.0.0.tgz#f052eed1364d696e769ef058b183df88c87f69d1" - util-deprecate@~1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf" -- cgit From f2a6feff29ea990eb3fbf22726a4ff772fd8bfbc Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 14 Nov 2018 15:10:47 -0800 Subject: fix(website): currentProvider called on undefined --- packages/website/ts/blockchain.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 25430c1c7..37f746f7c 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -591,7 +591,7 @@ export class Blockchain { } } else { const injectedWeb3IfExists = (window as any).web3; - if (!_.isUndefined(injectedWeb3IfExists.currentProvider)) { + if (!_.isUndefined(injectedWeb3IfExists) && !_.isUndefined(injectedWeb3IfExists.currentProvider)) { injectedProviderIfExists = injectedWeb3IfExists.currentProvider; } else { return undefined; -- cgit From 408bbdb52e90a213df6a21ccfc66c2972ca6c790 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 14 Nov 2018 15:13:07 -0800 Subject: fix(website): remove node env definition from webpack --- packages/website/webpack.config.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/website/webpack.config.js b/packages/website/webpack.config.js index ec265be93..33d5f648b 100644 --- a/packages/website/webpack.config.js +++ b/packages/website/webpack.config.js @@ -100,7 +100,6 @@ module.exports = (_env, argv) => { new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/), new webpack.DefinePlugin({ 'process.env': { - NODE_ENV: JSON.stringify(process.env.NODE_ENV), GIT_SHA: JSON.stringify(GIT_SHA), }, }), -- cgit From 8e81b0680f407519a789c4f3de6245a8bafd3e72 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 15:48:25 -0800 Subject: feat: expose webpack-dev-server content to local network --- packages/instant/package.json | 3 ++- packages/instant/webpack.config.js | 13 ++++++++++++- yarn.lock | 6 +++++- 3 files changed, 19 insertions(+), 3 deletions(-) diff --git a/packages/instant/package.json b/packages/instant/package.json index 3ad043c2b..23e1d57fe 100644 --- a/packages/instant/package.json +++ b/packages/instant/package.json @@ -52,9 +52,9 @@ "@0x/subproviders": "^2.1.4", "@0x/types": "^1.2.1", "@0x/typescript-typings": "^3.0.4", - "bowser": "^2.0.0-beta.3", "@0x/utils": "^2.0.5", "@0x/web3-wrapper": "^3.1.4", + "bowser": "^2.0.0-beta.3", "copy-to-clipboard": "^3.0.8", "ethereum-types": "^1.1.2", "lodash": "^4.17.10", @@ -83,6 +83,7 @@ "awesome-typescript-loader": "^5.2.1", "enzyme": "^3.6.0", "enzyme-adapter-react-16": "^1.5.0", + "ip": "^1.1.5", "jest": "^23.6.0", "make-promises-safe": "^1.1.0", "npm-run-all": "^4.1.2", diff --git a/packages/instant/webpack.config.js b/packages/instant/webpack.config.js index 78a33ce90..c566237e6 100644 --- a/packages/instant/webpack.config.js +++ b/packages/instant/webpack.config.js @@ -1,7 +1,8 @@ const path = require('path'); +const ip = require('ip'); // The common js bundle (not this one) is built using tsc. // The umd bundle (this one) has a different entrypoint. -module.exports = { +const config = { entry: './src/index.umd.ts', output: { filename: '[name].bundle.js', @@ -24,5 +25,15 @@ module.exports = { devServer: { contentBase: path.join(__dirname, 'public'), port: 5000, + host: '0.0.0.0', + after: () => { + if (config.devServer.host === '0.0.0.0') { + console.log( + `webpack-dev-server can be accessed externally at: ${ip.address()}:${config.devServer.port}`, + ); + } + }, }, }; + +module.exports = config; diff --git a/yarn.lock b/yarn.lock index 568ba5564..3ea8ad3f4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8001,10 +8001,14 @@ ip-regex@^2.1.0: version "2.1.0" resolved "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9" -ip@^1.1.0, ip@^1.1.5: +ip@^1.1.0: version "1.1.5" resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" +ip@^1.1.5: + version "1.1.5" + resolved "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" + ipaddr.js@1.6.0: version "1.6.0" resolved "https://registry.yarnpkg.com/ipaddr.js/-/ipaddr.js-1.6.0.tgz#e3fa357b773da619f26e95f049d055c72796f86b" -- cgit From b45167422b4b9167cb075cfbad9cff3260e7c80c Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:00:03 -0800 Subject: feat: use stable version of bowser --- packages/instant/package.json | 2 +- yarn.lock | 12 ++++-------- 2 files changed, 5 insertions(+), 9 deletions(-) diff --git a/packages/instant/package.json b/packages/instant/package.json index 23e1d57fe..6caa3902b 100644 --- a/packages/instant/package.json +++ b/packages/instant/package.json @@ -54,7 +54,7 @@ "@0x/typescript-typings": "^3.0.4", "@0x/utils": "^2.0.5", "@0x/web3-wrapper": "^3.1.4", - "bowser": "^2.0.0-beta.3", + "bowser": "^1.9.4", "copy-to-clipboard": "^3.0.8", "ethereum-types": "^1.1.2", "lodash": "^4.17.10", diff --git a/yarn.lock b/yarn.lock index 3ea8ad3f4..fc2297a57 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3201,9 +3201,9 @@ bowser@^1.7.3, bowser@^1.9.3: version "1.9.3" resolved "https://registry.yarnpkg.com/bowser/-/bowser-1.9.3.tgz#6643ae4d783f31683f6d23156976b74183862162" -bowser@^2.0.0-beta.3: - version "2.0.0-beta.3" - resolved "https://registry.npmjs.org/bowser/-/bowser-2.0.0-beta.3.tgz#1b74d4fd69199aa237bc0f1f4c5e80df711635d8" +bowser@^1.9.4: + version "1.9.4" + resolved "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz#890c58a2813a9d3243704334fa81b96a5c150c9a" boxen@^1.2.1: version "1.3.0" @@ -8001,11 +8001,7 @@ ip-regex@^2.1.0: version "2.1.0" resolved "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9" -ip@^1.1.0: - version "1.1.5" - resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" - -ip@^1.1.5: +ip@^1.1.0, ip@^1.1.5: version "1.1.5" resolved "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" -- cgit From d895b0296f2143452bfa3aa0c94fd0de34209435 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:15:29 -0800 Subject: feat: use blue for wallet prompt on mobile --- .../src/components/install_wallet_panel_content.tsx | 7 ++++++- packages/instant/src/components/payment_method.tsx | 6 +++++- packages/instant/src/components/wallet_prompt.tsx | 21 +++++++++++++++++---- packages/instant/src/style/theme.ts | 6 ++++-- 4 files changed, 32 insertions(+), 8 deletions(-) diff --git a/packages/instant/src/components/install_wallet_panel_content.tsx b/packages/instant/src/components/install_wallet_panel_content.tsx index 5cba8d996..3cc5ccc6b 100644 --- a/packages/instant/src/components/install_wallet_panel_content.tsx +++ b/packages/instant/src/components/install_wallet_panel_content.tsx @@ -104,7 +104,12 @@ export class InstallWalletPanelContent extends React.Component + ), diff --git a/packages/instant/src/components/payment_method.tsx b/packages/instant/src/components/payment_method.tsx index f9d02ec5b..662dd9d22 100644 --- a/packages/instant/src/components/payment_method.tsx +++ b/packages/instant/src/components/payment_method.tsx @@ -78,6 +78,9 @@ export class PaymentMethod extends React.Component { const { account, network } = this.props; const isMobile = envUtil.isMobileOperatingSystem(); const logo = isMobile ? : ; + const primaryColor = isMobile ? ColorOption.darkBlue : ColorOption.darkOrange; + const secondaryColor = isMobile ? ColorOption.lightBlue : ColorOption.lightOrange; + const colors = { primaryColor, secondaryColor }; switch (account.state) { case AccountState.Loading: // Just take up the same amount of space as the other states. @@ -87,13 +90,14 @@ export class PaymentMethod extends React.Component { } + {...colors} > Please Unlock {this.props.walletName} ); case AccountState.None: return ( - + {isMobile ? 'Install Coinbase Wallet' : 'Install MetaMask'} ); diff --git a/packages/instant/src/components/wallet_prompt.tsx b/packages/instant/src/components/wallet_prompt.tsx index bcf66ee81..a0b3ae457 100644 --- a/packages/instant/src/components/wallet_prompt.tsx +++ b/packages/instant/src/components/wallet_prompt.tsx @@ -9,13 +9,21 @@ import { Text } from './ui/text'; export interface WalletPromptProps { image: React.ReactNode; onClick?: () => void; + primaryColor: ColorOption; + secondaryColor: ColorOption; } -export const WalletPrompt: React.StatelessComponent = ({ onClick, image, children }) => ( +export const WalletPrompt: React.StatelessComponent = ({ + onClick, + image, + children, + secondaryColor, + primaryColor, +}) => ( = ({ onCl {image} - + {children} ); + +WalletPrompt.defaultProps = { + primaryColor: ColorOption.darkOrange, + secondaryColor: ColorOption.lightOrange, +}; diff --git a/packages/instant/src/style/theme.ts b/packages/instant/src/style/theme.ts index 489f11dc3..a0751286b 100644 --- a/packages/instant/src/style/theme.ts +++ b/packages/instant/src/style/theme.ts @@ -17,7 +17,8 @@ export enum ColorOption { darkOrange = 'darkOrange', green = 'green', red = 'red', - blue = 'blue', + darkBlue = 'darkBlue', + lightBlue = 'lightBlue', } export const theme: Theme = { @@ -33,7 +34,8 @@ export const theme: Theme = { darkOrange: '#F2994C', green: '#3CB34F', red: '#D00000', - blue: '#135df6', + darkBlue: '#135df6', + lightBlue: '#F2F7FF', }; export const transparentWhite = 'rgba(255,255,255,0.3)'; -- cgit From b2a26ef21a3fef2cbb4373a2896f552033af046c Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:18:16 -0800 Subject: chore: remove wallet panel content for mobile --- .../components/install_wallet_panel_content.tsx | 52 +--------------------- 1 file changed, 1 insertion(+), 51 deletions(-) diff --git a/packages/instant/src/components/install_wallet_panel_content.tsx b/packages/instant/src/components/install_wallet_panel_content.tsx index 3cc5ccc6b..88c26f59c 100644 --- a/packages/instant/src/components/install_wallet_panel_content.tsx +++ b/packages/instant/src/components/install_wallet_panel_content.tsx @@ -1,19 +1,15 @@ import * as React from 'react'; import { - COINBASE_WALLET_ANDROID_APP_STORE_URL, - COINBASE_WALLET_IOS_APP_STORE_URL, - COINBASE_WALLET_SITE_URL, META_MASK_CHROME_STORE_URL, META_MASK_FIREFOX_STORE_URL, META_MASK_OPERA_STORE_URL, META_MASK_SITE_URL, } from '../constants'; import { ColorOption } from '../style/theme'; -import { Browser, OperatingSystem } from '../types'; +import { Browser } from '../types'; import { envUtil } from '../util/env'; -import { CoinbaseWalletLogo } from './coinbase_wallet_logo'; import { MetaMaskLogo } from './meta_mask_logo'; import { StandardPanelContent, StandardPanelContentProps } from './standard_panel_content'; import { Button } from './ui/button'; @@ -26,14 +22,6 @@ export class InstallWalletPanelContent extends React.Component; } private readonly _getStandardPanelContentProps = (): StandardPanelContentProps => { - const isMobileOS = envUtil.isMobileOperatingSystem(); - if (isMobileOS) { - return this._getMobilePanelContentProps(); - } else { - return this._getDesktopPanelContentProps(); - } - }; - private readonly _getDesktopPanelContentProps = (): StandardPanelContentProps => { const browser = envUtil.getBrowser(); let description = 'Please install the MetaMask wallet browser extension.'; let actionText = 'Learn More'; @@ -77,42 +65,4 @@ export class InstallWalletPanelContent extends React.Component { - const operatingSystem = envUtil.getOperatingSystem(); - let description = 'Please install the Coinbase Wallet app.'; - let actionText = 'Learn More'; - let actionUrl = COINBASE_WALLET_SITE_URL; - switch (operatingSystem) { - case OperatingSystem.Android: - description = 'Please install the Coinbase Wallet app from the Google Play Store.'; - actionText = 'Get Coinbase Wallet'; - actionUrl = COINBASE_WALLET_ANDROID_APP_STORE_URL; - break; - case OperatingSystem.iOS: - description = 'Please install the Coinbase Wallet app from the iOS App Store.'; - actionText = 'Get Coinbase Wallet'; - actionUrl = COINBASE_WALLET_IOS_APP_STORE_URL; - break; - default: - break; - } - return { - image: , - description, - moreInfoSettings: { - href: COINBASE_WALLET_SITE_URL, - text: 'What is Coinbase Wallet?', - }, - action: ( - - ), - }; - }; } -- cgit From 39bb855a9c5e0c95601bf26effb0317a627d2e12 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:27:27 -0800 Subject: feat: make onUnlockWalletClick different based on ON --- .../src/components/coinbase_wallet_logo.tsx | 33 +++------------------- packages/instant/src/components/payment_method.tsx | 33 +++++++++++++++++++--- .../containers/connected_account_payment_method.ts | 27 ++++++++++++++++-- 3 files changed, 58 insertions(+), 35 deletions(-) diff --git a/packages/instant/src/components/coinbase_wallet_logo.tsx b/packages/instant/src/components/coinbase_wallet_logo.tsx index f3c9ccdc2..845b96d73 100644 --- a/packages/instant/src/components/coinbase_wallet_logo.tsx +++ b/packages/instant/src/components/coinbase_wallet_logo.tsx @@ -5,22 +5,13 @@ export interface CoinbaseWalletLogoProps { } export const CoinbaseWalletLogo: React.StatelessComponent = ({ width }) => ( - - + + - ); @@ -30,19 +21,3 @@ CoinbaseWalletLogo.displayName = 'CoinbaseWalletLogo'; CoinbaseWalletLogo.defaultProps = { width: 164, }; - -export interface CoinbaseWalletAppLogoProps { - width?: number; -} - -export const CoinbaseWalletAppLogo: React.StatelessComponent = ({ width }) => ( - - - - -); diff --git a/packages/instant/src/components/payment_method.tsx b/packages/instant/src/components/payment_method.tsx index 662dd9d22..21bb2902b 100644 --- a/packages/instant/src/components/payment_method.tsx +++ b/packages/instant/src/components/payment_method.tsx @@ -1,11 +1,16 @@ import * as _ from 'lodash'; import * as React from 'react'; +import { + COINBASE_WALLET_ANDROID_APP_STORE_URL, + COINBASE_WALLET_IOS_APP_STORE_URL, + COINBASE_WALLET_SITE_URL, +} from '../constants'; import { ColorOption } from '../style/theme'; -import { Account, AccountState, Network } from '../types'; +import { Account, AccountState, Network, OperatingSystem } from '../types'; import { envUtil } from '../util/env'; -import { CoinbaseWalletAppLogo } from './coinbase_wallet_logo'; +import { CoinbaseWalletLogo } from './coinbase_wallet_logo'; import { MetaMaskLogo } from './meta_mask_logo'; import { PaymentMethodDropdown } from './payment_method_dropdown'; import { Circle } from './ui/circle'; @@ -77,7 +82,7 @@ export class PaymentMethod extends React.Component { private readonly _renderMainContent = (): React.ReactNode => { const { account, network } = this.props; const isMobile = envUtil.isMobileOperatingSystem(); - const logo = isMobile ? : ; + const logo = isMobile ? : ; const primaryColor = isMobile ? ColorOption.darkBlue : ColorOption.darkOrange; const secondaryColor = isMobile ? ColorOption.lightBlue : ColorOption.lightOrange; const colors = { primaryColor, secondaryColor }; @@ -97,7 +102,7 @@ export class PaymentMethod extends React.Component { ); case AccountState.None: return ( - + {isMobile ? 'Install Coinbase Wallet' : 'Install MetaMask'} ); @@ -111,4 +116,24 @@ export class PaymentMethod extends React.Component { ); } }; + private readonly _handleInstallWalletClick = (): void => { + const isMobile = envUtil.isMobileOperatingSystem(); + if (!isMobile) { + this.props.onInstallWalletClick(); + return; + } + const operatingSystem = envUtil.getOperatingSystem(); + let url = COINBASE_WALLET_SITE_URL; + switch (operatingSystem) { + case OperatingSystem.Android: + url = COINBASE_WALLET_ANDROID_APP_STORE_URL; + break; + case OperatingSystem.iOS: + url = COINBASE_WALLET_IOS_APP_STORE_URL; + break; + default: + break; + } + window.open(url, '_blank'); + }; } diff --git a/packages/instant/src/containers/connected_account_payment_method.ts b/packages/instant/src/containers/connected_account_payment_method.ts index 69c2ddf19..beaaccf2f 100644 --- a/packages/instant/src/containers/connected_account_payment_method.ts +++ b/packages/instant/src/containers/connected_account_payment_method.ts @@ -3,10 +3,16 @@ import { connect } from 'react-redux'; import { Dispatch } from 'redux'; import { PaymentMethod, PaymentMethodProps } from '../components/payment_method'; +import { + COINBASE_WALLET_ANDROID_APP_STORE_URL, + COINBASE_WALLET_IOS_APP_STORE_URL, + COINBASE_WALLET_SITE_URL, +} from '../constants'; import { Action, actions } from '../redux/actions'; import { asyncData } from '../redux/async_data'; import { State } from '../redux/reducer'; -import { Network, Omit, ProviderState, StandardSlidingPanelContent } from '../types'; +import { Network, Omit, OperatingSystem, ProviderState, StandardSlidingPanelContent } from '../types'; +import { envUtil } from '../util/env'; export interface ConnectedAccountPaymentMethodProps {} @@ -49,7 +55,24 @@ const mergeProps = ( onInstallWalletClick: connectedDispatch.onInstallWalletClick, walletName: connectedState.providerState.name, onUnlockWalletClick: () => { - connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState); + const isMobile = envUtil.isMobileOperatingSystem(); + if (!isMobile) { + connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState); + return; + } + const operatingSystem = envUtil.getOperatingSystem(); + let url = COINBASE_WALLET_SITE_URL; + switch (operatingSystem) { + case OperatingSystem.Android: + url = COINBASE_WALLET_ANDROID_APP_STORE_URL; + break; + case OperatingSystem.iOS: + url = COINBASE_WALLET_IOS_APP_STORE_URL; + break; + default: + break; + } + window.open(url, '_blank'); }, }); -- cgit From 633d17ffdeed4cd950f9d55f58b572f96390a63a Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 15 Nov 2018 09:41:20 -0800 Subject: fix: add http to external url string --- packages/instant/webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/instant/webpack.config.js b/packages/instant/webpack.config.js index c566237e6..3129e13a6 100644 --- a/packages/instant/webpack.config.js +++ b/packages/instant/webpack.config.js @@ -29,7 +29,7 @@ const config = { after: () => { if (config.devServer.host === '0.0.0.0') { console.log( - `webpack-dev-server can be accessed externally at: ${ip.address()}:${config.devServer.port}`, + `webpack-dev-server can be accessed externally at: http://${ip.address()}:${config.devServer.port}`, ); } }, -- cgit From b01db9141b90ed98c48c62823b6553873f940d0b Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:00:03 -0800 Subject: feat: use stable version of bowser --- packages/instant/package.json | 2 +- yarn.lock | 12 ++++-------- 2 files changed, 5 insertions(+), 9 deletions(-) diff --git a/packages/instant/package.json b/packages/instant/package.json index 23e1d57fe..6caa3902b 100644 --- a/packages/instant/package.json +++ b/packages/instant/package.json @@ -54,7 +54,7 @@ "@0x/typescript-typings": "^3.0.4", "@0x/utils": "^2.0.5", "@0x/web3-wrapper": "^3.1.4", - "bowser": "^2.0.0-beta.3", + "bowser": "^1.9.4", "copy-to-clipboard": "^3.0.8", "ethereum-types": "^1.1.2", "lodash": "^4.17.10", diff --git a/yarn.lock b/yarn.lock index 63d1fb7b1..e4304acd5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3197,9 +3197,9 @@ bowser@^1.7.3, bowser@^1.9.3: version "1.9.3" resolved "https://registry.yarnpkg.com/bowser/-/bowser-1.9.3.tgz#6643ae4d783f31683f6d23156976b74183862162" -bowser@^2.0.0-beta.3: - version "2.0.0-beta.3" - resolved "https://registry.npmjs.org/bowser/-/bowser-2.0.0-beta.3.tgz#1b74d4fd69199aa237bc0f1f4c5e80df711635d8" +bowser@^1.9.4: + version "1.9.4" + resolved "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz#890c58a2813a9d3243704334fa81b96a5c150c9a" boxen@^1.2.1: version "1.3.0" @@ -7968,11 +7968,7 @@ ip-regex@^2.1.0: version "2.1.0" resolved "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9" -ip@^1.1.0: - version "1.1.5" - resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" - -ip@^1.1.5: +ip@^1.1.0, ip@^1.1.5: version "1.1.5" resolved "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a" -- cgit From 29747a04874579d194f7f039b77bfcbcf33ed0c6 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:15:29 -0800 Subject: feat: use blue for wallet prompt on mobile --- .../src/components/install_wallet_panel_content.tsx | 7 ++++++- packages/instant/src/components/payment_method.tsx | 6 +++++- packages/instant/src/components/wallet_prompt.tsx | 21 +++++++++++++++++---- packages/instant/src/style/theme.ts | 6 ++++-- 4 files changed, 32 insertions(+), 8 deletions(-) diff --git a/packages/instant/src/components/install_wallet_panel_content.tsx b/packages/instant/src/components/install_wallet_panel_content.tsx index 5cba8d996..3cc5ccc6b 100644 --- a/packages/instant/src/components/install_wallet_panel_content.tsx +++ b/packages/instant/src/components/install_wallet_panel_content.tsx @@ -104,7 +104,12 @@ export class InstallWalletPanelContent extends React.Component + ), diff --git a/packages/instant/src/components/payment_method.tsx b/packages/instant/src/components/payment_method.tsx index f9d02ec5b..662dd9d22 100644 --- a/packages/instant/src/components/payment_method.tsx +++ b/packages/instant/src/components/payment_method.tsx @@ -78,6 +78,9 @@ export class PaymentMethod extends React.Component { const { account, network } = this.props; const isMobile = envUtil.isMobileOperatingSystem(); const logo = isMobile ? : ; + const primaryColor = isMobile ? ColorOption.darkBlue : ColorOption.darkOrange; + const secondaryColor = isMobile ? ColorOption.lightBlue : ColorOption.lightOrange; + const colors = { primaryColor, secondaryColor }; switch (account.state) { case AccountState.Loading: // Just take up the same amount of space as the other states. @@ -87,13 +90,14 @@ export class PaymentMethod extends React.Component { } + {...colors} > Please Unlock {this.props.walletName} ); case AccountState.None: return ( - + {isMobile ? 'Install Coinbase Wallet' : 'Install MetaMask'} ); diff --git a/packages/instant/src/components/wallet_prompt.tsx b/packages/instant/src/components/wallet_prompt.tsx index bcf66ee81..a0b3ae457 100644 --- a/packages/instant/src/components/wallet_prompt.tsx +++ b/packages/instant/src/components/wallet_prompt.tsx @@ -9,13 +9,21 @@ import { Text } from './ui/text'; export interface WalletPromptProps { image: React.ReactNode; onClick?: () => void; + primaryColor: ColorOption; + secondaryColor: ColorOption; } -export const WalletPrompt: React.StatelessComponent = ({ onClick, image, children }) => ( +export const WalletPrompt: React.StatelessComponent = ({ + onClick, + image, + children, + secondaryColor, + primaryColor, +}) => ( = ({ onCl {image} - + {children} ); + +WalletPrompt.defaultProps = { + primaryColor: ColorOption.darkOrange, + secondaryColor: ColorOption.lightOrange, +}; diff --git a/packages/instant/src/style/theme.ts b/packages/instant/src/style/theme.ts index 489f11dc3..a0751286b 100644 --- a/packages/instant/src/style/theme.ts +++ b/packages/instant/src/style/theme.ts @@ -17,7 +17,8 @@ export enum ColorOption { darkOrange = 'darkOrange', green = 'green', red = 'red', - blue = 'blue', + darkBlue = 'darkBlue', + lightBlue = 'lightBlue', } export const theme: Theme = { @@ -33,7 +34,8 @@ export const theme: Theme = { darkOrange: '#F2994C', green: '#3CB34F', red: '#D00000', - blue: '#135df6', + darkBlue: '#135df6', + lightBlue: '#F2F7FF', }; export const transparentWhite = 'rgba(255,255,255,0.3)'; -- cgit From f4cc152cfb6da5c13d2d95ccd2f1a022af9b91a0 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:18:16 -0800 Subject: chore: remove wallet panel content for mobile --- .../components/install_wallet_panel_content.tsx | 52 +--------------------- 1 file changed, 1 insertion(+), 51 deletions(-) diff --git a/packages/instant/src/components/install_wallet_panel_content.tsx b/packages/instant/src/components/install_wallet_panel_content.tsx index 3cc5ccc6b..88c26f59c 100644 --- a/packages/instant/src/components/install_wallet_panel_content.tsx +++ b/packages/instant/src/components/install_wallet_panel_content.tsx @@ -1,19 +1,15 @@ import * as React from 'react'; import { - COINBASE_WALLET_ANDROID_APP_STORE_URL, - COINBASE_WALLET_IOS_APP_STORE_URL, - COINBASE_WALLET_SITE_URL, META_MASK_CHROME_STORE_URL, META_MASK_FIREFOX_STORE_URL, META_MASK_OPERA_STORE_URL, META_MASK_SITE_URL, } from '../constants'; import { ColorOption } from '../style/theme'; -import { Browser, OperatingSystem } from '../types'; +import { Browser } from '../types'; import { envUtil } from '../util/env'; -import { CoinbaseWalletLogo } from './coinbase_wallet_logo'; import { MetaMaskLogo } from './meta_mask_logo'; import { StandardPanelContent, StandardPanelContentProps } from './standard_panel_content'; import { Button } from './ui/button'; @@ -26,14 +22,6 @@ export class InstallWalletPanelContent extends React.Component; } private readonly _getStandardPanelContentProps = (): StandardPanelContentProps => { - const isMobileOS = envUtil.isMobileOperatingSystem(); - if (isMobileOS) { - return this._getMobilePanelContentProps(); - } else { - return this._getDesktopPanelContentProps(); - } - }; - private readonly _getDesktopPanelContentProps = (): StandardPanelContentProps => { const browser = envUtil.getBrowser(); let description = 'Please install the MetaMask wallet browser extension.'; let actionText = 'Learn More'; @@ -77,42 +65,4 @@ export class InstallWalletPanelContent extends React.Component { - const operatingSystem = envUtil.getOperatingSystem(); - let description = 'Please install the Coinbase Wallet app.'; - let actionText = 'Learn More'; - let actionUrl = COINBASE_WALLET_SITE_URL; - switch (operatingSystem) { - case OperatingSystem.Android: - description = 'Please install the Coinbase Wallet app from the Google Play Store.'; - actionText = 'Get Coinbase Wallet'; - actionUrl = COINBASE_WALLET_ANDROID_APP_STORE_URL; - break; - case OperatingSystem.iOS: - description = 'Please install the Coinbase Wallet app from the iOS App Store.'; - actionText = 'Get Coinbase Wallet'; - actionUrl = COINBASE_WALLET_IOS_APP_STORE_URL; - break; - default: - break; - } - return { - image: , - description, - moreInfoSettings: { - href: COINBASE_WALLET_SITE_URL, - text: 'What is Coinbase Wallet?', - }, - action: ( - - ), - }; - }; } -- cgit From f9e012398606a85d286087f3e94bf8b95a52df55 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 14 Nov 2018 16:27:27 -0800 Subject: feat: make onUnlockWalletClick different based on ON --- .../src/components/coinbase_wallet_logo.tsx | 33 +++------------------- packages/instant/src/components/payment_method.tsx | 33 +++++++++++++++++++--- .../containers/connected_account_payment_method.ts | 27 ++++++++++++++++-- 3 files changed, 58 insertions(+), 35 deletions(-) diff --git a/packages/instant/src/components/coinbase_wallet_logo.tsx b/packages/instant/src/components/coinbase_wallet_logo.tsx index f3c9ccdc2..845b96d73 100644 --- a/packages/instant/src/components/coinbase_wallet_logo.tsx +++ b/packages/instant/src/components/coinbase_wallet_logo.tsx @@ -5,22 +5,13 @@ export interface CoinbaseWalletLogoProps { } export const CoinbaseWalletLogo: React.StatelessComponent = ({ width }) => ( - - + + - ); @@ -30,19 +21,3 @@ CoinbaseWalletLogo.displayName = 'CoinbaseWalletLogo'; CoinbaseWalletLogo.defaultProps = { width: 164, }; - -export interface CoinbaseWalletAppLogoProps { - width?: number; -} - -export const CoinbaseWalletAppLogo: React.StatelessComponent = ({ width }) => ( - - - - -); diff --git a/packages/instant/src/components/payment_method.tsx b/packages/instant/src/components/payment_method.tsx index 662dd9d22..21bb2902b 100644 --- a/packages/instant/src/components/payment_method.tsx +++ b/packages/instant/src/components/payment_method.tsx @@ -1,11 +1,16 @@ import * as _ from 'lodash'; import * as React from 'react'; +import { + COINBASE_WALLET_ANDROID_APP_STORE_URL, + COINBASE_WALLET_IOS_APP_STORE_URL, + COINBASE_WALLET_SITE_URL, +} from '../constants'; import { ColorOption } from '../style/theme'; -import { Account, AccountState, Network } from '../types'; +import { Account, AccountState, Network, OperatingSystem } from '../types'; import { envUtil } from '../util/env'; -import { CoinbaseWalletAppLogo } from './coinbase_wallet_logo'; +import { CoinbaseWalletLogo } from './coinbase_wallet_logo'; import { MetaMaskLogo } from './meta_mask_logo'; import { PaymentMethodDropdown } from './payment_method_dropdown'; import { Circle } from './ui/circle'; @@ -77,7 +82,7 @@ export class PaymentMethod extends React.Component { private readonly _renderMainContent = (): React.ReactNode => { const { account, network } = this.props; const isMobile = envUtil.isMobileOperatingSystem(); - const logo = isMobile ? : ; + const logo = isMobile ? : ; const primaryColor = isMobile ? ColorOption.darkBlue : ColorOption.darkOrange; const secondaryColor = isMobile ? ColorOption.lightBlue : ColorOption.lightOrange; const colors = { primaryColor, secondaryColor }; @@ -97,7 +102,7 @@ export class PaymentMethod extends React.Component { ); case AccountState.None: return ( - + {isMobile ? 'Install Coinbase Wallet' : 'Install MetaMask'} ); @@ -111,4 +116,24 @@ export class PaymentMethod extends React.Component { ); } }; + private readonly _handleInstallWalletClick = (): void => { + const isMobile = envUtil.isMobileOperatingSystem(); + if (!isMobile) { + this.props.onInstallWalletClick(); + return; + } + const operatingSystem = envUtil.getOperatingSystem(); + let url = COINBASE_WALLET_SITE_URL; + switch (operatingSystem) { + case OperatingSystem.Android: + url = COINBASE_WALLET_ANDROID_APP_STORE_URL; + break; + case OperatingSystem.iOS: + url = COINBASE_WALLET_IOS_APP_STORE_URL; + break; + default: + break; + } + window.open(url, '_blank'); + }; } diff --git a/packages/instant/src/containers/connected_account_payment_method.ts b/packages/instant/src/containers/connected_account_payment_method.ts index 69c2ddf19..beaaccf2f 100644 --- a/packages/instant/src/containers/connected_account_payment_method.ts +++ b/packages/instant/src/containers/connected_account_payment_method.ts @@ -3,10 +3,16 @@ import { connect } from 'react-redux'; import { Dispatch } from 'redux'; import { PaymentMethod, PaymentMethodProps } from '../components/payment_method'; +import { + COINBASE_WALLET_ANDROID_APP_STORE_URL, + COINBASE_WALLET_IOS_APP_STORE_URL, + COINBASE_WALLET_SITE_URL, +} from '../constants'; import { Action, actions } from '../redux/actions'; import { asyncData } from '../redux/async_data'; import { State } from '../redux/reducer'; -import { Network, Omit, ProviderState, StandardSlidingPanelContent } from '../types'; +import { Network, Omit, OperatingSystem, ProviderState, StandardSlidingPanelContent } from '../types'; +import { envUtil } from '../util/env'; export interface ConnectedAccountPaymentMethodProps {} @@ -49,7 +55,24 @@ const mergeProps = ( onInstallWalletClick: connectedDispatch.onInstallWalletClick, walletName: connectedState.providerState.name, onUnlockWalletClick: () => { - connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState); + const isMobile = envUtil.isMobileOperatingSystem(); + if (!isMobile) { + connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState); + return; + } + const operatingSystem = envUtil.getOperatingSystem(); + let url = COINBASE_WALLET_SITE_URL; + switch (operatingSystem) { + case OperatingSystem.Android: + url = COINBASE_WALLET_ANDROID_APP_STORE_URL; + break; + case OperatingSystem.iOS: + url = COINBASE_WALLET_IOS_APP_STORE_URL; + break; + default: + break; + } + window.open(url, '_blank'); }, }); -- cgit From 4da574560d50f661227ec4d91acf20917c26b17b Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 15 Nov 2018 12:40:28 -0800 Subject: fix: remove redundant handler --- packages/instant/src/components/payment_method.tsx | 22 +--------------------- .../containers/connected_account_payment_method.ts | 10 +++++----- 2 files changed, 6 insertions(+), 26 deletions(-) diff --git a/packages/instant/src/components/payment_method.tsx b/packages/instant/src/components/payment_method.tsx index 21bb2902b..66ebe1f20 100644 --- a/packages/instant/src/components/payment_method.tsx +++ b/packages/instant/src/components/payment_method.tsx @@ -102,7 +102,7 @@ export class PaymentMethod extends React.Component { ); case AccountState.None: return ( - + {isMobile ? 'Install Coinbase Wallet' : 'Install MetaMask'} ); @@ -116,24 +116,4 @@ export class PaymentMethod extends React.Component { ); } }; - private readonly _handleInstallWalletClick = (): void => { - const isMobile = envUtil.isMobileOperatingSystem(); - if (!isMobile) { - this.props.onInstallWalletClick(); - return; - } - const operatingSystem = envUtil.getOperatingSystem(); - let url = COINBASE_WALLET_SITE_URL; - switch (operatingSystem) { - case OperatingSystem.Android: - url = COINBASE_WALLET_ANDROID_APP_STORE_URL; - break; - case OperatingSystem.iOS: - url = COINBASE_WALLET_IOS_APP_STORE_URL; - break; - default: - break; - } - window.open(url, '_blank'); - }; } diff --git a/packages/instant/src/containers/connected_account_payment_method.ts b/packages/instant/src/containers/connected_account_payment_method.ts index beaaccf2f..eacbadfca 100644 --- a/packages/instant/src/containers/connected_account_payment_method.ts +++ b/packages/instant/src/containers/connected_account_payment_method.ts @@ -22,7 +22,7 @@ interface ConnectedState { } interface ConnectedDispatch { - onInstallWalletClick: () => void; + openInstallWalletPanel: () => void; unlockWalletAndDispatchToStore: (providerState: ProviderState) => void; } @@ -39,7 +39,7 @@ const mapDispatchToProps = ( dispatch: Dispatch, ownProps: ConnectedAccountPaymentMethodProps, ): ConnectedDispatch => ({ - onInstallWalletClick: () => dispatch(actions.openStandardSlidingPanel(StandardSlidingPanelContent.InstallWallet)), + openInstallWalletPanel: () => dispatch(actions.openStandardSlidingPanel(StandardSlidingPanelContent.InstallWallet)), unlockWalletAndDispatchToStore: async (providerState: ProviderState) => asyncData.fetchAccountInfoAndDispatchToStore(providerState, dispatch, true), }); @@ -52,12 +52,12 @@ const mergeProps = ( ...ownProps, network: connectedState.network, account: connectedState.providerState.account, - onInstallWalletClick: connectedDispatch.onInstallWalletClick, walletName: connectedState.providerState.name, - onUnlockWalletClick: () => { + onUnlockWalletClick: () => connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState), + onInstallWalletClick: () => { const isMobile = envUtil.isMobileOperatingSystem(); if (!isMobile) { - connectedDispatch.unlockWalletAndDispatchToStore(connectedState.providerState); + connectedDispatch.openInstallWalletPanel(); return; } const operatingSystem = envUtil.getOperatingSystem(); -- cgit From fd4a782bdd5e3e87e731d5288eb1bafa402295bc Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Thu, 15 Nov 2018 20:47:11 +0000 Subject: Update call-to-action links --- packages/website/ts/pages/launch_kit/launch_kit.tsx | 8 ++++---- packages/website/ts/utils/constants.ts | 2 ++ 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx index 208e84b12..1e798f093 100644 --- a/packages/website/ts/pages/launch_kit/launch_kit.tsx +++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx @@ -127,7 +127,7 @@ export class LaunchKit extends React.Component { className={`flex clearfix sm-mx-auto ${isSmallScreen ? 'justify-center' : ''}`} > - +
- +
-
; +
{this._renderBenefits(BENEFITS_1)}
); -- cgit From cb3e7b41206d1ef4a466cbac31c9b3e0274244b3 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 16 Nov 2018 17:38:30 +0000 Subject: Fix capitalization in title --- packages/website/ts/pages/launch_kit/launch_kit.tsx | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx index 8c80fdf83..c34b86679 100644 --- a/packages/website/ts/pages/launch_kit/launch_kit.tsx +++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx @@ -204,7 +204,7 @@ export class LaunchKit extends React.Component { paddingRight="10px" > - {this.props.translate.get(Key.PerfectForDevelopers, Deco.CapWords)} + {this.props.translate.get(Key.PerfectForDevelopers, Deco.Cap)} {this._renderBenefits(BENEFITS_2)} @@ -309,8 +309,15 @@ export class LaunchKit extends React.Component { - See the Apache License, Version 2.0 (http://www.apache.org/licenses/LICENSE-2.0) for the - specific language governing all applicable permissions and limitations. + See the{' '} + + Apache License, Version 2.0 + {' '} + for the specific language governing all applicable permissions and limitations. -- cgit From a3ccd42093968899a3adb93ae261771131cdee70 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 16 Nov 2018 17:38:39 +0000 Subject: Add Apache license link --- packages/website/ts/utils/constants.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/website/ts/utils/constants.ts b/packages/website/ts/utils/constants.ts index afd54ba6f..e9afc8763 100644 --- a/packages/website/ts/utils/constants.ts +++ b/packages/website/ts/utils/constants.ts @@ -72,6 +72,7 @@ export const constants = { PROJECT_URL_OPEN_ANX: 'https://www.openanx.org', PROJECT_URL_IDT: 'https://kinalpha.com', URL_ANGELLIST: 'https://angel.co/0xproject/jobs', + URL_APACHE_LICENSE: 'http://www.apache.org/licenses/LICENSE-2.0', URL_BITLY_API: 'https://api-ssl.bitly.com', URL_BLOG: 'https://blog.0xproject.com/latest', URL_DISCOURSE_FORUM: 'https://forum.0xproject.com', -- cgit From c5d208c90eeafdaa9b4aee3813eb28b310312f33 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 16 Nov 2018 17:44:52 +0000 Subject: Add smart contract docs to Developer Home --- packages/website/ts/pages/documentation/docs_home.tsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/packages/website/ts/pages/documentation/docs_home.tsx b/packages/website/ts/pages/documentation/docs_home.tsx index ebe8cece4..9faa930fc 100644 --- a/packages/website/ts/pages/documentation/docs_home.tsx +++ b/packages/website/ts/pages/documentation/docs_home.tsx @@ -74,6 +74,14 @@ const CATEGORY_TO_PACKAGES: ObjectMap = { shouldOpenInNewTab: true, }, }, + { + description: + 'Reference documentation for the 0x smart contracts. Helpful for dApp developer wanting to integrate 0x at the smart contract level.', + link: { + title: '0x smart contracts', + to: WebsitePaths.SmartContracts, + }, + }, { description: 'An http & websocket client for interacting with relayers that have implemented the [Standard Relayer API](https://github.com/0xProject/standard-relayer-api)', -- cgit From 1626e284cd6488663ad1be03f0d8f72afced7afb Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 16 Nov 2018 18:00:53 +0000 Subject: Fix disclaimer on mobile --- packages/website/ts/pages/launch_kit/launch_kit.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/website/ts/pages/launch_kit/launch_kit.tsx b/packages/website/ts/pages/launch_kit/launch_kit.tsx index c34b86679..4ea56dbd4 100644 --- a/packages/website/ts/pages/launch_kit/launch_kit.tsx +++ b/packages/website/ts/pages/launch_kit/launch_kit.tsx @@ -298,7 +298,7 @@ export class LaunchKit extends React.Component { paddingTop="70px" paddingBottom="70px" > - + Disclaimer: The laws and regulations applicable to the use and exchange of digital assets and blockchain-native tokens, including through any software developed using the licensed work -- cgit