From f8edef66e4eed8fbf26d85b244bf73cae86bc736 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Mon, 15 Oct 2018 17:22:15 -0700 Subject: fix: add Steve's github account to about page, and capitalize AppFolio correctly --- packages/website/ts/pages/about/about.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'packages/website') diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx index 2629f8632..3ede56a71 100644 --- a/packages/website/ts/pages/about/about.tsx +++ b/packages/website/ts/pages/about/about.tsx @@ -244,9 +244,10 @@ const teamRow9: ProfileInfo[] = [ { name: 'Steve Klebanoff', title: 'Senior Engineer', - description: ` Full-stack engineer. Previously Staff Software Engineer at Appfolio. Computer Science & Cognitive Psychology at Northeastern University.`, + description: ` Full-stack engineer. Previously Staff Software Engineer at AppFolio. Computer Science & Cognitive Psychology at Northeastern University.`, image: 'images/team/steve.png', linkedIn: 'https://www.linkedin.com/in/steveklebanoff/', + github: 'https://github.com/steveklebanoff', }, ]; -- cgit v1.2.3 From aa1085c8f3866da4965c0102be27c0f5e19b3db6 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Mon, 15 Oct 2018 23:27:56 -0700 Subject: feat(website): add asset-buyer documentation --- .../website/md/docs/asset_buyer/installation.md | 17 ++++++ .../website/md/docs/asset_buyer/introduction.md | 1 + packages/website/md/docs/asset_buyer/usage.md | 39 ++++++++++++ packages/website/translations/english.json | 1 + packages/website/ts/components/top_bar/top_bar.tsx | 7 +++ .../ts/containers/asset_buyer_documentation.ts | 69 ++++++++++++++++++++++ packages/website/ts/index.tsx | 8 ++- .../website/ts/pages/documentation/doc_page.tsx | 1 + packages/website/ts/types.ts | 3 + 9 files changed, 145 insertions(+), 1 deletion(-) create mode 100644 packages/website/md/docs/asset_buyer/installation.md create mode 100644 packages/website/md/docs/asset_buyer/introduction.md create mode 100644 packages/website/md/docs/asset_buyer/usage.md create mode 100644 packages/website/ts/containers/asset_buyer_documentation.ts (limited to 'packages/website') diff --git a/packages/website/md/docs/asset_buyer/installation.md b/packages/website/md/docs/asset_buyer/installation.md new file mode 100644 index 000000000..483ee2b65 --- /dev/null +++ b/packages/website/md/docs/asset_buyer/installation.md @@ -0,0 +1,17 @@ +**Install** + +```bash +yarn add @0xproject/asset-buyer +``` + +**Import** + +```javascript +import { AssetBuyer } from '@0xproject/asset-buyer'; +``` + +or + +```javascript +var AssetBuyer = require('@0xproject/asset-buyer').AssetBuyer; +``` diff --git a/packages/website/md/docs/asset_buyer/introduction.md b/packages/website/md/docs/asset_buyer/introduction.md new file mode 100644 index 000000000..a40d20cc9 --- /dev/null +++ b/packages/website/md/docs/asset_buyer/introduction.md @@ -0,0 +1 @@ +Welcome to the [@0xproject/asset-buyer](https://github.com/0xProject/0x-monorepo/tree/development/packages/asset-buyer) documentation! AssetBuyer is a library that provides an easy way to buy any asset with ETH in one click, leveraging 0x liquidity and the [Forwarder contract](https://0xproject.com/docs/contracts#Forwarder). diff --git a/packages/website/md/docs/asset_buyer/usage.md b/packages/website/md/docs/asset_buyer/usage.md new file mode 100644 index 000000000..93c681f40 --- /dev/null +++ b/packages/website/md/docs/asset_buyer/usage.md @@ -0,0 +1,39 @@ +**Construction** + +Connecting to a standard relayer API compliant url: + +```typescript +const provider = web3.currentProvider; +const apiUrl = 'https://api.relayer.com/v2'; +const assetBuyer = AssetBuyer.getAssetBuyerForStandardRelayerAPIUrl(provider, apiUrl); +``` + +Providing your own orders: + +```typescript +const provider = web3.currentProvider; +const orders = []; // get these from your own API, a relayer, a friend, from anywhere +const assetBuyer = AssetBuyer.getAssetBuyerForProvidedOrders(provider, orders); +``` + +**Get a quote** + +A [BuyQuote](#types-BuyQuote) object contains enough information to display buy information to an end user + +```typescript +const erc20TokenAddress = '0x5fa3c....'; +const amountToBuy = new BigNumber(50000000000000000000); +const buyQuote = await assetBuyer.getBuyQuoteForERC20TokenAddressAsync(erc20TokenAddress, amountToBuy); +const quoteInfo = buyQuote.worstCaseQuoteInfo; +console.log(quoteInfo.ethAmount); // the total amount the user needs to pay to buy the desired amount (including fees) +console.log(quoteInfo.feeAmount); // a portion of the total ethAmount above that was used to buy fees +console.log(quoteInfo.ethPerAssetPrice); // the rate that this quote provides (e.g. 0.0035ETH / REP) +``` + +**Perform a buy** + +Pass the [BuyQuote](#types-BuyQuote) object from above back to the assetBuyer in order to initiate the buy transaction + +```typescript +const txHash = await assetBuyer.executeBuyQuoteAsync(buyQuote); // the hash of the transaction submitted to the Ethereum network +``` diff --git a/packages/website/translations/english.json b/packages/website/translations/english.json index 9ce458111..ac8e4900a 100644 --- a/packages/website/translations/english.json +++ b/packages/website/translations/english.json @@ -73,6 +73,7 @@ "WIKI": "wiki", "WEB3_WRAPPER": "Web3Wrapper", "ORDER_UTILS": "Order Utils", + "ASSET_BUYER": "AssetBuyer", "FAQ": "FAQ", "SMART_CONTRACTS": "0x smart contracts", "STANDARD_RELAYER_API": "standard relayer API", diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index 7cf3c6ecb..fe2c1fcf9 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -92,6 +92,7 @@ const DOC_WEBSITE_PATHS_TO_KEY = { [WebsitePaths.ZeroExJs]: Key.ZeroExJs, [WebsitePaths.OrderUtils]: Key.OrderUtils, [WebsitePaths.OrderWatcher]: Key.OrderWatcher, + [WebsitePaths.AssetBuyer]: Key.AssetBuyer, }; const DEFAULT_HEIGHT = 68; @@ -214,6 +215,12 @@ export class TopBar extends React.Component { primaryText={this.props.translate.get(Key.EthereumTypes, Deco.CapWords)} /> , + + + , ({ + docsVersion: state.docsVersion, + availableDocVersions: state.availableDocVersions, + translate: state.translate, + docsInfo, +}); + +const mapDispatchToProps = (dispatch: Dispatch): ConnectedDispatch => ({ + dispatcher: new Dispatcher(dispatch), +}); + +export const Documentation: React.ComponentClass = connect(mapStateToProps, mapDispatchToProps)( + DocPageComponent, +); diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index d4a79cc4f..bb218eac1 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -68,6 +68,9 @@ const LazyOrderUtilsDocumentation = createLazyComponent('Documentation', async ( const LazyEthereumTypesDocumentation = createLazyComponent('Documentation', async () => import(/* webpackChunkName: "ethereumTypesDocs" */ 'ts/containers/ethereum_types_documentation'), ); +const LazyAssetBuyerDocumentation = createLazyComponent('Documentation', async () => + import(/* webpackChunkName: "assetBuyerDocs" */ 'ts/containers/asset_buyer_documentation'), +); const DOCUMENT_TITLE = '0x: The Protocol for Trading Tokens'; const DOCUMENT_DESCRIPTION = 'An Open Protocol For Decentralized Exchange On The Ethereum Blockchain'; @@ -133,7 +136,10 @@ render( path={`${WebsitePaths.EthereumTypes}/:version?`} component={LazyEthereumTypesDocumentation} /> - + {/* Legacy endpoints */} Date: Wed, 17 Oct 2018 14:02:38 +0100 Subject: Update schemas markdown section for v2 docs --- .../website/md/docs/json_schemas/2.0.0/schemas.md | 52 +++++++++++++--------- 1 file changed, 32 insertions(+), 20 deletions(-) (limited to 'packages/website') diff --git a/packages/website/md/docs/json_schemas/2.0.0/schemas.md b/packages/website/md/docs/json_schemas/2.0.0/schemas.md index 4f3200b1c..ec7cf6f15 100644 --- a/packages/website/md/docs/json_schemas/2.0.0/schemas.md +++ b/packages/website/md/docs/json_schemas/2.0.0/schemas.md @@ -1,28 +1,40 @@ +Basic Schemas + +* [Address type](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/address.json) +* [Number type](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/number.json) +* [Hex type](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/hex.json) +* [JS number](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/js_number.json) + 0x Protocol Schemas -* [Basic types](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/basic_type_schemas.ts) (e.g Ethereum address, number, hex) -* [Order/SignedOrder](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_schemas.ts) -* [OrderHash](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_hash_schema.ts) +* [Order](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_schema.json) +* [SignedOrder](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/signed_order_schema.json) +* [OrderHash](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_hash_schema.json) +* [ECSignature](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/ec_signature_schema.json) 0x.js Schemas -* [BlockRange](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/block_range_schema.ts) -* [IndexFilter Values](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/index_filter_values_schema.ts) -* [OrderFillRequests](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_fill_requests_schema.ts) -* [OrderCancellationRequests](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_cancel_schema.ts) -* [OrderFillOrKillRequests](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_fill_or_kill_requests_schema.ts) -* [SignedOrders](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/signed_orders_schema.ts) -* [Token](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/token_schema.ts) -* [TxData](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/tx_data_schema.ts) +* [BlockParam](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/block_param_schema.json) +* [BlockRange](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/block_range_schema.json) +* [IndexFilter Values](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/index_filter_values_schema.json) +* [OrderFillRequests](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_fill_requests_schema.json) +* [OrderCancellationRequests](https://github.com/0xProjet/0x-monorepo/blob/development/packages/json-schemas/schemas/order_cancel_schema.json) +* [OrderFillOrKillRequests](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/order_fill_or_kill_requests_schema.json) +* [SignedOrders](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/signed_orders_schema.json) +* [Token](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/token_schema.json) +* [TxData](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/tx_data_schema.json) Standard Relayer API Schemas -* [Paginated collection](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/paginated_collection_schema.ts) -* [Error response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_error_response_schema.ts) -* [Order config payload](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_order_config_payload_schema.ts) -* [Order config response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_order_config_response_schema.ts) -* [Orders channel subscribe](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orders_channel_subscribe_schema.ts) -* [Orders channel update](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orders_channel_update_response_schema.ts) -* [Orderbook response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orderbook_response_schema.ts) -* [Asset pairs response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_asset_pairs_response_schema.ts) -* [Fee recipients response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_fee_recipients_response_schema.ts) +* [Paginated collection](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/paginated_collection_schema.json) +* [Error response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_error_response_schema.json) +* [Order config payload](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_order_config_payload_schema.json) +* [Order config response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_order_config_response_schema.json) +* [Orders channel subscribe payload](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orders_channel_subscribe_payload_schema.json) +* [Orders channel subscribe](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orders_channel_subscribe_schema.json) +* [Orders channel update](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orders_channel_update_response_schema.json) +* [Orderbook response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_orderbook_response_schema.json) +* [Asset pairs](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_asset_pairs_schema.json) +* [Trade info](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_asset_trade_info_schema.json) +* [Asset pairs response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_asset_pairs_response_schema.json) +* [Fee recipients response](https://github.com/0xProject/0x-monorepo/blob/development/packages/json-schemas/schemas/relayer_api_fee_recipients_response_schema.json) -- cgit v1.2.3 From 75e3b44d9e2028eb8d07356c8939450240e35958 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Wed, 17 Oct 2018 10:33:05 -0700 Subject: Update asset-buyer usage wording --- packages/website/md/docs/asset_buyer/usage.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/website') diff --git a/packages/website/md/docs/asset_buyer/usage.md b/packages/website/md/docs/asset_buyer/usage.md index 93c681f40..6462d938e 100644 --- a/packages/website/md/docs/asset_buyer/usage.md +++ b/packages/website/md/docs/asset_buyer/usage.md @@ -25,8 +25,8 @@ const erc20TokenAddress = '0x5fa3c....'; const amountToBuy = new BigNumber(50000000000000000000); const buyQuote = await assetBuyer.getBuyQuoteForERC20TokenAddressAsync(erc20TokenAddress, amountToBuy); const quoteInfo = buyQuote.worstCaseQuoteInfo; -console.log(quoteInfo.ethAmount); // the total amount the user needs to pay to buy the desired amount (including fees) -console.log(quoteInfo.feeAmount); // a portion of the total ethAmount above that was used to buy fees +console.log(quoteInfo.ethAmount); // the total amount the user needs to pay to buy the desired amount (including ZRX fees) +console.log(quoteInfo.feeAmount); // a portion of the total ethAmount above that was used to buy affiliate fees console.log(quoteInfo.ethPerAssetPrice); // the rate that this quote provides (e.g. 0.0035ETH / REP) ``` -- cgit v1.2.3 From 95775dca1fbd115f57ee7cde314ebcdb9ca80c45 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 18 Oct 2018 00:10:33 -0700 Subject: feat(website): add expanded and minimized display types to relayer grid --- packages/website/ts/components/portal/portal.tsx | 9 ++++- .../components/relayer_index/relayer_grid_tile.tsx | 46 ++++++++++++++-------- .../ts/components/relayer_index/relayer_index.tsx | 23 +++++++++-- 3 files changed, 56 insertions(+), 22 deletions(-) (limited to 'packages/website') diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index b42954f60..1470239d6 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -18,7 +18,7 @@ import { Loading } from 'ts/components/portal/loading'; import { Menu, MenuTheme } from 'ts/components/portal/menu'; import { Section } from 'ts/components/portal/section'; import { TextHeader } from 'ts/components/portal/text_header'; -import { RelayerIndex } from 'ts/components/relayer_index/relayer_index'; +import { RelayerIndex, RelayerIndexCellStyle } from 'ts/components/relayer_index/relayer_index'; import { TokenBalances } from 'ts/components/token_balances'; import { TopBar, TopBarDisplayType } from 'ts/components/top_bar/top_bar'; import { TradeHistory } from 'ts/components/trade_history/trade_history'; @@ -541,6 +541,7 @@ export class Portal extends React.Component { } private _renderRelayerIndexSection(): React.ReactNode { const isMobile = utils.isMobileWidth(this.props.screenWidth); + // TODO(bmillman): revert RelayerIndex cellStyle to Expanded once data pipeline is tracking v2 volume return (
} @@ -551,7 +552,11 @@ export class Portal extends React.Component { {this._renderStartOnboarding()} )} - + } /> 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 193dd237a..a81ab107a 100644 --- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx +++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx @@ -14,9 +14,15 @@ import { styled } from 'ts/style/theme'; import { WebsiteBackendRelayerInfo } from 'ts/types'; import { utils } from 'ts/utils/utils'; +export enum RelayerGridTileStyle { + Expanded = 0, + Minimized, +} + export interface RelayerGridTileProps { relayerInfo: WebsiteBackendRelayerInfo; networkId: number; + style: RelayerGridTileStyle; } const styles: Styles = { @@ -30,10 +36,14 @@ const styles: Styles = { height: '100%', boxSizing: 'border-box', }, - header: { + expandedHeader: { height: '50%', width: '100%', }, + minimizedHeader: { + height: '100%', + width: '100%', + }, body: { height: '50%', width: '100%', @@ -75,10 +85,12 @@ export const RelayerGridTile: React.StatelessComponent = ( !_.isUndefined(headerImageUrl) && !_.isUndefined(props.relayerInfo.primaryColor) ? props.relayerInfo.primaryColor : FALLBACK_PRIMARY_COLOR; + const isExpanded = props.style === RelayerGridTileStyle.Expanded; + const headerStyle = isExpanded ? styles.expandedHeader : styles.minimizedHeader; return (
-
+
= ( height={RELAYER_ICON_HEIGHT} />
-
-
- {props.relayerInfo.name} -
-
- {!_.isUndefined(weeklyTxnVolume) && ( -
{props.relayerInfo.weeklyTxnVolume}
- )} -
- -
- {!_.isEmpty(topTokens) && } + {isExpanded && ( +
+
+ {props.relayerInfo.name} +
+
+ {!_.isUndefined(weeklyTxnVolume) && ( +
{props.relayerInfo.weeklyTxnVolume}
+ )}
- -
+ +
+ {!_.isEmpty(topTokens) && } +
+ +
+ )}
); diff --git a/packages/website/ts/components/relayer_index/relayer_index.tsx b/packages/website/ts/components/relayer_index/relayer_index.tsx index 91dbeb27a..e88c20d7e 100644 --- a/packages/website/ts/components/relayer_index/relayer_index.tsx +++ b/packages/website/ts/components/relayer_index/relayer_index.tsx @@ -3,14 +3,20 @@ import CircularProgress from 'material-ui/CircularProgress'; import { GridList } from 'material-ui/GridList'; import * as React from 'react'; -import { RelayerGridTile } from 'ts/components/relayer_index/relayer_grid_tile'; +import { RelayerGridTile, RelayerGridTileStyle } from 'ts/components/relayer_index/relayer_grid_tile'; import { Retry } from 'ts/components/ui/retry'; import { ScreenWidths, WebsiteBackendRelayerInfo } from 'ts/types'; import { backendClient } from 'ts/utils/backend_client'; +export enum RelayerIndexCellStyle { + Expanded = 0, + Minimized, +} + export interface RelayerIndexProps { networkId: number; screenWidth: ScreenWidths; + cellStyle: RelayerIndexCellStyle; } interface RelayerIndexState { @@ -18,7 +24,8 @@ interface RelayerIndexState { error?: Error; } -const CELL_HEIGHT = 290; +const CELL_HEIGHT_EXPANDED = 290; +const CELL_HEIGHT_MINIMIZED = 225; const NUMBER_OF_COLUMNS_LARGE = 3; const NUMBER_OF_COLUMNS_MEDIUM = 2; const NUMBER_OF_COLUMNS_SMALL = 2; @@ -61,15 +68,23 @@ export class RelayerIndex extends React.Component {this.state.relayerInfos.map((relayerInfo: WebsiteBackendRelayerInfo, index) => ( - + ))} ); -- cgit v1.2.3