diff options
author | Fabio Berger <me@fabioberger.com> | 2018-08-02 06:01:02 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-08-02 06:01:02 +0800 |
commit | 0132286cab49ff6c705abd70cdd89e36b3550c27 (patch) | |
tree | 3fced9e9822d9807e3e688da0de72369eebb0c7d /packages/website/ts | |
parent | 2494af99aad4dd58c0d4e647dedf72946cb3c20b (diff) | |
download | dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar.gz dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar.bz2 dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar.lz dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar.xz dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.tar.zst dexon-0x-contracts-0132286cab49ff6c705abd70cdd89e36b3550c27.zip |
Add contract-wrappers page and make topBar component more concise
Diffstat (limited to 'packages/website/ts')
-rw-r--r-- | packages/website/ts/components/top_bar/top_bar.tsx | 155 | ||||
-rw-r--r-- | packages/website/ts/containers/contract_wrappers_documentation.ts | 56 | ||||
-rw-r--r-- | packages/website/ts/index.tsx | 4 | ||||
-rw-r--r-- | packages/website/ts/pages/documentation/doc_page.tsx | 1 | ||||
-rw-r--r-- | packages/website/ts/types.ts | 4 |
5 files changed, 103 insertions, 117 deletions
diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx index 646d3fc94..d2f530fb5 100644 --- a/packages/website/ts/components/top_bar/top_bar.tsx +++ b/packages/website/ts/components/top_bar/top_bar.tsx @@ -74,6 +74,18 @@ const styles: Styles = { }, }; +const DOC_WEBSITE_PATHS_TO_KEY = { + [WebsitePaths.SolCov]: Key.SolCov, + [WebsitePaths.SmartContracts]: Key.SmartContracts, + [WebsitePaths.Web3Wrapper]: Key.Web3Wrapper, + [WebsitePaths.SolCompiler]: Key.SolCompiler, + [WebsitePaths.JSONSchemas]: Key.JsonSchemas, + [WebsitePaths.Subproviders]: Key.Subproviders, + [WebsitePaths.ContractWrappers]: Key.ContractWrappers, + [WebsitePaths.Connect]: Key.Connect, + [WebsitePaths.ZeroExJs]: Key.ZeroExJs, +} + const DEFAULT_HEIGHT = 68; const EXPANDED_HEIGHT = 75; @@ -154,6 +166,12 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { primaryText={this.props.translate.get(Key.Web3Wrapper, Deco.CapWords)} /> </Link>, + <Link key="subMenuItem-contractWrappers" to={WebsitePaths.ContractWrappers} className="text-decoration-none"> + <MenuItem + style={{ fontSize: styles.menuItem.fontSize }} + primaryText={this.props.translate.get(Key.ContractWrappers, Deco.CapWords)} + /> + </Link>, <Link key="subMenuItem-sol-compiler" to={WebsitePaths.SolCompiler} className="text-decoration-none"> <MenuItem style={{ fontSize: styles.menuItem.fontSize }} @@ -334,75 +352,16 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { <Link to={`${WebsitePaths.Wiki}`} className="text-decoration-none"> <MenuItem className="py2">{this.props.translate.get(Key.Wiki, Deco.Cap)}</MenuItem> </Link> - {!this._isViewing0xjsDocs() && ( - <Link to={WebsitePaths.ZeroExJs} className="text-decoration-none"> - <MenuItem className="py2">0x.js {this.props.translate.get(Key.Docs, Deco.Cap)}</MenuItem> - </Link> - )} - {!this._isViewingConnectDocs() && ( - <Link to={WebsitePaths.Connect} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.Connect, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingSmartContractsDocs() && ( - <Link to={WebsitePaths.SmartContracts} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.SmartContract, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingWeb3WrapperDocs() && ( - <Link to={WebsitePaths.Web3Wrapper} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.Web3Wrapper, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingSolCompilerDocs() && ( - <Link to={WebsitePaths.SolCompiler} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.SolCompiler, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingJsonSchemasDocs() && ( - <Link to={WebsitePaths.JSONSchemas} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.JsonSchemas, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingSolCovDocs() && ( - <Link to={WebsitePaths.SolCov} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.SolCov, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingSubprovidersDocs() && ( - <Link to={WebsitePaths.Subproviders} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.Subproviders, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} - {!this._isViewingEthereumTypesDocs() && ( - <Link to={WebsitePaths.EthereumTypes} className="text-decoration-none"> - <MenuItem className="py2"> - {this.props.translate.get(Key.EthereumTypes, Deco.Cap)}{' '} - {this.props.translate.get(Key.Docs, Deco.Cap)} - </MenuItem> - </Link> - )} + {_.map(DOC_WEBSITE_PATHS_TO_KEY, (key, websitePath) => { + if (!this._doesUrlInclude(websitePath)) { + <Link to={websitePath} className="text-decoration-none"> + <MenuItem className="py2"> + {this.props.translate.get(key, Deco.Cap)}{' '} + {this.props.translate.get(Key.Docs, Deco.Cap)} + </MenuItem> + </Link> + } + })} {!this._isViewingPortal() && ( <Link to={`${WebsitePaths.Portal}`} className="text-decoration-none"> <MenuItem className="py2"> @@ -429,15 +388,11 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { ); } private _renderDocsMenu(): React.ReactNode { + const isViewingDocsPage = _.some(DOC_WEBSITE_PATHS_TO_KEY, (_key, websitePath) => { + return this._doesUrlInclude(websitePath); + }); if ( - (!this._isViewing0xjsDocs() && - !this._isViewingSmartContractsDocs() && - !this._isViewingWeb3WrapperDocs() && - !this._isViewingSolCompilerDocs() && - !this._isViewingJsonSchemasDocs() && - !this._isViewingSolCovDocs() && - !this._isViewingSubprovidersDocs() && - !this._isViewingConnectDocs()) || + !isViewingDocsPage || _.isUndefined(this.props.menu) ) { return undefined; @@ -488,55 +443,21 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { private _isViewingFAQ(): boolean { return _.includes(this.props.location.pathname, WebsitePaths.FAQ); } - private _isViewing0xjsDocs(): boolean { - return ( - _.includes(this.props.location.pathname, WebsitePaths.ZeroExJs) || - _.includes(this.props.location.pathname, WebsiteLegacyPaths.ZeroExJs) - ); - } - private _isViewingConnectDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.Connect); - } - private _isViewingSmartContractsDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.SmartContracts); - } - private _isViewingWeb3WrapperDocs(): boolean { - return ( - _.includes(this.props.location.pathname, WebsitePaths.Web3Wrapper) || - _.includes(this.props.location.pathname, WebsiteLegacyPaths.Web3Wrapper) - ); - } - private _isViewingSolCompilerDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.SolCompiler); - } - private _isViewingJsonSchemasDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.JSONSchemas); - } - private _isViewingSolCovDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.SolCov); - } - private _isViewingSubprovidersDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.Subproviders); - } - private _isViewingEthereumTypesDocs(): boolean { - return _.includes(this.props.location.pathname, WebsitePaths.EthereumTypes); + private _doesUrlInclude(aPath: string): boolean { + return _.includes(this.props.location.pathname, aPath); } private _isViewingWiki(): boolean { return _.includes(this.props.location.pathname, WebsitePaths.Wiki); } private _shouldDisplayBottomBar(): boolean { + const isViewingDocsPage = _.some(DOC_WEBSITE_PATHS_TO_KEY, (_key, websitePath) => { + return this._doesUrlInclude(websitePath); + }); return ( + isViewingDocsPage || this._isViewingWiki() || this._isViewingFAQ() || this._isViewingDocs() || - this._isViewing0xjsDocs() || - this._isViewingSmartContractsDocs() || - this._isViewingWeb3WrapperDocs() || - this._isViewingSolCompilerDocs() || - this._isViewingJsonSchemasDocs() || - this._isViewingSolCovDocs() || - this._isViewingSubprovidersDocs() || - this._isViewingConnectDocs() || this._isViewingPortal() ); } diff --git a/packages/website/ts/containers/contract_wrappers_documentation.ts b/packages/website/ts/containers/contract_wrappers_documentation.ts new file mode 100644 index 000000000..f0547cecd --- /dev/null +++ b/packages/website/ts/containers/contract_wrappers_documentation.ts @@ -0,0 +1,56 @@ +import { constants as docConstants, 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'; + +// TODO: Add MD sections +const markdownSections = {}; + +const docsInfoConfig: DocsInfoConfig = { + id: DocPackages.ContractWrappers, + type: SupportedDocJson.TypeDoc, + displayName: 'Contract Wrappers', + packageUrl: 'https://github.com/0xProject/0x-monorepo', + markdownMenu: {}, + sectionNameToMarkdownByVersion: {}, + markdownSections, + typeConfigs: { + typeNameToPrefix: {}, + 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, + docsInfo, + translate: state.translate, +}); + +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 ed52e28d2..36b2f6b87 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -37,6 +37,9 @@ const LazyPortal = createLazyComponent('Portal', async () => const LazyZeroExJSDocumentation = createLazyComponent('Documentation', async () => System.import<any>(/* webpackChunkName: "zeroExDocs" */ 'ts/containers/zero_ex_js_documentation'), ); +const LazyContractWrappersDocumentation = createLazyComponent('Documentation', async () => + System.import<any>(/* webpackChunkName: "contractWrapperDocs" */ 'ts/containers/contract_wrappers_documentation'), +); const LazySmartContractsDocumentation = createLazyComponent('Documentation', async () => System.import<any>(/* webpackChunkName: "smartContractDocs" */ 'ts/containers/smart_contracts_documentation'), ); @@ -80,6 +83,7 @@ render( <Route path={WebsitePaths.About} component={About as any} /> <Route path={WebsitePaths.Wiki} component={Wiki as any} /> <Route path={`${WebsitePaths.ZeroExJs}/:version?`} component={LazyZeroExJSDocumentation} /> + <Route path={`${WebsitePaths.ContractWrappers}/:version?`} component={LazyContractWrappersDocumentation} /> <Route path={`${WebsitePaths.Connect}/:version?`} component={LazyConnectDocumentation} /> <Route path={`${WebsitePaths.SolCompiler}/:version?`} diff --git a/packages/website/ts/pages/documentation/doc_page.tsx b/packages/website/ts/pages/documentation/doc_page.tsx index 6e11dead9..e7e5f8a8c 100644 --- a/packages/website/ts/pages/documentation/doc_page.tsx +++ b/packages/website/ts/pages/documentation/doc_page.tsx @@ -28,6 +28,7 @@ const docIdToSubpackageName: { [id: string]: string } = { [DocPackages.Connect]: 'connect', [DocPackages.SmartContracts]: 'contracts', [DocPackages.Web3Wrapper]: 'web3-wrapper', + [DocPackages.ContractWrappers]: 'contract-wrappers', [DocPackages.SolCompiler]: 'sol-compiler', [DocPackages.JSONSchemas]: 'json-schemas', [DocPackages.SolCov]: 'sol-cov', diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index e1b5be39a..fd82ef7cb 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -371,6 +371,7 @@ export enum WebsitePaths { SmartContracts = '/docs/contracts', Connect = '/docs/connect', Web3Wrapper = '/docs/web3-wrapper', + ContractWrappers = '/docs/contract-wrappers', SolCompiler = '/docs/sol-compiler', JSONSchemas = '/docs/json-schemas', SolCov = '/docs/sol-cov', @@ -391,6 +392,7 @@ export enum DocPackages { Subproviders = 'SUBPROVIDERS', OrderUtils = 'ORDER_UTILS', EthereumTypes = 'ETHEREUM_TYPES', + ContractWrappers = 'CONTRACT_WRAPPERS', } export enum Key { @@ -444,6 +446,8 @@ export enum Key { SolCov = 'SOL_COV', EthereumTypes = 'ETHEREUM_TYPES', Subproviders = 'SUBPROVIDERS', + ZeroExJs = '0X_JS', + ContractWrappers = 'CONTRACT_WRAPPERS', Blog = 'BLOG', Forum = 'FORUM', Connect = 'CONNECT', |