aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/md/docs/asset_buyer/installation.md17
-rw-r--r--packages/website/md/docs/asset_buyer/introduction.md1
-rw-r--r--packages/website/md/docs/asset_buyer/usage.md39
-rw-r--r--packages/website/translations/english.json1
-rw-r--r--packages/website/ts/components/top_bar/top_bar.tsx7
-rw-r--r--packages/website/ts/containers/asset_buyer_documentation.ts69
-rw-r--r--packages/website/ts/index.tsx8
-rw-r--r--packages/website/ts/pages/documentation/doc_page.tsx1
-rw-r--r--packages/website/ts/types.ts3
9 files changed, 145 insertions, 1 deletions
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<TopBarProps, TopBarState> {
primaryText={this.props.translate.get(Key.EthereumTypes, Deco.CapWords)}
/>
</Link>,
+ <Link key="subMenuItem-asset-buyer" to={WebsitePaths.AssetBuyer} className="text-decoration-none">
+ <MenuItem
+ style={{ fontSize: styles.menuItem.fontSize }}
+ primaryText={this.props.translate.get(Key.AssetBuyer, Deco.CapWords)}
+ />
+ </Link>,
<a
key="subMenuItem-whitePaper"
target="_blank"
diff --git a/packages/website/ts/containers/asset_buyer_documentation.ts b/packages/website/ts/containers/asset_buyer_documentation.ts
new file mode 100644
index 000000000..f794625de
--- /dev/null
+++ b/packages/website/ts/containers/asset_buyer_documentation.ts
@@ -0,0 +1,69 @@
+import { DocsInfo, DocsInfoConfig, SupportedDocJson } from '@0xproject/react-docs';
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Dispatch } from 'redux';
+import { DocPage as DocPageComponent, DocPageProps } from 'ts/pages/documentation/doc_page';
+import { Dispatcher } from 'ts/redux/dispatcher';
+import { State } from 'ts/redux/reducer';
+import { DocPackages } from 'ts/types';
+import { Translate } from 'ts/utils/translate';
+
+/* tslint:disable:no-var-requires */
+const IntroMarkdown = require('md/docs/asset_buyer/introduction');
+const InstallationMarkdown = require('md/docs/asset_buyer/installation');
+const UsageMarkdown = require('md/docs/asset_buyer/usage');
+/* tslint:enable:no-var-requires */
+
+const markdownSections = {
+ introduction: 'introduction',
+ installation: 'installation',
+ usage: 'usage',
+};
+
+const docsInfoConfig: DocsInfoConfig = {
+ id: DocPackages.AssetBuyer,
+ packageName: '@0xproject/asset-buyer',
+ type: SupportedDocJson.TypeDoc,
+ displayName: 'AssetBuyer',
+ packageUrl: 'https://github.com/0xProject/0x-monorepo',
+ markdownMenu: {
+ introduction: [markdownSections.introduction],
+ install: [markdownSections.installation],
+ usage: [markdownSections.usage],
+ },
+ sectionNameToMarkdownByVersion: {
+ '0.0.1': {
+ [markdownSections.introduction]: IntroMarkdown,
+ [markdownSections.installation]: InstallationMarkdown,
+ [markdownSections.usage]: UsageMarkdown,
+ },
+ },
+ markdownSections,
+};
+const docsInfo = new DocsInfo(docsInfoConfig);
+
+interface ConnectedState {
+ docsVersion: string;
+ availableDocVersions: string[];
+ docsInfo: DocsInfo;
+ translate: Translate;
+}
+
+interface ConnectedDispatch {
+ dispatcher: Dispatcher;
+}
+
+const mapStateToProps = (state: State, _ownProps: DocPageProps): ConnectedState => ({
+ docsVersion: state.docsVersion,
+ availableDocVersions: state.availableDocVersions,
+ translate: state.translate,
+ docsInfo,
+});
+
+const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
+ dispatcher: new Dispatcher(dispatch),
+});
+
+export const Documentation: React.ComponentClass<DocPageProps> = 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}
/>
-
+ <Route
+ path={`${WebsitePaths.AssetBuyer}/:version?`}
+ component={LazyAssetBuyerDocumentation}
+ />
{/* Legacy endpoints */}
<Route
path={`${WebsiteLegacyPaths.ZeroExJs}/:version?`}
diff --git a/packages/website/ts/pages/documentation/doc_page.tsx b/packages/website/ts/pages/documentation/doc_page.tsx
index 87a806b2b..135581fc9 100644
--- a/packages/website/ts/pages/documentation/doc_page.tsx
+++ b/packages/website/ts/pages/documentation/doc_page.tsx
@@ -43,6 +43,7 @@ const docIdToSubpackageName: { [id: string]: string } = {
[DocPackages.OrderUtils]: 'order-utils',
[DocPackages.OrderWatcher]: 'order-watcher',
[DocPackages.EthereumTypes]: 'ethereum-types',
+ [DocPackages.AssetBuyer]: 'asset-buyer',
};
export interface DocPageProps {
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index 4ec45c46e..7e140c951 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -363,6 +363,7 @@ export enum WebsitePaths {
Subproviders = '/docs/subproviders',
OrderUtils = '/docs/order-utils',
EthereumTypes = '/docs/ethereum-types',
+ AssetBuyer = '/docs/asset-buyer',
Careers = '/careers',
}
@@ -379,6 +380,7 @@ export enum DocPackages {
EthereumTypes = 'ETHEREUM_TYPES',
ContractWrappers = 'CONTRACT_WRAPPERS',
OrderWatcher = 'ORDER_WATCHER',
+ AssetBuyer = 'ASSET_BUYER',
}
export enum Key {
@@ -440,6 +442,7 @@ export enum Key {
ZeroExJs = '0X_JS',
ContractWrappers = 'CONTRACT_WRAPPERS',
OrderWatcher = 'ORDER_WATCHER',
+ AssetBuyer = 'ASSET_BUYER',
Blog = 'BLOG',
Forum = 'FORUM',
Connect = 'CONNECT',
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-09 16:51:35 +0800