diff options
Diffstat (limited to 'packages')
| -rw-r--r-- | packages/website/ts/components/forms/subscribe_form.tsx | 68 | ||||
| -rw-r--r-- | packages/website/ts/components/token_balances.tsx | 2 | ||||
| -rw-r--r-- | packages/website/ts/pages/landing/landing.tsx | 2 | ||||
| -rw-r--r-- | packages/website/ts/utils/backend_client.ts | 8 | ||||
| -rw-r--r-- | packages/website/ts/utils/fetch_utils.ts | 12 | ||||
| -rw-r--r-- | packages/website/ts/utils/utils.ts | 3 |
6 files changed, 93 insertions, 2 deletions
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<SubscribeFormProps, SubscribeFormState> { + public state = { + emailText: '', + status: SubscribeFormStatus.None, + }; + public render(): React.ReactNode { + return ( + <div> + Subscribe to our newsletter for 0x relayer and dApp updates + <div> + <input value={this.state.emailText} onChange={this._handleEmailInputChange.bind(this)} /> + <RaisedButton + labelStyle={{ + textTransform: 'none', + fontSize: 15, + fontWeight: 400, + }} + buttonStyle={{ + borderRadius: 6, + }} + style={{ + boxShadow: '0px 0px 4px rgba(0, 0, 0, 0.25)', + borderRadius: 6, + height: 48, + width: 120, + }} + labelColor="white" + backgroundColor="#252525" + onClick={this._handleSubscribeClickAsync.bind(this)} + label="Subscribe" + /> + </div> + </div> + ); + } + private _handleEmailInputChange(event: React.ChangeEvent<HTMLInputElement>): void { + this.setState({ emailText: event.target.value }); + } + private async _handleSubscribeClickAsync(): Promise<void> { + 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<TokenBalancesProps, TokenBalancesState> { 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<LandingProps, LandingState> { </a> </div> </div> + <SubscribeForm /> </div> </div> </div> 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<WebsiteBackendGasInfo> { @@ -33,4 +34,11 @@ export const backendClient = { const result = await fetchUtils.requestAsync(utils.getBackendBaseUrl(), WIKI_ENDPOINT); return result; }, + async subscribeToNewsletterAsync(email: string): Promise<boolean> { + 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<Response> { + 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; |