From 3a7f26f6200bd3796a5207f62c0bdd18858db0e1 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 1 Jun 2018 11:04:56 -0700 Subject: Have basic newsletter subscribe form working --- .../website/ts/components/forms/subscribe_form.tsx | 68 ++++++++++++++++++++++ packages/website/ts/components/token_balances.tsx | 2 +- packages/website/ts/pages/landing/landing.tsx | 2 + packages/website/ts/utils/backend_client.ts | 8 +++ packages/website/ts/utils/fetch_utils.ts | 12 ++++ packages/website/ts/utils/utils.ts | 3 +- 6 files changed, 93 insertions(+), 2 deletions(-) create mode 100644 packages/website/ts/components/forms/subscribe_form.tsx diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx new file mode 100644 index 000000000..8bb0f4fc7 --- /dev/null +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -0,0 +1,68 @@ +import { colors } from '@0xproject/react-shared'; +import * as React from 'react'; + +import RaisedButton from 'material-ui/RaisedButton'; +import { backendClient } from 'ts/utils/backend_client'; + +export interface SubscribeFormProps {} + +export enum SubscribeFormStatus { + None, + Error, + Success, + Loading, +} + +export interface SubscribeFormState { + emailText: string; + status: SubscribeFormStatus; +} + +export class SubscribeForm extends React.Component { + public state = { + emailText: '', + status: SubscribeFormStatus.None, + }; + public render(): React.ReactNode { + return ( +
+ Subscribe to our newsletter for 0x relayer and dApp updates +
+ + +
+
+ ); + } + private _handleEmailInputChange(event: React.ChangeEvent): void { + this.setState({ emailText: event.target.value }); + } + private async _handleSubscribeClickAsync(): Promise { + this._setStatus(SubscribeFormStatus.Loading); + const success = await backendClient.subscribeToNewsletterAsync(this.state.emailText); + const status = success ? SubscribeFormStatus.Success : SubscribeFormStatus.Error; + this._setStatus(status); + } + private _setStatus(status: SubscribeFormStatus): void { + this.setState({ status }); + } +} diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index f5a51dabb..022968941 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -77,11 +77,11 @@ interface TokenBalancesProps { interface TokenBalancesState { errorType: BalanceErrs; + trackedTokenStateByAddress: TokenStateByAddress; isBalanceSpinnerVisible: boolean; isZRXSpinnerVisible: boolean; isTokenPickerOpen: boolean; isAddingToken: boolean; - trackedTokenStateByAddress: TokenStateByAddress; } export class TokenBalances extends React.Component { diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 02ecfa117..016c62a30 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -5,6 +5,7 @@ import * as React from 'react'; import DocumentTitle = require('react-document-title'); import { Link } from 'react-router-dom'; import { Footer } from 'ts/components/footer'; +import { SubscribeForm } from 'ts/components/forms/subscribe_form'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; @@ -298,6 +299,7 @@ export class Landing extends React.Component { + diff --git a/packages/website/ts/utils/backend_client.ts b/packages/website/ts/utils/backend_client.ts index c440b1604..fb7c21c59 100644 --- a/packages/website/ts/utils/backend_client.ts +++ b/packages/website/ts/utils/backend_client.ts @@ -8,6 +8,7 @@ const ETH_GAS_STATION_ENDPOINT = '/eth_gas_station'; const PRICES_ENDPOINT = '/prices'; const RELAYERS_ENDPOINT = '/relayers'; const WIKI_ENDPOINT = '/wiki'; +const SUBSCRIBE_SUBSTACK_NEWSLETTER_ENDPOINT = '/newsletter_subscriber/substack'; export const backendClient = { async getGasInfoAsync(): Promise { @@ -33,4 +34,11 @@ export const backendClient = { const result = await fetchUtils.requestAsync(utils.getBackendBaseUrl(), WIKI_ENDPOINT); return result; }, + async subscribeToNewsletterAsync(email: string): Promise { + const result = await fetchUtils.postAsync(utils.getBackendBaseUrl(), SUBSCRIBE_SUBSTACK_NEWSLETTER_ENDPOINT, { + email, + referrer: window.location.href, + }); + return result.status === 200; + }, }; diff --git a/packages/website/ts/utils/fetch_utils.ts b/packages/website/ts/utils/fetch_utils.ts index d2e902db5..e65ac64e1 100644 --- a/packages/website/ts/utils/fetch_utils.ts +++ b/packages/website/ts/utils/fetch_utils.ts @@ -20,6 +20,18 @@ export const fetchUtils = { const result = await response.json(); return result; }, + + async postAsync(baseUrl: string, path: string, body: object): Promise { + const url = `${baseUrl}${path}`; + const response = await fetch(url, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify(body), + }); + return response; + }, }; function queryStringFromQueryParams(queryParams?: object): string { diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index b9d962b75..10381845b 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -306,7 +306,8 @@ export const utils = { return parsedProviderName; }, getBackendBaseUrl(): string { - return isDogfood() ? configs.BACKEND_BASE_STAGING_URL : configs.BACKEND_BASE_PROD_URL; + return 'http://localhost:3000'; + // return isDogfood() ? configs.BACKEND_BASE_STAGING_URL : configs.BACKEND_BASE_PROD_URL; }, isDevelopment(): boolean { return configs.ENVIRONMENT === Environments.DEVELOPMENT; -- cgit From 817d9b0d3e1becdb2e8dbf51caa09edab8d14ab0 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 1 Jun 2018 11:40:06 -0700 Subject: Add styled-components and polished --- packages/website/package.json | 2 + .../website/ts/components/forms/subscribe_form.tsx | 4 +- .../ts/components/inputs/allowance_toggle.tsx | 2 +- .../ts/components/onboarding/onboarding_flow.tsx | 2 +- .../website/ts/components/portal/back_button.tsx | 2 +- .../website/ts/components/portal/drawer_menu.tsx | 2 +- packages/website/ts/components/portal/menu.tsx | 2 +- .../components/relayer_index/relayer_grid_tile.tsx | 2 +- .../ts/components/relayer_index/relayer_index.tsx | 2 +- .../ts/components/top_bar/provider_display.tsx | 4 +- packages/website/ts/components/top_bar/top_bar.tsx | 2 +- packages/website/ts/components/ui/island.tsx | 2 +- packages/website/ts/components/ui/overlay.tsx | 2 +- packages/website/ts/components/wallet/wallet.tsx | 4 +- .../components/wallet/wallet_disconnected_item.tsx | 2 +- .../ts/components/wallet/wrap_ether_item.tsx | 2 +- packages/website/ts/style/colors.ts | 19 +++++++++ packages/website/ts/style/theme.ts | 15 +++++++ packages/website/ts/style/z_index.ts | 5 +++ packages/website/ts/utils/colors.ts | 19 --------- packages/website/ts/utils/style.ts | 5 --- packages/website/ts/utils/wallet_item_styles.ts | 2 +- yarn.lock | 49 ++++++++++++++++++++-- 23 files changed, 106 insertions(+), 46 deletions(-) create mode 100644 packages/website/ts/style/colors.ts create mode 100644 packages/website/ts/style/theme.ts create mode 100644 packages/website/ts/style/z_index.ts delete mode 100644 packages/website/ts/utils/colors.ts delete mode 100644 packages/website/ts/utils/style.ts diff --git a/packages/website/package.json b/packages/website/package.json index a17964f2b..54780f600 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -37,6 +37,7 @@ "lodash": "^4.17.4", "material-ui": "^0.17.1", "moment": "2.21.0", + "polished": "^1.9.2", "query-string": "^6.0.0", "react": "15.6.1", "react-copy-to-clipboard": "^4.2.3", @@ -52,6 +53,7 @@ "redux": "^3.6.0", "redux-devtools-extension": "^2.13.2", "semver-sort": "0.0.4", + "styled-components": "^3.3.0", "thenby": "^1.2.3", "truffle-contract": "2.0.1", "web3": "^0.20.0", diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx index 8bb0f4fc7..3a6d0901f 100644 --- a/packages/website/ts/components/forms/subscribe_form.tsx +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -58,8 +58,8 @@ export class SubscribeForm extends React.Component { this._setStatus(SubscribeFormStatus.Loading); - const success = await backendClient.subscribeToNewsletterAsync(this.state.emailText); - const status = success ? SubscribeFormStatus.Success : SubscribeFormStatus.Error; + const isSuccess = await backendClient.subscribeToNewsletterAsync(this.state.emailText); + const status = isSuccess ? SubscribeFormStatus.Success : SubscribeFormStatus.Error; this._setStatus(status); } private _setStatus(status: SubscribeFormStatus): void { diff --git a/packages/website/ts/components/inputs/allowance_toggle.tsx b/packages/website/ts/components/inputs/allowance_toggle.tsx index d61dfa87d..a8df4935a 100644 --- a/packages/website/ts/components/inputs/allowance_toggle.tsx +++ b/packages/website/ts/components/inputs/allowance_toggle.tsx @@ -5,9 +5,9 @@ import Toggle from 'material-ui/Toggle'; import * as React from 'react'; import { Blockchain } from 'ts/blockchain'; import { Dispatcher } from 'ts/redux/dispatcher'; +import { colors } from 'ts/style/colors'; import { BalanceErrs, Token, TokenState } from 'ts/types'; import { analytics } from 'ts/utils/analytics'; -import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; import { errorReporter } from 'ts/utils/error_reporter'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx index 4066babaf..158ac23ec 100644 --- a/packages/website/ts/components/onboarding/onboarding_flow.tsx +++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx @@ -5,7 +5,7 @@ import { Placement, Popper, PopperChildrenProps } from 'react-popper'; import { ContinueButtonDisplay, OnboardingTooltip } from 'ts/components/onboarding/onboarding_tooltip'; import { Container } from 'ts/components/ui/container'; import { Overlay } from 'ts/components/ui/overlay'; -import { zIndex } from 'ts/utils/style'; +import { zIndex } from 'ts/style/z_index'; export interface Step { target: string; diff --git a/packages/website/ts/components/portal/back_button.tsx b/packages/website/ts/components/portal/back_button.tsx index 48858613c..2d0bbefc3 100644 --- a/packages/website/ts/components/portal/back_button.tsx +++ b/packages/website/ts/components/portal/back_button.tsx @@ -2,7 +2,7 @@ import { Styles } from '@0xproject/react-shared'; import * as React from 'react'; import { Link } from 'react-router-dom'; -import { colors } from 'ts/utils/colors'; +import { colors } from 'ts/style/colors'; export interface BackButtonProps { to: string; diff --git a/packages/website/ts/components/portal/drawer_menu.tsx b/packages/website/ts/components/portal/drawer_menu.tsx index ace11639a..8ac2b9091 100644 --- a/packages/website/ts/components/portal/drawer_menu.tsx +++ b/packages/website/ts/components/portal/drawer_menu.tsx @@ -4,8 +4,8 @@ import * as React from 'react'; import { defaultMenuItemEntries, Menu } from 'ts/components/portal/menu'; import { Identicon } from 'ts/components/ui/identicon'; +import { colors } from 'ts/style/colors'; import { WebsitePaths } from 'ts/types'; -import { colors } from 'ts/utils/colors'; import { utils } from 'ts/utils/utils'; const IDENTICON_DIAMETER = 45; diff --git a/packages/website/ts/components/portal/menu.tsx b/packages/website/ts/components/portal/menu.tsx index 6a3301549..7d4bc38d2 100644 --- a/packages/website/ts/components/portal/menu.tsx +++ b/packages/website/ts/components/portal/menu.tsx @@ -2,8 +2,8 @@ import { Styles } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import { MenuItem } from 'ts/components/ui/menu_item'; +import { colors } from 'ts/style/colors'; import { Environments, WebsitePaths } from 'ts/types'; -import { colors } from 'ts/utils/colors'; import { configs } from 'ts/utils/configs'; export interface MenuTheme { diff --git a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx index ad6ab3de1..41febebe9 100644 --- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx +++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx @@ -7,8 +7,8 @@ import { TopTokens } from 'ts/components/relayer_index/relayer_top_tokens'; import { Container } from 'ts/components/ui/container'; import { Island } from 'ts/components/ui/island'; import { TokenIcon } from 'ts/components/ui/token_icon'; +import { colors } from 'ts/style/colors'; import { Token, WebsiteBackendRelayerInfo } from 'ts/types'; -import { colors } from 'ts/utils/colors'; export interface RelayerGridTileProps { relayerInfo: WebsiteBackendRelayerInfo; diff --git a/packages/website/ts/components/relayer_index/relayer_index.tsx b/packages/website/ts/components/relayer_index/relayer_index.tsx index 9ef6eaf59..683f7084b 100644 --- a/packages/website/ts/components/relayer_index/relayer_index.tsx +++ b/packages/website/ts/components/relayer_index/relayer_index.tsx @@ -6,9 +6,9 @@ import { GridList } from 'material-ui/GridList'; import * as React from 'react'; import { RelayerGridTile } from 'ts/components/relayer_index/relayer_grid_tile'; +import { colors } from 'ts/style/colors'; import { ScreenWidths, WebsiteBackendRelayerInfo } from 'ts/types'; import { backendClient } from 'ts/utils/backend_client'; -import { colors } from 'ts/utils/colors'; export interface RelayerIndexProps { networkId: number; diff --git a/packages/website/ts/components/top_bar/provider_display.tsx b/packages/website/ts/components/top_bar/provider_display.tsx index 679ec07dc..3edf11e19 100644 --- a/packages/website/ts/components/top_bar/provider_display.tsx +++ b/packages/website/ts/components/top_bar/provider_display.tsx @@ -8,10 +8,10 @@ import { ProviderPicker } from 'ts/components/top_bar/provider_picker'; import { DropDown } from 'ts/components/ui/drop_down'; import { Identicon } from 'ts/components/ui/identicon'; import { Dispatcher } from 'ts/redux/dispatcher'; +import { colors } from 'ts/style/colors'; +import { zIndex } from 'ts/style/z_index'; import { ProviderType } from 'ts/types'; -import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; -import { zIndex } from 'ts/utils/style'; import { utils } from 'ts/utils/utils'; const ROOT_HEIGHT = 24; diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index db8e3cb82..ac1dd7d99 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -16,9 +16,9 @@ import { TopBarMenuItem } from 'ts/components/top_bar/top_bar_menu_item'; import { DropDown } from 'ts/components/ui/drop_down'; import { Identicon } from 'ts/components/ui/identicon'; import { Dispatcher } from 'ts/redux/dispatcher'; +import { zIndex } from 'ts/style/z_index'; import { Deco, Key, ProviderType, WebsiteLegacyPaths, WebsitePaths } from 'ts/types'; import { constants } from 'ts/utils/constants'; -import { zIndex } from 'ts/utils/style'; import { Translate } from 'ts/utils/translate'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/components/ui/island.tsx b/packages/website/ts/components/ui/island.tsx index f5480c9c9..802a7830a 100644 --- a/packages/website/ts/components/ui/island.tsx +++ b/packages/website/ts/components/ui/island.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; +import { colors } from 'ts/style/colors'; import { Styleable } from 'ts/types'; -import { colors } from 'ts/utils/colors'; export interface IslandProps { style?: React.CSSProperties; diff --git a/packages/website/ts/components/ui/overlay.tsx b/packages/website/ts/components/ui/overlay.tsx index bb2ed8e59..acca8194f 100644 --- a/packages/website/ts/components/ui/overlay.tsx +++ b/packages/website/ts/components/ui/overlay.tsx @@ -2,7 +2,7 @@ import { colors } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; -import { zIndex } from 'ts/utils/style'; +import { zIndex } from 'ts/style/z_index'; export interface OverlayProps { children?: React.ReactNode; diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx index 30d1285f4..62d3e5af7 100644 --- a/packages/website/ts/components/wallet/wallet.tsx +++ b/packages/website/ts/components/wallet/wallet.tsx @@ -30,6 +30,8 @@ import { TokenIcon } from 'ts/components/ui/token_icon'; import { WalletDisconnectedItem } from 'ts/components/wallet/wallet_disconnected_item'; import { WrapEtherItem } from 'ts/components/wallet/wrap_ether_item'; import { Dispatcher } from 'ts/redux/dispatcher'; +import { colors } from 'ts/style/colors'; +import { zIndex } from 'ts/style/z_index'; import { BalanceErrs, BlockchainErrs, @@ -44,9 +46,7 @@ import { WebsitePaths, } from 'ts/types'; import { backendClient } from 'ts/utils/backend_client'; -import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; -import { zIndex } from 'ts/utils/style'; import { utils } from 'ts/utils/utils'; import { styles as walletItemStyles } from 'ts/utils/wallet_item_styles'; diff --git a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx index 39a62e1fb..9207d7ff2 100644 --- a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx +++ b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx @@ -3,8 +3,8 @@ import FlatButton from 'material-ui/FlatButton'; import ActionAccountBalanceWallet from 'material-ui/svg-icons/action/account-balance-wallet'; import * as React from 'react'; +import { colors } from 'ts/style/colors'; import { ProviderType } from 'ts/types'; -import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/components/wallet/wrap_ether_item.tsx b/packages/website/ts/components/wallet/wrap_ether_item.tsx index 1dfcffadf..50b64d05c 100644 --- a/packages/website/ts/components/wallet/wrap_ether_item.tsx +++ b/packages/website/ts/components/wallet/wrap_ether_item.tsx @@ -10,8 +10,8 @@ import { Blockchain } from 'ts/blockchain'; import { EthAmountInput } from 'ts/components/inputs/eth_amount_input'; import { TokenAmountInput } from 'ts/components/inputs/token_amount_input'; import { Dispatcher } from 'ts/redux/dispatcher'; +import { colors } from 'ts/style/colors'; import { BlockchainCallErrs, Side, Token } from 'ts/types'; -import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; import { errorReporter } from 'ts/utils/error_reporter'; import { utils } from 'ts/utils/utils'; diff --git a/packages/website/ts/style/colors.ts b/packages/website/ts/style/colors.ts new file mode 100644 index 000000000..5ffdd6ba7 --- /dev/null +++ b/packages/website/ts/style/colors.ts @@ -0,0 +1,19 @@ +import { colors as sharedColors } from '@0xproject/react-shared'; + +const appColors = { + walletBoxShadow: 'rgba(56, 59, 137, 0.2)', + walletBorder: '#ededee', + walletDefaultItemBackground: '#fbfbfc', + walletFocusedItemBackground: '#f0f1f4', + allowanceToggleShadow: 'rgba(0, 0, 0, 0)', + allowanceToggleOffTrack: '#adadad', + allowanceToggleOnTrack: sharedColors.mediumBlue, + wrapEtherConfirmationButton: sharedColors.mediumBlue, + drawerMenuBackground: '#4a4a4a', + menuItemDefaultSelectedBackground: '#424242', +}; + +export const colors = { + ...sharedColors, + ...appColors, +}; diff --git a/packages/website/ts/style/theme.ts b/packages/website/ts/style/theme.ts new file mode 100644 index 000000000..9e447e7ee --- /dev/null +++ b/packages/website/ts/style/theme.ts @@ -0,0 +1,15 @@ +import * as styledComponents from 'styled-components'; + +const { + default: styled, + css, + injectGlobal, + keyframes, + ThemeProvider, +} = styledComponents as styledComponents.ThemedStyledComponentsModule; + +export interface IThemeInterface {} + +export const theme = {}; + +export { styled, css, injectGlobal, keyframes, ThemeProvider }; diff --git a/packages/website/ts/style/z_index.ts b/packages/website/ts/style/z_index.ts new file mode 100644 index 000000000..0411cdd91 --- /dev/null +++ b/packages/website/ts/style/z_index.ts @@ -0,0 +1,5 @@ +export const zIndex = { + topBar: 1100, + overlay: 1105, + aboveOverlay: 1106, +}; diff --git a/packages/website/ts/utils/colors.ts b/packages/website/ts/utils/colors.ts deleted file mode 100644 index 5ffdd6ba7..000000000 --- a/packages/website/ts/utils/colors.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { colors as sharedColors } from '@0xproject/react-shared'; - -const appColors = { - walletBoxShadow: 'rgba(56, 59, 137, 0.2)', - walletBorder: '#ededee', - walletDefaultItemBackground: '#fbfbfc', - walletFocusedItemBackground: '#f0f1f4', - allowanceToggleShadow: 'rgba(0, 0, 0, 0)', - allowanceToggleOffTrack: '#adadad', - allowanceToggleOnTrack: sharedColors.mediumBlue, - wrapEtherConfirmationButton: sharedColors.mediumBlue, - drawerMenuBackground: '#4a4a4a', - menuItemDefaultSelectedBackground: '#424242', -}; - -export const colors = { - ...sharedColors, - ...appColors, -}; diff --git a/packages/website/ts/utils/style.ts b/packages/website/ts/utils/style.ts deleted file mode 100644 index 0411cdd91..000000000 --- a/packages/website/ts/utils/style.ts +++ /dev/null @@ -1,5 +0,0 @@ -export const zIndex = { - topBar: 1100, - overlay: 1105, - aboveOverlay: 1106, -}; diff --git a/packages/website/ts/utils/wallet_item_styles.ts b/packages/website/ts/utils/wallet_item_styles.ts index 6b038efd2..9d6033d74 100644 --- a/packages/website/ts/utils/wallet_item_styles.ts +++ b/packages/website/ts/utils/wallet_item_styles.ts @@ -1,6 +1,6 @@ import { Styles } from '@0xproject/react-shared'; -import { colors } from 'ts/utils/colors'; +import { colors } from 'ts/style/colors'; export const styles: Styles = { focusedItem: { diff --git a/yarn.lock b/yarn.lock index eb1cad3cc..668b44760 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2006,7 +2006,7 @@ buffer@^4.3.0: ieee754 "^1.1.4" isarray "^1.0.0" -buffer@^5.0.5: +buffer@^5.0.3, buffer@^5.0.5: version "5.1.0" resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.1.0.tgz#c913e43678c7cb7c8bd16afbcddb6c5505e8f9fe" dependencies: @@ -3023,6 +3023,10 @@ crypto-random-string@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-1.0.0.tgz#a230f64f568310e1498009940790ec99545bca7e" +css-color-keywords@^1.0.0: + version "1.0.0" + resolved "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05" + css-color-names@0.0.4: version "0.0.4" resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0" @@ -3084,6 +3088,14 @@ css-selector-tokenizer@^0.7.0: fastparse "^1.1.1" regexpu-core "^1.0.0" +css-to-react-native@^2.0.3: + version "2.2.0" + resolved "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.2.0.tgz#d524ef7f39a2747a8914e86563669ba35b7cf2e7" + dependencies: + css-color-keywords "^1.0.0" + fbjs "^0.8.5" + postcss-value-parser "^3.3.0" + cssesc@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-0.1.0.tgz#c814903e45623371a0477b40109aaafbeeaddbb4" @@ -4067,7 +4079,7 @@ ethereumjs-blockstream@^2.0.6: source-map-support "0.4.14" uuid "3.0.1" -ethereumjs-tx@0xProject/ethereumjs-tx#fake-tx-include-signature-by-default, ethereumjs-tx@^1.0.0, ethereumjs-tx@^1.1.1, ethereumjs-tx@^1.2.0, ethereumjs-tx@^1.2.2, ethereumjs-tx@^1.3.0, ethereumjs-tx@^1.3.3: +ethereumjs-tx@^1.0.0, ethereumjs-tx@^1.1.1, ethereumjs-tx@^1.2.0, ethereumjs-tx@^1.2.2, ethereumjs-tx@^1.3.0, ethereumjs-tx@^1.3.3: version "1.3.4" resolved "https://codeload.github.com/0xProject/ethereumjs-tx/tar.gz/5f0a610849de09f922f8ccee5af1aae4bec36e51" dependencies: @@ -4453,7 +4465,7 @@ faye-websocket@~0.11.0: dependencies: websocket-driver ">=0.5.1" -fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.16, fbjs@^0.8.4, fbjs@^0.8.6, fbjs@^0.8.9: +fbjs@^0.8.0, fbjs@^0.8.1, fbjs@^0.8.16, fbjs@^0.8.4, fbjs@^0.8.5, fbjs@^0.8.6, fbjs@^0.8.9: version "0.8.16" resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db" dependencies: @@ -8683,6 +8695,10 @@ plur@^2.1.2: dependencies: irregular-plurals "^1.0.0" +polished@^1.9.2: + version "1.9.2" + resolved "https://registry.npmjs.org/polished/-/polished-1.9.2.tgz#d705cac66f3a3ed1bd38aad863e2c1e269baf6b6" + popper.js@^1.14.1: version "1.14.3" resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.3.tgz#1438f98d046acf7b4d78cd502bf418ac64d4f095" @@ -9519,6 +9535,10 @@ react-highlight@0xproject/react-highlight: react "^15.5.4" react-dom "^15.5.4" +react-is@^16.3.1: + version "16.4.0" + resolved "https://registry.npmjs.org/react-is/-/react-is-16.4.0.tgz#cc9fdc855ac34d2e7d9d2eb7059bbc240d35ffcf" + react-markdown@^3.2.2: version "3.3.0" resolved "https://registry.yarnpkg.com/react-markdown/-/react-markdown-3.3.0.tgz#a87cdd822aa9302d6add9687961dd1a82a45d02e" @@ -11150,6 +11170,29 @@ style-loader@^0.20.2: loader-utils "^1.1.0" schema-utils "^0.4.5" +styled-components@^3.3.0: + version "3.3.0" + resolved "https://registry.npmjs.org/styled-components/-/styled-components-3.3.0.tgz#335b1b2b673b416cd5ec012010e237ed1f877fe9" + dependencies: + buffer "^5.0.3" + css-to-react-native "^2.0.3" + fbjs "^0.8.16" + hoist-non-react-statics "^2.5.0" + is-plain-object "^2.0.1" + prop-types "^15.5.4" + react-is "^16.3.1" + stylis "^3.5.0" + stylis-rule-sheet "^0.0.10" + supports-color "^3.2.3" + +stylis-rule-sheet@^0.0.10: + version "0.0.10" + resolved "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz#44e64a2b076643f4b52e5ff71efc04d8c3c4a430" + +stylis@^3.5.0: + version "3.5.0" + resolved "https://registry.npmjs.org/stylis/-/stylis-3.5.0.tgz#016fa239663d77f868fef5b67cf201c4b7c701e1" + supports-color@3.1.2: version "3.1.2" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.1.2.tgz#72a262894d9d408b956ca05ff37b2ed8a6e2a2d5" -- cgit From 073a96cf63a8b2e5639d15133d09545f7bde1388 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 1 Jun 2018 17:25:50 -0700 Subject: Implement subscription form --- .../website/ts/components/forms/subscribe_form.tsx | 121 +++++++++++++++------ packages/website/ts/components/ui/button.tsx | 79 ++++++++++++++ packages/website/ts/components/ui/container.tsx | 15 ++- packages/website/ts/components/ui/input.tsx | 43 ++++++++ packages/website/ts/components/ui/text.tsx | 56 ++++++++++ packages/website/ts/pages/landing/landing.tsx | 38 ++----- packages/website/ts/utils/backend_client.ts | 4 +- 7 files changed, 288 insertions(+), 68 deletions(-) create mode 100644 packages/website/ts/components/ui/button.tsx create mode 100644 packages/website/ts/components/ui/input.tsx create mode 100644 packages/website/ts/components/ui/text.tsx diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx index 3a6d0901f..99686efce 100644 --- a/packages/website/ts/components/forms/subscribe_form.tsx +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -1,7 +1,12 @@ import { colors } from '@0xproject/react-shared'; import * as React from 'react'; -import RaisedButton from 'material-ui/RaisedButton'; +import { Button } from 'ts/components/ui/button'; +import { Input } from 'ts/components/ui/input'; +import { Text } from 'ts/components/ui/text'; +import { logUtils } from '@0xproject/utils'; +import { Container } from 'ts/components/ui/container'; +import { styled } from 'ts/style/theme'; import { backendClient } from 'ts/utils/backend_client'; export interface SubscribeFormProps {} @@ -15,54 +20,102 @@ export enum SubscribeFormStatus { export interface SubscribeFormState { emailText: string; + lastSubmittedEmail: string; status: SubscribeFormStatus; } export class SubscribeForm extends React.Component { public state = { emailText: '', + lastSubmittedEmail: '', status: SubscribeFormStatus.None, }; public render(): React.ReactNode { + const formFontSize = '15px'; return ( -
- Subscribe to our newsletter for 0x relayer and dApp updates -
- - -
-
+ + + + Subscribe to our newsletter for 0x relayer and dApp updates + + +
+ + + + + + + + +
+ {this._renderMessage()} + ); } + private _renderMessage(): React.ReactNode { + let message = null; + switch (this.state.status) { + case SubscribeFormStatus.Error: + message = 'Sorry, something went wrong. Try again later.'; + break; + case SubscribeFormStatus.Loading: + message = 'One second...'; + break; + case SubscribeFormStatus.Success: + message = `Thanks! ${this.state.lastSubmittedEmail} is now on the mailing list.`; + break; + case SubscribeFormStatus.None: + break; + } + return ( + + + {message || 'spacer text'} + + + ); + } + private _handleEmailInputChange(event: React.ChangeEvent): void { this.setState({ emailText: event.target.value }); } - private async _handleSubscribeClickAsync(): Promise { - this._setStatus(SubscribeFormStatus.Loading); - const isSuccess = await backendClient.subscribeToNewsletterAsync(this.state.emailText); - const status = isSuccess ? SubscribeFormStatus.Success : SubscribeFormStatus.Error; - this._setStatus(status); + private async _handleFormSubmitAsync(event: React.FormEvent): Promise { + event.preventDefault(); + if (!this.state.emailText) { + return; + } + this.setState({ + status: SubscribeFormStatus.Loading, + lastSubmittedEmail: this.state.emailText, + }); + try { + const response = await backendClient.subscribeToNewsletterAsync(this.state.emailText); + const status = response.status === 200 ? SubscribeFormStatus.Success : SubscribeFormStatus.Error; + this._setStatus(status); + } catch (error) { + logUtils.log(error); + this._setStatus(SubscribeFormStatus.Error); + } finally { + this.setState({ emailText: '' }); + } } - private _setStatus(status: SubscribeFormStatus): void { - this.setState({ status }); + private _setStatus(status: SubscribeFormStatus, then?: () => void): void { + this.setState({ status }, then); } } diff --git a/packages/website/ts/components/ui/button.tsx b/packages/website/ts/components/ui/button.tsx new file mode 100644 index 000000000..e6e31374f --- /dev/null +++ b/packages/website/ts/components/ui/button.tsx @@ -0,0 +1,79 @@ +import { colors } from '@0xproject/react-shared'; +import { darken } from 'polished'; +import * as React from 'react'; +import { styled } from 'ts/style/theme'; + +export interface ButtonProps { + className?: string; + fontSize?: string; + fontColor?: string; + backgroundColor?: string; + borderColor?: string; + width?: string; + type?: string; + onClick?: (event: React.MouseEvent) => void; +} + +const PlainButton: React.StatelessComponent = ({ children, onClick, type, className }) => ( + +); + +export const Button = styled(PlainButton)` + cursor: pointer; + font-size: ${props => props.fontSize}; + color: ${props => props.fontColor}; + padding: 0.8em 2.2em; + border-radius: 6px; + box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); + font-weight: 500; + font-family: 'Roboto'; + width: ${props => props.width}; + background-color: ${props => props.backgroundColor}; + border: ${props => (props.borderColor ? `1px solid ${props.borderColor}` : 'none')}; + &:hover { + background-color: ${props => darken(0.1, props.backgroundColor)}; + } + &:active { + background-color: ${props => darken(0.2, props.backgroundColor)}; + } +`; + +Button.defaultProps = { + fontSize: '12px', + backgroundColor: colors.white, + width: 'auto', +}; + +Button.displayName = 'Button'; + +type CTAType = 'light' | 'dark'; + +export interface CTAProps { + type?: CTAType; + fontSize?: string; + width?: string; +} + +export const CTA: React.StatelessComponent = ({ children, type, fontSize, width }) => { + const isLight = type === 'light'; + const backgroundColor = isLight ? colors.white : colors.heroGrey; + const fontColor = isLight ? colors.heroGrey : colors.white; + const borderColor = isLight ? undefined : colors.white; + return ( + + ); +}; + +CTA.defaultProps = { + type: 'dark', +}; diff --git a/packages/website/ts/components/ui/container.tsx b/packages/website/ts/components/ui/container.tsx index d577447b0..c6a78e181 100644 --- a/packages/website/ts/components/ui/container.tsx +++ b/packages/website/ts/components/ui/container.tsx @@ -11,13 +11,20 @@ export interface ContainerProps { paddingBottom?: StringOrNum; paddingRight?: StringOrNum; paddingLeft?: StringOrNum; + backgroundColor?: string; + borderRadius?: StringOrNum; maxWidth?: StringOrNum; - children?: React.ReactNode; + isHidden?: boolean; + className?: string; } -export const Container: React.StatelessComponent = (props: ContainerProps) => { - const { children, ...style } = props; - return
{children}
; +export const Container: React.StatelessComponent = ({ children, className, isHidden, ...style }) => { + const visibility = isHidden ? 'hidden' : undefined; + return ( +
+ {children} +
+ ); }; Container.displayName = 'Container'; diff --git a/packages/website/ts/components/ui/input.tsx b/packages/website/ts/components/ui/input.tsx new file mode 100644 index 000000000..75a453eae --- /dev/null +++ b/packages/website/ts/components/ui/input.tsx @@ -0,0 +1,43 @@ +import { colors } from '@0xproject/react-shared'; +import * as React from 'react'; +import { styled } from 'ts/style/theme'; + +export interface InputProps { + className?: string; + value?: string; + width?: string; + fontSize?: string; + fontColor?: string; + placeholderColor?: string; + placeholder?: string; + backgroundColor?: string; + onChange?: (event: React.ChangeEvent) => void; +} + +const PlainInput: React.StatelessComponent = ({ value, className, placeholder, onChange }) => ( + +); + +export const Input = styled(PlainInput)` + font-size: ${props => props.fontSize}; + width: ${props => props.width}; + padding: 0.8em 1.2em; + border-radius: 3px; + font-family: 'Roboto Mono'; + color: ${props => props.fontColor}; + border: none; + background-color: ${props => props.backgroundColor}; + &::placeholder { + color: ${props => props.placeholder}; + } +`; + +Input.defaultProps = { + width: 'auto', + backgroundColor: colors.white, + fontColor: colors.darkestGrey, + placeholderColor: colors.grey500, + fontSize: '12px', +}; + +Input.displayName = 'Input'; diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx new file mode 100644 index 000000000..259365618 --- /dev/null +++ b/packages/website/ts/components/ui/text.tsx @@ -0,0 +1,56 @@ +import { colors } from '@0xproject/react-shared'; +import * as React from 'react'; +import { styled } from 'ts/style/theme'; +import { Deco, Key } from 'ts/types'; +import { Translate } from 'ts/utils/translate'; + +export type TextTag = 'p' | 'div' | 'span' | 'label'; + +export interface TextProps { + className?: string; + Tag?: TextTag; + fontSize?: string; + fontFamily?: string; + fontColor?: string; + lineHeight?: string; + center?: boolean; + fontWeight?: number; +} + +const PlainText: React.StatelessComponent = ({ children, className, Tag }) => ( + {children} +); + +export const Text = styled(PlainText)` + font-family: ${props => props.fontFamily}; + font-weight: ${props => props.fontWeight}; + font-size: ${props => props.fontSize}; + ${props => (props.lineHeight ? `line-height: ${props.lineHeight}` : '')}; + ${props => (props.center ? 'text-align: center' : '')}; + color: ${props => props.fontColor}; +`; + +Text.defaultProps = { + fontFamily: 'Roboto', + fontWeight: 400, + fontColor: colors.white, + fontSize: '14px', + Tag: 'div', +}; + +Text.displayName = 'Text'; + +interface TranslatedProps { + children: Key; + translate: Translate; + deco?: Deco; +} + +export type TranslatedTextProps = TextProps & TranslatedProps; + +export const TranslatedText: React.StatelessComponent = ({ + translate, + children, + deco, + ...textProps +}) => {translate.get(children, deco)}; diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 016c62a30..0911bb2cf 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -1,7 +1,7 @@ import { colors } from '@0xproject/react-shared'; import * as _ from 'lodash'; -import RaisedButton from 'material-ui/RaisedButton'; import * as React from 'react'; +import { CTA } from 'ts/components/ui/button'; import DocumentTitle = require('react-document-title'); import { Link } from 'react-router-dom'; import { Footer } from 'ts/components/footer'; @@ -237,7 +237,7 @@ export class Landing extends React.Component {
{this._renderWhatsNew()} -
+
@@ -272,13 +272,9 @@ export class Landing extends React.Component {
- + + {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)} +
@@ -287,23 +283,17 @@ export class Landing extends React.Component { target="_blank" className="text-decoration-none" > - + + {this.props.translate.get(Key.CommunityCallToAction, Deco.Cap)} +
-
+ ); } @@ -784,15 +774,7 @@ export class Landing extends React.Component {
- + {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}
diff --git a/packages/website/ts/utils/backend_client.ts b/packages/website/ts/utils/backend_client.ts index fb7c21c59..6b16aea6b 100644 --- a/packages/website/ts/utils/backend_client.ts +++ b/packages/website/ts/utils/backend_client.ts @@ -34,11 +34,11 @@ export const backendClient = { const result = await fetchUtils.requestAsync(utils.getBackendBaseUrl(), WIKI_ENDPOINT); return result; }, - async subscribeToNewsletterAsync(email: string): Promise { + async subscribeToNewsletterAsync(email: string): Promise { const result = await fetchUtils.postAsync(utils.getBackendBaseUrl(), SUBSCRIBE_SUBSTACK_NEWSLETTER_ENDPOINT, { email, referrer: window.location.href, }); - return result.status === 200; + return result; }, }; -- cgit From a74597c7cd44d3138de39ec05079e9b9e005d03d Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 1 Jun 2018 17:37:32 -0700 Subject: Lint and cleanup --- packages/react-shared/src/utils/colors.ts | 2 +- packages/website/ts/components/forms/subscribe_form.tsx | 8 ++++---- packages/website/ts/components/ui/text.tsx | 2 +- packages/website/ts/pages/landing/landing.tsx | 2 +- yarn.lock | 2 +- 5 files changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/react-shared/src/utils/colors.ts b/packages/react-shared/src/utils/colors.ts index 71d92c290..92f45c2e7 100644 --- a/packages/react-shared/src/utils/colors.ts +++ b/packages/react-shared/src/utils/colors.ts @@ -22,7 +22,7 @@ const baseColors = { heroGrey: '#404040', projectsGrey: '#343333', darkestGrey: '#272727', - dharmaDarkGrey: '#252525', + darkButtonGrey: '#252525', lightBlue: '#60A4F4', lightBlueA700: '#0091EA', linkBlue: '#1D5CDE', diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx index 99686efce..b83a9c346 100644 --- a/packages/website/ts/components/forms/subscribe_form.tsx +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -1,11 +1,11 @@ import { colors } from '@0xproject/react-shared'; import * as React from 'react'; +import { logUtils } from '@0xproject/utils'; import { Button } from 'ts/components/ui/button'; +import { Container } from 'ts/components/ui/container'; import { Input } from 'ts/components/ui/input'; import { Text } from 'ts/components/ui/text'; -import { logUtils } from '@0xproject/utils'; -import { Container } from 'ts/components/ui/container'; import { styled } from 'ts/style/theme'; import { backendClient } from 'ts/utils/backend_client'; @@ -47,7 +47,7 @@ export class SubscribeForm extends React.Component @@ -55,7 +55,7 @@ export class SubscribeForm extends React.Component @@ -82,16 +84,19 @@ export class SubscribeForm extends React.Component - {message || 'spacer text'} + {message || 'spacer text (never shown to user)'} ); } - private _handleEmailInputChange(event: React.ChangeEvent): void { this.setState({ emailText: event.target.value }); } @@ -107,15 +112,12 @@ export class SubscribeForm extends React.Component void): void { - this.setState({ status }, then); + private _setStatus(status: SubscribeFormStatus): void { + this.setState({ status }); } } diff --git a/packages/website/ts/components/ui/button.tsx b/packages/website/ts/components/ui/button.tsx index e6e31374f..4c7d59839 100644 --- a/packages/website/ts/components/ui/button.tsx +++ b/packages/website/ts/components/ui/button.tsx @@ -48,15 +48,15 @@ Button.defaultProps = { Button.displayName = 'Button'; -type CTAType = 'light' | 'dark'; +type CallToActionType = 'light' | 'dark'; -export interface CTAProps { - type?: CTAType; +export interface CallToActionProps { + type?: CallToActionType; fontSize?: string; width?: string; } -export const CTA: React.StatelessComponent = ({ children, type, fontSize, width }) => { +export const CallToAction: React.StatelessComponent = ({ children, type, fontSize, width }) => { const isLight = type === 'light'; const backgroundColor = isLight ? colors.white : colors.heroGrey; const fontColor = isLight ? colors.heroGrey : colors.white; @@ -74,6 +74,6 @@ export const CTA: React.StatelessComponent = ({ children, type, fontSi ); }; -CTA.defaultProps = { +CallToAction.defaultProps = { type: 'dark', }; diff --git a/packages/website/ts/components/ui/input.tsx b/packages/website/ts/components/ui/input.tsx index 75a453eae..e01a71a53 100644 --- a/packages/website/ts/components/ui/input.tsx +++ b/packages/website/ts/components/ui/input.tsx @@ -28,7 +28,7 @@ export const Input = styled(PlainInput)` border: none; background-color: ${props => props.backgroundColor}; &::placeholder { - color: ${props => props.placeholder}; + color: ${props => props.placeholderColor}; } `; @@ -36,7 +36,7 @@ Input.defaultProps = { width: 'auto', backgroundColor: colors.white, fontColor: colors.darkestGrey, - placeholderColor: colors.grey500, + placeholderColor: colors.darkGrey, fontSize: '12px', }; diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx index d3e205d12..259365618 100644 --- a/packages/website/ts/components/ui/text.tsx +++ b/packages/website/ts/components/ui/text.tsx @@ -52,5 +52,5 @@ export const TranslatedText: React.StatelessComponent = ({ translate, children, deco, - ...textProps, + ...textProps }) => {translate.get(children, deco)}; diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 1a1772a23..db3eb83b0 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -6,7 +6,7 @@ import { Link } from 'react-router-dom'; import { Footer } from 'ts/components/footer'; import { SubscribeForm } from 'ts/components/forms/subscribe_form'; import { TopBar } from 'ts/components/top_bar/top_bar'; -import { CTA } from 'ts/components/ui/button'; +import { CallToAction } from 'ts/components/ui/button'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; import { constants } from 'ts/utils/constants'; @@ -272,9 +272,9 @@ export class Landing extends React.Component {
- + {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)} - +
@@ -283,9 +283,9 @@ export class Landing extends React.Component { target="_blank" className="text-decoration-none" > - + {this.props.translate.get(Key.CommunityCallToAction, Deco.Cap)} - +
@@ -774,7 +774,9 @@ export class Landing extends React.Component {
- {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)} + + {this.props.translate.get(Key.BuildCallToAction, Deco.Cap)} +
diff --git a/packages/website/ts/utils/fetch_utils.ts b/packages/website/ts/utils/fetch_utils.ts index e65ac64e1..513f7e479 100644 --- a/packages/website/ts/utils/fetch_utils.ts +++ b/packages/website/ts/utils/fetch_utils.ts @@ -4,23 +4,26 @@ import * as queryString from 'query-string'; import { errorReporter } from 'ts/utils/error_reporter'; +const logErrorIfPresent = (response: Response, requestedURL: string) => { + if (response.status !== 200) { + const errorText = `Error requesting url: ${requestedURL}, ${response.status}: ${response.statusText}`; + logUtils.log(errorText); + const error = Error(errorText); + // tslint:disable-next-line:no-floating-promises + errorReporter.reportAsync(error); + throw error; + } +}; + export const fetchUtils = { async requestAsync(baseUrl: string, path: string, queryParams?: object): Promise { const query = queryStringFromQueryParams(queryParams); const url = `${baseUrl}${path}${query}`; const response = await fetch(url); - if (response.status !== 200) { - const errorText = `Error requesting url: ${url}, ${response.status}: ${response.statusText}`; - logUtils.log(errorText); - const error = Error(errorText); - // tslint:disable-next-line:no-floating-promises - errorReporter.reportAsync(error); - throw error; - } + logErrorIfPresent(response, url); const result = await response.json(); return result; }, - async postAsync(baseUrl: string, path: string, body: object): Promise { const url = `${baseUrl}${path}`; const response = await fetch(url, { @@ -30,6 +33,7 @@ export const fetchUtils = { }, body: JSON.stringify(body), }); + logErrorIfPresent(response, url); return response; }, }; diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index 10381845b..b9d962b75 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -306,8 +306,7 @@ export const utils = { return parsedProviderName; }, getBackendBaseUrl(): string { - return 'http://localhost:3000'; - // return isDogfood() ? configs.BACKEND_BASE_STAGING_URL : configs.BACKEND_BASE_PROD_URL; + return isDogfood() ? configs.BACKEND_BASE_STAGING_URL : configs.BACKEND_BASE_PROD_URL; }, isDevelopment(): boolean { return configs.ENVIRONMENT === Environments.DEVELOPMENT; -- cgit From 3c508c1d271ffba4eead6f0c145d57330804697c Mon Sep 17 00:00:00 2001 From: fragosti Date: Mon, 4 Jun 2018 17:06:23 -0700 Subject: Do not show subscribe form if language is not english --- packages/website/ts/pages/landing/landing.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index db3eb83b0..aa639c10e 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -293,7 +293,7 @@ export class Landing extends React.Component { - + {this.props.translate.getLanguage() === Language.English && } ); } -- cgit From ea2d5b9d4a7c3e59645a0b302dc6979e6b9b285f Mon Sep 17 00:00:00 2001 From: fragosti Date: Mon, 4 Jun 2018 17:51:48 -0700 Subject: Make buttons stack on mobile --- packages/website/ts/components/ui/text.tsx | 2 +- packages/website/ts/pages/landing/landing.tsx | 9 +++++---- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx index 259365618..d3e205d12 100644 --- a/packages/website/ts/components/ui/text.tsx +++ b/packages/website/ts/components/ui/text.tsx @@ -52,5 +52,5 @@ export const TranslatedText: React.StatelessComponent = ({ translate, children, deco, - ...textProps + ...textProps, }) => {translate.get(children, deco)}; diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index aa639c10e..f3428d475 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -7,6 +7,7 @@ import { Footer } from 'ts/components/footer'; import { SubscribeForm } from 'ts/components/forms/subscribe_form'; import { TopBar } from 'ts/components/top_bar/top_bar'; import { CallToAction } from 'ts/components/ui/button'; +import { Container } from 'ts/components/ui/container'; import { Dispatcher } from 'ts/redux/dispatcher'; import { Deco, Key, Language, ScreenWidths, WebsitePaths } from 'ts/types'; import { constants } from 'ts/utils/constants'; @@ -269,15 +270,15 @@ export class Landing extends React.Component { > {this.props.translate.get(Key.TopTagline)} -
-
+ +
{this.props.translate.get(Key.BuildCallToAction, Deco.Cap)}
-
+ -
+
-- cgit From ecdfde8c38c2b2f5985c1524d1d2b3af74d7b07d Mon Sep 17 00:00:00 2001 From: Alex Browne Date: Mon, 4 Jun 2018 18:22:52 -0700 Subject: Remove common-js/umd differentiation from 0x.js/package.json --- packages/0x.js/package.json | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/packages/0x.js/package.json b/packages/0x.js/package.json index 0ee2efa34..e9aa95265 100644 --- a/packages/0x.js/package.json +++ b/packages/0x.js/package.json @@ -17,18 +17,15 @@ "scripts": { "watch": "tsc -w", "prebuild": "run-s clean generate_contract_wrappers", - "build": "run-p build:umd:prod build:commonjs; exit 0;", + "build": "tsc && copyfiles -u 2 './src/compact_artifacts/**/*.json' ./lib/src/compact_artifacts && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", "generate_contract_wrappers": "abi-gen --abis 'src/compact_artifacts/@(Exchange|Token|TokenTransferProxy|EtherToken|TokenRegistry|DummyToken).json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/contract_wrappers/generated --backend ethers && prettier --write 'src/contract_wrappers/generated/**.ts'", "lint": "tslint --project .", "test:circleci": "run-s test:coverage", - "test": "run-s test:commonjs", - "rebuild-and-test": "run-s clean test", + "test": "run_mocha", + "rebuild-and-test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "clean": "shx rm -rf _bundles lib test_temp scripts src/contract_wrappers/generated", - "build:umd:prod": "NODE_ENV=production webpack", - "build:commonjs": "tsc && copyfiles -u 2 './src/compact_artifacts/**/*.json' ./lib/src/compact_artifacts && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", - "test:commonjs": "run-s build:commonjs run_mocha", "run_mocha": "mocha lib/test/**/*_test.js lib/test/global_hooks.js --timeout 10000 --bail --exit", "manual:postpublish": "yarn build; node ./scripts/postpublish.js", "docs:stage": "node scripts/stage_docs.js", -- cgit From 6c6fb2e2879a84422c5f608f91f17ab4cc96df5b Mon Sep 17 00:00:00 2001 From: "F. Eugene Aumson" Date: Mon, 4 Jun 2018 21:37:47 -0400 Subject: Fix broken link to `contract_templates` Note there is still a broken link here, the "wrapper files" one in the second paragraph. --- packages/abi-gen/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/abi-gen/README.md b/packages/abi-gen/README.md index 4240ba7ba..c5dd7f0f5 100644 --- a/packages/abi-gen/README.md +++ b/packages/abi-gen/README.md @@ -5,7 +5,7 @@ It's heavily inspired by [Geth abigen](https://github.com/ethereum/go-ethereum/w You can write your custom handlebars templates which will allow you to seamlessly integrate the generated code into your existing codebase with existing conventions. For an example of the generated [wrapper files](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/src/contract_wrappers/generated) check out 0x.js. -[Here](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/contract_templates) are the templates used to generate those files. +[Here](https://github.com/0xProject/0x-monorepo/tree/development/packages/contract_templates) are the templates used to generate those files. ## Installation @@ -45,7 +45,7 @@ You need to also specify the location of your main template used for every contr ## How to write custom templates? -The best way to get started is to copy [0x.js templates](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/contract_templates) and start adjusting them for your needs. +The best way to get started is to copy [0x.js templates](https://github.com/0xProject/0x-monorepo/tree/development/packages/contract_templates) and start adjusting them for your needs. We use [handlebars](http://handlebarsjs.com/) template engine under the hood. You need to have a master template called `contract.mustache`. it will be used to generate each contract wrapper. Although - you don't need and probably shouldn't write all your logic in a single template file. You can write [partial templates](http://handlebarsjs.com/partials.html) and as long as they are within a partials folder - they will be registered and available. -- cgit From 44b62852682df3095890246506308259adb05542 Mon Sep 17 00:00:00 2001 From: Alex Browne Date: Mon, 4 Jun 2018 18:28:27 -0700 Subject: Remove duplicate cleans in package.json when clean is called in prebuild --- packages/0x.js/package.json | 2 +- packages/contract-wrappers/package.json | 2 +- packages/metacoin/package.json | 2 +- packages/order-watcher/package.json | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/0x.js/package.json b/packages/0x.js/package.json index e9aa95265..4de046a07 100644 --- a/packages/0x.js/package.json +++ b/packages/0x.js/package.json @@ -21,7 +21,7 @@ "generate_contract_wrappers": "abi-gen --abis 'src/compact_artifacts/@(Exchange|Token|TokenTransferProxy|EtherToken|TokenRegistry|DummyToken).json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/contract_wrappers/generated --backend ethers && prettier --write 'src/contract_wrappers/generated/**.ts'", "lint": "tslint --project .", "test:circleci": "run-s test:coverage", - "test": "run_mocha", + "test": "yarn run_mocha", "rebuild-and-test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", diff --git a/packages/contract-wrappers/package.json b/packages/contract-wrappers/package.json index 66ad00cd6..1cef3d8cf 100644 --- a/packages/contract-wrappers/package.json +++ b/packages/contract-wrappers/package.json @@ -17,7 +17,7 @@ "lint": "tslint --project .", "test:circleci": "run-s test:coverage", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild-and-test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "update_artifacts": "for i in ${npm_package_config_contracts}; do copyfiles -u 4 ../migrations/artifacts/1.0.0/$i.json test/artifacts; done;", diff --git a/packages/metacoin/package.json b/packages/metacoin/package.json index ca6361eba..19582327a 100644 --- a/packages/metacoin/package.json +++ b/packages/metacoin/package.json @@ -14,7 +14,7 @@ "copy_artifacts": "copyfiles './artifacts/**/*' './contracts/**/*' ./lib", "build": "tsc", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild-and-test": "run-s build test", "test:coverage": "SOLIDITY_COVERAGE=true run-s build run_mocha coverage:report:text coverage:report:lcov", "run_mocha": "mocha lib/test/**/*_test.js lib/test/global_hooks.js --bail --exit", "generate_contract_wrappers": "abi-gen --abis 'artifacts/Metacoin.json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/contract_wrappers --backend ethers && prettier --write 'src/contract_wrappers/**.ts'", diff --git a/packages/order-watcher/package.json b/packages/order-watcher/package.json index 3efb92ae5..44954165d 100644 --- a/packages/order-watcher/package.json +++ b/packages/order-watcher/package.json @@ -18,7 +18,7 @@ "lint": "tslint --project .", "test:circleci": "run-s test:coverage", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild-and-test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "update_artifacts": "for i in ${npm_package_config_contracts}; do copyfiles -u 4 ../migrations/artifacts/1.0.0/$i.json test/artifacts; done;", -- cgit From 28d019f82417cee3651848d697edb6e2736c407c Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 5 Jun 2018 11:13:55 +0200 Subject: Use _.omit for conciseness --- packages/fill-scenarios/src/index.ts | 20 +++++--------------- 1 file changed, 5 insertions(+), 15 deletions(-) diff --git a/packages/fill-scenarios/src/index.ts b/packages/fill-scenarios/src/index.ts index de62694c1..dc877a0fd 100644 --- a/packages/fill-scenarios/src/index.ts +++ b/packages/fill-scenarios/src/index.ts @@ -1,5 +1,5 @@ import { assetProxyUtils, orderFactory } from '@0xproject/order-utils'; -import { SignedOrder, Token } from '@0xproject/types'; +import { OrderWithoutExchangeAddress, SignedOrder, Token } from '@0xproject/types'; import { BigNumber } from '@0xproject/utils'; import { Web3Wrapper } from '@0xproject/web3-wrapper'; import { Provider } from 'ethereum-types'; @@ -144,20 +144,10 @@ export class FillScenarios { this._web3Wrapper.getContractDefaults(), ); - const orderWithoutExchangeAddress = { - senderAddress: signedOrder.senderAddress, - makerAddress: signedOrder.makerAddress, - takerAddress: signedOrder.takerAddress, - feeRecipientAddress: signedOrder.feeRecipientAddress, - makerAssetAmount: signedOrder.makerAssetAmount, - takerAssetAmount: signedOrder.takerAssetAmount, - makerFee: signedOrder.makerFee, - takerFee: signedOrder.takerFee, - expirationTimeSeconds: signedOrder.expirationTimeSeconds, - salt: signedOrder.salt, - makerAssetData: signedOrder.makerAssetData, - takerAssetData: signedOrder.takerAssetData, - }; + const orderWithoutExchangeAddress = _.omit(signedOrder, [ + 'signature', + 'exchangeAddress', + ]) as OrderWithoutExchangeAddress; await exchangeInstance.fillOrder.sendTransactionAsync( orderWithoutExchangeAddress, -- cgit From 57b65726d65378deed6506de1287d9b8e2d2c6ec Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 5 Jun 2018 12:16:25 +0200 Subject: Remove outdated link in ABI-gen README --- packages/abi-gen/README.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/abi-gen/README.md b/packages/abi-gen/README.md index 4240ba7ba..123be11d9 100644 --- a/packages/abi-gen/README.md +++ b/packages/abi-gen/README.md @@ -4,8 +4,7 @@ This package allows you to generate TypeScript contract wrappers from ABI files. It's heavily inspired by [Geth abigen](https://github.com/ethereum/go-ethereum/wiki/Native-DApps:-Go-bindings-to-Ethereum-contracts) but takes a different approach. You can write your custom handlebars templates which will allow you to seamlessly integrate the generated code into your existing codebase with existing conventions. -For an example of the generated [wrapper files](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/src/contract_wrappers/generated) check out 0x.js. -[Here](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/contract_templates) are the templates used to generate those files. +[Here](https://github.com/0xProject/0x-monorepo/tree/development/packages/0x.js/contract_templates) are the templates used to generate the contract wrappers used by 0x.js. ## Installation -- cgit From cc6338d0482abd2db253b8755109d4aec801e88d Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 5 Jun 2018 12:19:28 +0200 Subject: Add `switch-default` tslint rule and add missing default statement --- packages/tslint-config/tslint.json | 1 + packages/website/ts/pages/landing/landing.tsx | 3 +++ 2 files changed, 4 insertions(+) diff --git a/packages/tslint-config/tslint.json b/packages/tslint-config/tslint.json index 77a1f41cc..ec414fb71 100644 --- a/packages/tslint-config/tslint.json +++ b/packages/tslint-config/tslint.json @@ -7,6 +7,7 @@ "async-suffix": true, "boolean-naming": true, "no-switch-case-fall-through": true, + "switch-default": true, "await-promise": true, "custom-no-magic-numbers": [true, 0, 1, 2, 3, -1], "binary-expression-operand-order": true, diff --git a/packages/website/ts/pages/landing/landing.tsx b/packages/website/ts/pages/landing/landing.tsx index 02ecfa117..9d5e54c22 100644 --- a/packages/website/ts/pages/landing/landing.tsx +++ b/packages/website/ts/pages/landing/landing.tsx @@ -349,6 +349,9 @@ export class Landing extends React.Component { case ScreenWidths.Lg: colWidth = isRelayersOnly ? 2 : 2 - i % 2; break; + + default: + throw new Error(`Encountered unknown ScreenWidths value: ${this.state.screenWidth}`); } return (
-- cgit From 86a6a5b826158fbf3b16081a2ecdbb020140adda Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 5 Jun 2018 12:20:23 +0200 Subject: Replace `-` with `_` in yarn script name so that we are consistent across yarn script names --- packages/0x.js/package.json | 2 +- packages/assert/package.json | 2 +- packages/base-contract/package.json | 2 +- packages/connect/package.json | 2 +- packages/contract-wrappers/package.json | 2 +- packages/contracts/package.json | 2 +- packages/dev-utils/package.json | 2 +- packages/json-schemas/package.json | 2 +- packages/metacoin/package.json | 2 +- packages/order-utils/package.json | 2 +- packages/order-watcher/package.json | 2 +- packages/sol-compiler/package.json | 2 +- packages/sol-cov/package.json | 2 +- packages/sra-report/package.json | 2 +- packages/web3-wrapper/package.json | 2 +- 15 files changed, 15 insertions(+), 15 deletions(-) diff --git a/packages/0x.js/package.json b/packages/0x.js/package.json index 4de046a07..e8b944498 100644 --- a/packages/0x.js/package.json +++ b/packages/0x.js/package.json @@ -22,7 +22,7 @@ "lint": "tslint --project .", "test:circleci": "run-s test:coverage", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "clean": "shx rm -rf _bundles lib test_temp scripts src/contract_wrappers/generated", diff --git a/packages/assert/package.json b/packages/assert/package.json index bec4a9137..6f525f504 100644 --- a/packages/assert/package.json +++ b/packages/assert/package.json @@ -15,7 +15,7 @@ "run_mocha": "mocha lib/test/**/*_test.js --exit", "prepublishOnly": "run-p build", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "test:circleci": "yarn test:coverage", diff --git a/packages/base-contract/package.json b/packages/base-contract/package.json index 62e37d80b..81d8442e1 100644 --- a/packages/base-contract/package.json +++ b/packages/base-contract/package.json @@ -12,7 +12,7 @@ "build": "tsc && copyfiles -u 2 './lib/monorepo_scripts/**/*' ./scripts", "clean": "shx rm -rf lib scripts", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:circleci": "yarn test:coverage", "run_mocha": "mocha lib/test/**/*_test.js --bail --exit", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", diff --git a/packages/connect/package.json b/packages/connect/package.json index fa91bf632..1545fe25f 100644 --- a/packages/connect/package.json +++ b/packages/connect/package.json @@ -22,7 +22,7 @@ "lint": "tslint --project .", "run_mocha": "mocha lib/test/**/*_test.js --exit", "test": "run-s copy_test_fixtures run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "test:circleci": "yarn test:coverage", diff --git a/packages/contract-wrappers/package.json b/packages/contract-wrappers/package.json index 1cef3d8cf..ca70ad2dd 100644 --- a/packages/contract-wrappers/package.json +++ b/packages/contract-wrappers/package.json @@ -17,7 +17,7 @@ "lint": "tslint --project .", "test:circleci": "run-s test:coverage", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "update_artifacts": "for i in ${npm_package_config_contracts}; do copyfiles -u 4 ../migrations/artifacts/1.0.0/$i.json test/artifacts; done;", diff --git a/packages/contracts/package.json b/packages/contracts/package.json index 8e37a7819..5982d76bf 100644 --- a/packages/contracts/package.json +++ b/packages/contracts/package.json @@ -16,7 +16,7 @@ "copy_artifacts": "copyfiles -u 4 '../migrations/artifacts/2.0.0/**/*' ./lib/src/artifacts;", "build": "tsc", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:coverage": "SOLIDITY_COVERAGE=true run-s build run_mocha coverage:report:text coverage:report:lcov", "run_mocha": "mocha 'lib/test/**/*.js' --timeout 100000 --bail --exit", "compile": "sol-compiler", diff --git a/packages/dev-utils/package.json b/packages/dev-utils/package.json index 997340010..db794dab3 100644 --- a/packages/dev-utils/package.json +++ b/packages/dev-utils/package.json @@ -11,7 +11,7 @@ "watch": "tsc -w", "build": "tsc && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:circleci": "yarn test:coverage", "run_mocha": "mocha lib/test/**/*_test.js --bail --exit", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", diff --git a/packages/json-schemas/package.json b/packages/json-schemas/package.json index 75d01a1e9..1439fe471 100644 --- a/packages/json-schemas/package.json +++ b/packages/json-schemas/package.json @@ -11,7 +11,7 @@ "watch": "tsc -w", "lint": "tslint --project .", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "test:circleci": "yarn test:coverage", diff --git a/packages/metacoin/package.json b/packages/metacoin/package.json index 19582327a..5938c59a1 100644 --- a/packages/metacoin/package.json +++ b/packages/metacoin/package.json @@ -14,7 +14,7 @@ "copy_artifacts": "copyfiles './artifacts/**/*' './contracts/**/*' ./lib", "build": "tsc", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:coverage": "SOLIDITY_COVERAGE=true run-s build run_mocha coverage:report:text coverage:report:lcov", "run_mocha": "mocha lib/test/**/*_test.js lib/test/global_hooks.js --bail --exit", "generate_contract_wrappers": "abi-gen --abis 'artifacts/Metacoin.json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/contract_wrappers --backend ethers && prettier --write 'src/contract_wrappers/**.ts'", diff --git a/packages/order-utils/package.json b/packages/order-utils/package.json index 5a04c58f7..41c2f8757 100644 --- a/packages/order-utils/package.json +++ b/packages/order-utils/package.json @@ -15,7 +15,7 @@ "generate_contract_wrappers": "abi-gen --abis 'lib/src/artifacts/@(Exchange|IWallet|IValidator).json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/generated_contract_wrappers --backend ethers && prettier --write 'src/generated_contract_wrappers/**.ts'", "update_artifacts": "for i in ${npm_package_config_contracts}; do copyfiles -u 4 ../migrations/artifacts/2.0.0/$i.json lib/src/artifacts; done;", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:circleci": "yarn test:coverage", "run_mocha": "mocha lib/test/**/*_test.js --bail --exit", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", diff --git a/packages/order-watcher/package.json b/packages/order-watcher/package.json index 44954165d..6dc570c9c 100644 --- a/packages/order-watcher/package.json +++ b/packages/order-watcher/package.json @@ -18,7 +18,7 @@ "lint": "tslint --project .", "test:circleci": "run-s test:coverage", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "update_artifacts": "for i in ${npm_package_config_contracts}; do copyfiles -u 4 ../migrations/artifacts/1.0.0/$i.json test/artifacts; done;", diff --git a/packages/sol-compiler/package.json b/packages/sol-compiler/package.json index 8d26179b5..968139a86 100644 --- a/packages/sol-compiler/package.json +++ b/packages/sol-compiler/package.json @@ -11,7 +11,7 @@ "watch": "tsc -w", "build": "yarn clean && copyfiles 'test/fixtures/contracts/**/*' ./lib && tsc && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", "test": "yarn run_mocha", - "rebuild-and-test": "run-s build test", + "rebuild_and_test": "run-s build test", "run_mocha": "mocha lib/test/*_test.js --bail --exit", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", diff --git a/packages/sol-cov/package.json b/packages/sol-cov/package.json index d10d277b9..a159afed7 100644 --- a/packages/sol-cov/package.json +++ b/packages/sol-cov/package.json @@ -11,7 +11,7 @@ "watch": "tsc -w", "lint": "tslint --project .", "test": "run-s compile_test run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "test:circleci": "yarn test:coverage", diff --git a/packages/sra-report/package.json b/packages/sra-report/package.json index 27bf715a8..a459ec180 100644 --- a/packages/sra-report/package.json +++ b/packages/sra-report/package.json @@ -13,7 +13,7 @@ "build": "tsc && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", "lint": "tslint --project .", "test": "run-s copy_test_environments copy_test_fixtures run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "copy_test_fixtures": "copyfiles -u 2 './test/fixtures/**/*.json' ./lib/test/fixtures", "copy_test_environments": "copyfiles -u 2 './test/environments/**/*.json' ./lib/test/environments", "run_mocha": "mocha lib/test/**/*_test.js --exit", diff --git a/packages/web3-wrapper/package.json b/packages/web3-wrapper/package.json index 01f0f3a26..e98b247b4 100644 --- a/packages/web3-wrapper/package.json +++ b/packages/web3-wrapper/package.json @@ -13,7 +13,7 @@ "clean": "shx rm -rf lib scripts", "lint": "tslint --project .", "test": "yarn run_mocha", - "rebuild-and-test": "run-s clean build test", + "rebuild_and_test": "run-s clean build test", "test:circleci": "yarn test:coverage", "run_mocha": "mocha lib/test/**/*_test.js --bail --exit", "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", -- cgit From 05b9dfbe30c55a67e6d2d63898f52e5fa412fcfb Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Tue, 5 Jun 2018 12:29:32 +0200 Subject: Mention the gasLimit until in the doc comment --- packages/contract-wrappers/src/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/contract-wrappers/src/types.ts b/packages/contract-wrappers/src/types.ts index 9a463d635..384f032c2 100644 --- a/packages/contract-wrappers/src/types.ts +++ b/packages/contract-wrappers/src/types.ts @@ -158,7 +158,7 @@ export interface MethodOpts { /** * gasPrice: Gas price in Wei to use for a transaction - * gasLimit: The amount of gas to send with a transaction + * gasLimit: The amount of gas to send with a transaction (in Gwei) */ export interface TransactionOpts { gasPrice?: BigNumber; -- cgit From 8de3f03b4982f14459b10a0ef1d60ab713d5c7be Mon Sep 17 00:00:00 2001 From: fragosti Date: Tue, 5 Jun 2018 12:59:10 -0700 Subject: Use stricter check for subscribe input text --- packages/website/ts/components/forms/subscribe_form.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx index 4bef3a7b6..04ef28e70 100644 --- a/packages/website/ts/components/forms/subscribe_form.tsx +++ b/packages/website/ts/components/forms/subscribe_form.tsx @@ -1,4 +1,5 @@ import { colors } from '@0xproject/react-shared'; +import * as _ from 'lodash'; import * as React from 'react'; import { Button } from 'ts/components/ui/button'; @@ -102,7 +103,7 @@ export class SubscribeForm extends React.Component): Promise { event.preventDefault(); - if (!this.state.emailText) { + if (_.isUndefined(this.state.emailText) || _.isEmpty(this.state.emailText)) { return; } this.setState({ -- cgit From afcb7f00da247f03782624e4694061325d53bb55 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 5 Jun 2018 15:37:51 -0700 Subject: Move prices into portal --- packages/website/ts/components/portal/portal.tsx | 32 ++++++++++++++++++++++++ packages/website/ts/components/wallet/wallet.tsx | 30 ---------------------- 2 files changed, 32 insertions(+), 30 deletions(-) diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index 9aa83546a..90d45208f 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -34,6 +34,7 @@ import { Dispatcher } from 'ts/redux/dispatcher'; import { BlockchainErrs, HashData, + ItemByAddress, Order, ProviderType, ScreenWidths, @@ -43,6 +44,7 @@ import { TokenVisibility, WebsitePaths, } from 'ts/types'; +import { backendClient } from 'ts/utils/backend_client'; import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; import { orderParser } from 'ts/utils/order_parser'; @@ -587,6 +589,7 @@ export class Portal extends React.Component { return this._blockchain.getTokenBalanceAndAllowanceAsync(userAddressIfExists, tokenAddress); }), ); + const priceByAddress = await this._getPriceByAddressAsync(tokenAddresses); for (let i = 0; i < tokenAddresses.length; i++) { // Order is preserved in Promise.all const [balance, allowance] = balancesAndAllowances[i]; @@ -595,6 +598,7 @@ export class Portal extends React.Component { balance, allowance, isLoaded: true, + price: priceByAddress[tokenAddress], }; } this.setState({ @@ -602,6 +606,34 @@ export class Portal extends React.Component { }); } + private async _getPriceByAddressAsync(tokenAddresses: string[]): Promise> { + if (_.isEmpty(tokenAddresses)) { + return {}; + } + // for each input token address, search for the corresponding symbol in this.props.tokenByAddress, if it exists + // create a mapping from existing symbols -> address + const tokenAddressBySymbol: { [symbol: string]: string } = {}; + _.each(tokenAddresses, address => { + const tokenIfExists = _.get(this.props.tokenByAddress, address); + if (!_.isUndefined(tokenIfExists)) { + const symbol = tokenIfExists.symbol; + tokenAddressBySymbol[symbol] = address; + } + }); + const tokenSymbols = _.keys(tokenAddressBySymbol); + try { + const priceBySymbol = await backendClient.getPriceInfoAsync(tokenSymbols); + const priceByAddress = _.mapKeys(priceBySymbol, (value, symbol) => _.get(tokenAddressBySymbol, symbol)); + const result = _.mapValues(priceByAddress, price => { + const priceBigNumber = new BigNumber(price); + return priceBigNumber; + }); + return result; + } catch (err) { + return {}; + } + } + private async _refetchTokenStateAsync(tokenAddress: string): Promise { await this._fetchBalancesAndAllowancesAsync([tokenAddress]); } diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx index 4383179a1..37233930e 100644 --- a/packages/website/ts/components/wallet/wallet.tsx +++ b/packages/website/ts/components/wallet/wallet.tsx @@ -37,7 +37,6 @@ import { zIndex } from 'ts/style/z_index'; import { BalanceErrs, BlockchainErrs, - ItemByAddress, ProviderType, ScreenWidths, Side, @@ -47,7 +46,6 @@ import { TokenStateByAddress, WebsitePaths, } from 'ts/types'; -import { backendClient } from 'ts/utils/backend_client'; import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; import { styles as walletItemStyles } from 'ts/utils/wallet_item_styles'; @@ -523,34 +521,6 @@ export class Wallet extends React.Component { }); return trackedTokenStateByAddress; } - - private async _getPriceByAddressAsync(tokenAddresses: string[]): Promise> { - if (_.isEmpty(tokenAddresses)) { - return {}; - } - // for each input token address, search for the corresponding symbol in this.props.tokenByAddress, if it exists - // create a mapping from existing symbols -> address - const tokenAddressBySymbol: { [symbol: string]: string } = {}; - _.each(tokenAddresses, address => { - const tokenIfExists = _.get(this.props.tokenByAddress, address); - if (!_.isUndefined(tokenIfExists)) { - const symbol = tokenIfExists.symbol; - tokenAddressBySymbol[symbol] = address; - } - }); - const tokenSymbols = _.keys(tokenAddressBySymbol); - try { - const priceBySymbol = await backendClient.getPriceInfoAsync(tokenSymbols); - const priceByAddress = _.mapKeys(priceBySymbol, (value, symbol) => _.get(tokenAddressBySymbol, symbol)); - const result = _.mapValues(priceByAddress, price => { - const priceBigNumber = new BigNumber(price); - return priceBigNumber; - }); - return result; - } catch (err) { - return {}; - } - } private _openWrappedEtherActionRow(wrappedEtherDirection: Side): void { this.setState({ wrappedEtherDirection, -- cgit From e0af60d8a7e50227ea842e268c5c2712a975f573 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 5 Jun 2018 16:10:15 -0700 Subject: Move portal disclaimer to the account management section --- packages/website/ts/components/portal/portal.tsx | 34 +++++++++++++----------- 1 file changed, 18 insertions(+), 16 deletions(-) diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index 9aa83546a..e9f82047e 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -266,10 +266,6 @@ export class Portal extends React.Component { toggleDialogFn={updateShouldBlockchainErrDialogBeOpen} networkId={this.props.networkId} /> - {this.props.blockchainIsLoaded && ( { }, ]; return ( - - {_.map(accountManagementItems, item => { - return ( - - ); - })}} - - +
+ + {_.map(accountManagementItems, item => { + return ( + + ); + })}} + + + +
); } private _renderAccountManagementItem(item: AccountManagementItem): React.ReactNode { -- cgit From 7ee7f9978049383030be8fd95100a9dfcd1923a3 Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Tue, 5 Jun 2018 16:29:18 -0700 Subject: Add back UMD bundles for 0x.js --- packages/0x.js/package.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/0x.js/package.json b/packages/0x.js/package.json index 4de046a07..9fd14b1f9 100644 --- a/packages/0x.js/package.json +++ b/packages/0x.js/package.json @@ -17,7 +17,7 @@ "scripts": { "watch": "tsc -w", "prebuild": "run-s clean generate_contract_wrappers", - "build": "tsc && copyfiles -u 2 './src/compact_artifacts/**/*.json' ./lib/src/compact_artifacts && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", + "build": "run-p build:umd:prod build:commonjs; exit 0;", "generate_contract_wrappers": "abi-gen --abis 'src/compact_artifacts/@(Exchange|Token|TokenTransferProxy|EtherToken|TokenRegistry|DummyToken).json' --template ../contract_templates/contract.handlebars --partials '../contract_templates/partials/**/*.handlebars' --output src/contract_wrappers/generated --backend ethers && prettier --write 'src/contract_wrappers/generated/**.ts'", "lint": "tslint --project .", "test:circleci": "run-s test:coverage", @@ -26,6 +26,8 @@ "test:coverage": "nyc npm run test --all && yarn coverage:report:lcov", "coverage:report:lcov": "nyc report --reporter=text-lcov > coverage/lcov.info", "clean": "shx rm -rf _bundles lib test_temp scripts src/contract_wrappers/generated", + "build:umd:prod": "NODE_ENV=production webpack", + "build:commonjs": "tsc && copyfiles -u 2 './src/compact_artifacts/**/*.json' ./lib/src/compact_artifacts && copyfiles -u 3 './lib/src/monorepo_scripts/**/*' ./scripts", "run_mocha": "mocha lib/test/**/*_test.js lib/test/global_hooks.js --timeout 10000 --bail --exit", "manual:postpublish": "yarn build; node ./scripts/postpublish.js", "docs:stage": "node scripts/stage_docs.js", -- cgit From 479c18e21f86870072abca46167b0fca4cf72dac Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Tue, 5 Jun 2018 16:41:17 -0700 Subject: Fix prettier --- packages/website/ts/components/ui/text.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx index d3e205d12..259365618 100644 --- a/packages/website/ts/components/ui/text.tsx +++ b/packages/website/ts/components/ui/text.tsx @@ -52,5 +52,5 @@ export const TranslatedText: React.StatelessComponent = ({ translate, children, deco, - ...textProps, + ...textProps }) => {translate.get(children, deco)}; -- cgit From 39570a9663abae56b0220745306386197fae65c1 Mon Sep 17 00:00:00 2001 From: fragosti Date: Tue, 5 Jun 2018 21:49:14 -0700 Subject: Remove TranslatedText --- packages/website/ts/components/ui/text.tsx | 15 --------------- 1 file changed, 15 deletions(-) diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx index 259365618..99bf89966 100644 --- a/packages/website/ts/components/ui/text.tsx +++ b/packages/website/ts/components/ui/text.tsx @@ -39,18 +39,3 @@ Text.defaultProps = { }; Text.displayName = 'Text'; - -interface TranslatedProps { - children: Key; - translate: Translate; - deco?: Deco; -} - -export type TranslatedTextProps = TextProps & TranslatedProps; - -export const TranslatedText: React.StatelessComponent = ({ - translate, - children, - deco, - ...textProps -}) => {translate.get(children, deco)}; -- cgit