diff options
Diffstat (limited to 'packages/website/ts')
-rw-r--r-- | packages/website/ts/components/footer.tsx | 4 | ||||
-rw-r--r-- | packages/website/ts/components/top_bar.tsx | 26 | ||||
-rw-r--r-- | packages/website/ts/containers/connect_documentation.tsx | 97 | ||||
-rw-r--r-- | packages/website/ts/containers/smart_contracts_documentation.tsx | 2 | ||||
-rw-r--r-- | packages/website/ts/containers/zero_ex_js_documentation.tsx | 3 | ||||
-rw-r--r-- | packages/website/ts/index.tsx | 7 | ||||
-rw-r--r-- | packages/website/ts/pages/documentation/docs_info.ts | 11 | ||||
-rw-r--r-- | packages/website/ts/pages/documentation/documentation.tsx | 7 | ||||
-rw-r--r-- | packages/website/ts/pages/documentation/method_block.tsx | 1 | ||||
-rw-r--r-- | packages/website/ts/pages/documentation/source_link.tsx | 13 | ||||
-rw-r--r-- | packages/website/ts/types.ts | 4 |
11 files changed, 160 insertions, 15 deletions
diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index f7070e0f8..5e3c0479a 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -42,6 +42,10 @@ const menuItemsBySection: MenuItemsBySection = { path: WebsitePaths.SmartContracts, }, { + title: '0x Connect', + path: WebsitePaths.Connect, + }, + { title: 'Whitepaper', path: WebsitePaths.Whitepaper, isExternal: true, diff --git a/packages/website/ts/components/top_bar.tsx b/packages/website/ts/components/top_bar.tsx index 7b81253e2..4398fe667 100644 --- a/packages/website/ts/components/top_bar.tsx +++ b/packages/website/ts/components/top_bar.tsx @@ -34,7 +34,7 @@ interface TopBarProps { menu?: DocsMenu; menuSubsectionsBySection?: MenuSubsectionsBySection; shouldFullWidth?: boolean; - docPath?: string; + docsInfo?: DocsInfo; style?: React.CSSProperties; isNightVersion?: boolean; } @@ -111,6 +111,13 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { > <MenuItem style={{fontSize: styles.menuItem.fontSize}} primaryText="Smart Contracts" /> </Link>, + <Link + key="subMenuItem-0xconnect" + to={WebsitePaths.Connect} + className="text-decoration-none" + > + <MenuItem style={{fontSize: styles.menuItem.fontSize}} primaryText="0x Connect" /> + </Link>, <a key="subMenuItem-standard-relayer-api" target="_blank" @@ -235,6 +242,11 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { <MenuItem className="py2">0x.js Docs</MenuItem> </Link> } + {!this.isViewingConnectDocs() && + <Link to={WebsitePaths.Connect} className="text-decoration-none"> + <MenuItem className="py2">0x Connect Docs</MenuItem> + </Link> + } {!this.isViewingSmartContractsDocs() && <Link to={WebsitePaths.SmartContracts} className="text-decoration-none"> <MenuItem className="py2">Smart Contract Docs</MenuItem> @@ -274,11 +286,12 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { ); } private renderDocsMenu() { - if (!this.isViewing0xjsDocs() && !this.isViewingSmartContractsDocs() || _.isUndefined(this.props.menu)) { + if (!this.isViewing0xjsDocs() && !this.isViewingSmartContractsDocs() && !this.isViewingConnectDocs() + || _.isUndefined(this.props.menu)) { return; } - const sectionTitle = this.isViewing0xjsDocs() ? '0x.js Docs' : 'Smart contract Docs'; + const sectionTitle = `${this.props.docsInfo.displayName} Docs`; return ( <div className="lg-hide md-hide"> <div className="pl1 py1" style={{backgroundColor: SECTION_HEADER_COLOR}}>{sectionTitle}</div> @@ -288,7 +301,7 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { shouldDisplaySectionHeaders={false} onMenuItemClick={this.onMenuButtonClick.bind(this)} selectedVersion={this.props.docsVersion} - docPath={this.props.docPath} + docPath={this.props.docsInfo.websitePath} versions={this.props.availableDocVersions} /> </div> @@ -362,6 +375,9 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { private isViewing0xjsDocs() { return _.includes(this.props.location.pathname, WebsitePaths.ZeroExJs); } + private isViewingConnectDocs() { + return _.includes(this.props.location.pathname, WebsitePaths.Connect); + } private isViewingSmartContractsDocs() { return _.includes(this.props.location.pathname, WebsitePaths.SmartContracts); } @@ -370,6 +386,6 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> { } private shouldDisplayBottomBar() { return this.isViewingWiki() || this.isViewing0xjsDocs() || this.isViewingFAQ() || - this.isViewingSmartContractsDocs(); + this.isViewingSmartContractsDocs() || this.isViewingConnectDocs(); } } diff --git a/packages/website/ts/containers/connect_documentation.tsx b/packages/website/ts/containers/connect_documentation.tsx new file mode 100644 index 000000000..3575538e1 --- /dev/null +++ b/packages/website/ts/containers/connect_documentation.tsx @@ -0,0 +1,97 @@ +import BigNumber from 'bignumber.js'; +import * as _ from 'lodash'; +import * as React from 'react'; +import {connect} from 'react-redux'; +import {Dispatch, Store as ReduxStore} from 'redux'; +import {Blockchain} from 'ts/blockchain'; +import {DocsInfo} from 'ts/pages/documentation/docs_info'; +import { + Documentation as DocumentationComponent, + DocumentationAllProps, +} from 'ts/pages/documentation/documentation'; +import {Dispatcher} from 'ts/redux/dispatcher'; +import {State} from 'ts/redux/reducer'; +import {DocsInfoConfig, WebsitePaths} from 'ts/types'; +import {typeDocUtils} from 'ts/utils/typedoc_utils'; + +/* tslint:disable:no-var-requires */ +const IntroMarkdown = require('md/docs/connect/introduction'); +const InstallationMarkdown = require('md/docs/connect/installation'); +/* tslint:enable:no-var-requires */ + +const connectDocSections = { + introduction: 'introduction', + installation: 'installation', + httpClient: 'httpClient', + types: 'types', +}; + +const docsInfoConfig: DocsInfoConfig = { + displayName: '0x Connect', + subPackageName: 'connect', + packageUrl: 'https://github.com/0xProject/0x.js', + websitePath: WebsitePaths.Connect, + docsJsonRoot: 'https://s3.amazonaws.com/connect-docs-jsons', + menu: { + introduction: [ + connectDocSections.introduction, + ], + install: [ + connectDocSections.installation, + ], + httpClient: [ + connectDocSections.httpClient, + ], + types: [ + connectDocSections.types, + ], + }, + sectionNameToMarkdown: { + [connectDocSections.introduction]: IntroMarkdown, + [connectDocSections.installation]: InstallationMarkdown, + }, + // Note: This needs to be kept in sync with the types exported in index.ts. Unfortunately there is + // currently no way to extract the re-exported types from index.ts via TypeDoc :( + publicTypes: [ + 'Client', + 'FeesRequest', + 'FeesResponse', + 'OrderbookRequest', + 'OrderbookResponse', + 'OrdersRequest', + 'TokenPairsItem', + 'TokenPairsRequest', + ], + sectionNameToModulePath: { + [connectDocSections.httpClient]: ['"src/http_client"'], + [connectDocSections.types]: ['"src/types"'], + }, + menuSubsectionToVersionWhenIntroduced: {}, + sections: connectDocSections, + visibleConstructors: [connectDocSections.httpClient], + convertToDocAgnosticFormatFn: typeDocUtils.convertToDocAgnosticFormat.bind(typeDocUtils), +}; +const docsInfo = new DocsInfo(docsInfoConfig); + +interface ConnectedState { + docsVersion: string; + availableDocVersions: string[]; + docsInfo: DocsInfo; +} + +interface ConnectedDispatch { + dispatcher: Dispatcher; +} + +const mapStateToProps = (state: State, ownProps: DocumentationAllProps): ConnectedState => ({ + docsVersion: state.docsVersion, + availableDocVersions: state.availableDocVersions, + docsInfo, +}); + +const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({ + dispatcher: new Dispatcher(dispatch), +}); + +export const Documentation: React.ComponentClass<DocumentationAllProps> = + connect(mapStateToProps, mapDispatchToProps)(DocumentationComponent); diff --git a/packages/website/ts/containers/smart_contracts_documentation.tsx b/packages/website/ts/containers/smart_contracts_documentation.tsx index 4623c976b..ea2b19b8c 100644 --- a/packages/website/ts/containers/smart_contracts_documentation.tsx +++ b/packages/website/ts/containers/smart_contracts_documentation.tsx @@ -20,7 +20,7 @@ const IntroMarkdown = require('md/docs/smart_contracts/introduction'); const sections = constants.smartContractDocSections; const docsInfoConfig: DocsInfoConfig = { - packageName: '0x Smart Contracts', + displayName: '0x Smart Contracts', packageUrl: 'https://github.com/0xProject/contracts', websitePath: WebsitePaths.SmartContracts, docsJsonRoot: 'https://s3.amazonaws.com/smart-contracts-docs-json', diff --git a/packages/website/ts/containers/zero_ex_js_documentation.tsx b/packages/website/ts/containers/zero_ex_js_documentation.tsx index 15a137de1..fc48297b5 100644 --- a/packages/website/ts/containers/zero_ex_js_documentation.tsx +++ b/packages/website/ts/containers/zero_ex_js_documentation.tsx @@ -39,8 +39,9 @@ const zeroExJsDocSections = { }; const docsInfoConfig: DocsInfoConfig = { - packageName: '0x.js', + displayName: '0x.js', packageUrl: 'https://github.com/0xProject/0x.js', + subPackageName: '0x.js', websitePath: WebsitePaths.ZeroExJs, docsJsonRoot: 'https://s3.amazonaws.com/0xjs-docs-jsons', menu: { diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx index eb80a7119..922102d96 100644 --- a/packages/website/ts/index.tsx +++ b/packages/website/ts/index.tsx @@ -87,6 +87,12 @@ const LazySmartContractsDocumentation = createLazyComponent( /* webpackChunkName: "smartContractDocs" */'ts/containers/smart_contracts_documentation', ), ); +const LazyConnectDocumentation = createLazyComponent( + 'Documentation', + async () => System.import<any>( + /* webpackChunkName: "connectDocs" */'ts/containers/connect_documentation', + ), +); const store: ReduxStore<State> = createStore(reducer); render( @@ -103,6 +109,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.Connect}/:version?`} component={LazyConnectDocumentation} /> <Route path={`${WebsitePaths.SmartContracts}/:version?`} component={LazySmartContractsDocumentation} diff --git a/packages/website/ts/pages/documentation/docs_info.ts b/packages/website/ts/pages/documentation/docs_info.ts index f607c2185..1afcf8aaf 100644 --- a/packages/website/ts/pages/documentation/docs_info.ts +++ b/packages/website/ts/pages/documentation/docs_info.ts @@ -11,8 +11,9 @@ import { } from 'ts/types'; export class DocsInfo { - public packageName: string; + public displayName: string; public packageUrl: string; + public subPackageName?: string; public websitePath: string; public docsJsonRoot: string; public menu: DocsMenu; @@ -20,8 +21,9 @@ export class DocsInfo { public sectionNameToMarkdown: {[sectionName: string]: string}; private docsInfo: DocsInfoConfig; constructor(config: DocsInfoConfig) { - this.packageName = config.packageName; + this.displayName = config.displayName; this.packageUrl = config.packageUrl; + this.subPackageName = config.subPackageName; this.websitePath = config.websitePath; this.docsJsonRoot = config.docsJsonRoot; this.sections = config.sections; @@ -45,6 +47,11 @@ export class DocsInfo { } const finalMenu = _.cloneDeep(this.docsInfo.menu); + if (_.isUndefined(finalMenu.contracts)) { + return finalMenu; + } + + // TODO: refactor to include more sections then simply the `contracts` section finalMenu.contracts = _.filter(finalMenu.contracts, (contractName: string) => { const versionIntroducedIfExists = this.docsInfo.menuSubsectionToVersionWhenIntroduced[contractName]; if (!_.isUndefined(versionIntroducedIfExists)) { diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index 288a8f79c..be99e77a2 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -111,7 +111,7 @@ export class Documentation extends this.props.docsInfo.getMenuSubsectionsBySection(this.state.docAgnosticFormat); return ( <div> - <DocumentTitle title={`${this.props.docsInfo.packageName} Documentation`}/> + <DocumentTitle title={`${this.props.docsInfo.displayName} Documentation`}/> <TopBar blockchainIsLoaded={false} location={this.props.location} @@ -120,7 +120,7 @@ export class Documentation extends menu={this.props.docsInfo.getMenu(this.props.docsVersion)} menuSubsectionsBySection={menuSubsectionsBySection} shouldFullWidth={true} - docPath={this.props.docsInfo.websitePath} + docsInfo={this.props.docsInfo} /> {_.isUndefined(this.state.docAgnosticFormat) ? <div @@ -164,7 +164,7 @@ export class Documentation extends <div id={SCROLL_TOP_ID} /> <h1 className="md-pl2 sm-pl3"> <a href={this.props.docsInfo.packageUrl} target="_blank"> - {this.props.docsInfo.packageName} + {this.props.docsInfo.displayName} </a> </h1> {this.renderDocumentation()} @@ -335,6 +335,7 @@ export class Documentation extends version={this.props.docsVersion} source={property.source} baseUrl={this.props.docsInfo.packageUrl} + subPackageName={this.props.docsInfo.subPackageName} /> } {property.comment && diff --git a/packages/website/ts/pages/documentation/method_block.tsx b/packages/website/ts/pages/documentation/method_block.tsx index 3f4eb7164..44e549211 100644 --- a/packages/website/ts/pages/documentation/method_block.tsx +++ b/packages/website/ts/pages/documentation/method_block.tsx @@ -95,6 +95,7 @@ export class MethodBlock extends React.Component<MethodBlockProps, MethodBlockSt version={this.props.libraryVersion} source={(method as TypescriptMethod).source} baseUrl={this.props.docsInfo.packageUrl} + subPackageName={this.props.docsInfo.subPackageName} /> } {method.comment && diff --git a/packages/website/ts/pages/documentation/source_link.tsx b/packages/website/ts/pages/documentation/source_link.tsx index 408dcabc7..74fc6d4d5 100644 --- a/packages/website/ts/pages/documentation/source_link.tsx +++ b/packages/website/ts/pages/documentation/source_link.tsx @@ -1,3 +1,4 @@ +import * as _ from 'lodash'; import {colors} from 'material-ui/styles'; import * as React from 'react'; import {Source} from 'ts/types'; @@ -7,14 +8,22 @@ interface SourceLinkProps { source: Source; baseUrl: string; version: string; + subPackageName: string; } -const SUB_PKG = '0x.js'; +const packagesWithNamespace = [ + 'connect', +]; export function SourceLink(props: SourceLinkProps) { const src = props.source; const url = props.baseUrl; - const sourceCodeUrl = `${url}/blob/${SUB_PKG}%40${props.version}/packages/${SUB_PKG}/${src.fileName}#L${src.line}`; + const pkg = props.subPackageName; + let tagPrefix = pkg; + if (_.includes(packagesWithNamespace, pkg)) { + tagPrefix = `@0xproject/${pkg}`; + } + const sourceCodeUrl = `${url}/blob/${tagPrefix}%40${props.version}/packages/${pkg}/${src.fileName}#L${src.line}`; return ( <div className="pt2" style={{fontSize: 14}}> <a diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index e9af8cb81..d2c690ce1 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -662,6 +662,7 @@ export enum WebsitePaths { About = '/about', Whitepaper = '/pdfs/0x_white_paper.pdf', SmartContracts = '/docs/contracts', + Connect = '/docs/connect', } export interface DocsMenu { @@ -673,7 +674,7 @@ export interface SectionsMap { } export interface DocsInfoConfig { - packageName: string; + displayName: string; packageUrl: string; websitePath: string; docsJsonRoot: string; @@ -682,6 +683,7 @@ export interface DocsInfoConfig { sectionNameToMarkdown: {[sectionName: string]: string}; visibleConstructors: string[]; convertToDocAgnosticFormatFn: (docObj: DoxityDocObj|TypeDocNode, docsInfo?: any) => DocAgnosticFormat; + subPackageName?: string; publicTypes?: string[]; sectionNameToModulePath?: {[sectionName: string]: string[]}; menuSubsectionToVersionWhenIntroduced?: {[sectionName: string]: string}; |