From 6dd656bdfc5e9878a8a6e332b4ea844556f75d56 Mon Sep 17 00:00:00 2001 From: Fabio Berger Date: Fri, 3 Aug 2018 11:14:01 +0200 Subject: Add OrderWatcher docs page --- packages/website/ts/components/top_bar/top_bar.tsx | 29 ++++++--- .../ts/containers/order_watcher_documentation.ts | 70 ++++++++++++++++++++++ packages/website/ts/index.tsx | 12 +++- .../website/ts/pages/documentation/doc_page.tsx | 1 + packages/website/ts/pages/landing/landing.tsx | 2 +- packages/website/ts/types.ts | 5 +- 6 files changed, 109 insertions(+), 10 deletions(-) create mode 100644 packages/website/ts/containers/order_watcher_documentation.ts (limited to 'packages/website/ts') diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index d2f530fb5..c921867d7 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -84,7 +84,9 @@ const DOC_WEBSITE_PATHS_TO_KEY = { [WebsitePaths.ContractWrappers]: Key.ContractWrappers, [WebsitePaths.Connect]: Key.Connect, [WebsitePaths.ZeroExJs]: Key.ZeroExJs, -} + [WebsitePaths.OrderUtils]: Key.OrderUtils, + [WebsitePaths.OrderWatcher]: Key.OrderWatcher, +}; const DEFAULT_HEIGHT = 68; const EXPANDED_HEIGHT = 75; @@ -166,12 +168,28 @@ export class TopBar extends React.Component { primaryText={this.props.translate.get(Key.Web3Wrapper, Deco.CapWords)} /> , - + , + + + , + + + , { {this.props.translate.get(key, Deco.Cap)}{' '} {this.props.translate.get(Key.Docs, Deco.Cap)} - + ; } })} {!this._isViewingPortal() && ( @@ -391,10 +409,7 @@ export class TopBar extends React.Component { const isViewingDocsPage = _.some(DOC_WEBSITE_PATHS_TO_KEY, (_key, websitePath) => { return this._doesUrlInclude(websitePath); }); - if ( - !isViewingDocsPage || - _.isUndefined(this.props.menu) - ) { + if (!isViewingDocsPage || _.isUndefined(this.props.menu)) { return undefined; } return ( diff --git a/packages/website/ts/containers/order_watcher_documentation.ts b/packages/website/ts/containers/order_watcher_documentation.ts new file mode 100644 index 000000000..29f1adf7c --- /dev/null +++ b/packages/website/ts/containers/order_watcher_documentation.ts @@ -0,0 +1,70 @@ +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 { constants } from 'ts/utils/constants'; +import { Translate } from 'ts/utils/translate'; + +/* tslint:disable:no-var-requires */ +const IntroMarkdown = require('md/docs/order_watcher/introduction'); +const InstallationMarkdown = require('md/docs/order_watcher/installation'); +/* tslint:enable:no-var-requires */ + +const markdownSections = { + introduction: 'introduction', + installation: 'installation', +}; + +const docsInfoConfig: DocsInfoConfig = { + id: DocPackages.OrderWatcher, + type: SupportedDocJson.TypeDoc, + displayName: 'OrderWatcher', + packageUrl: 'https://github.com/0xProject/0x-monorepo', + markdownMenu: { + introduction: [markdownSections.introduction], + install: [markdownSections.installation], + }, + sectionNameToMarkdownByVersion: { + '0.0.1': { + [markdownSections.introduction]: IntroMarkdown, + [markdownSections.installation]: InstallationMarkdown, + }, + }, + markdownSections, + typeConfigs: { + typeNameToExternalLink: { + BigNumber: constants.URL_BIGNUMBERJS_GITHUB, + }, + }, +}; +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): 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 36b2f6b87..cfe8a1c9c 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -40,6 +40,9 @@ const LazyZeroExJSDocumentation = createLazyComponent('Documentation', async () const LazyContractWrappersDocumentation = createLazyComponent('Documentation', async () => System.import(/* webpackChunkName: "contractWrapperDocs" */ 'ts/containers/contract_wrappers_documentation'), ); +const LazyOrderWatcherDocumentation = createLazyComponent('Documentation', async () => + System.import(/* webpackChunkName: "orderWatcherDocs" */ 'ts/containers/order_watcher_documentation'), +); const LazySmartContractsDocumentation = createLazyComponent('Documentation', async () => System.import(/* webpackChunkName: "smartContractDocs" */ 'ts/containers/smart_contracts_documentation'), ); @@ -83,7 +86,14 @@ render( - + + { style={{ fontFamily: 'Roboto Mono' }} >
{this.props.translate.get(Key.OffChainOrderRelay, Deco.Cap)}
-
{this.props.translate.get(Key.OonChainSettlement, Deco.Cap)}
+
{this.props.translate.get(Key.OnChainSettlement, Deco.Cap)}