From 6387aae4711ea4cb9db67c57567494fedb56bb3e Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 31 May 2018 14:22:44 -0700 Subject: Add generate and fill order routes --- packages/website/ts/components/portal/menu.tsx | 11 ++++++--- packages/website/ts/components/portal/portal.tsx | 30 ++++++++++++++++++++---- 2 files changed, 34 insertions(+), 7 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/components/portal/menu.tsx b/packages/website/ts/components/portal/menu.tsx index 6a3301549..6e97ee37e 100644 --- a/packages/website/ts/components/portal/menu.tsx +++ b/packages/website/ts/components/portal/menu.tsx @@ -43,9 +43,14 @@ export const defaultMenuItemEntries: MenuItemEntry[] = [ iconName: 'zmdi-circle-o', }, { - to: `${WebsitePaths.Portal}/direct`, - labelText: 'Trade direct', - iconName: 'zmdi-swap', + to: `${WebsitePaths.Portal}/generate`, + labelText: 'Generate order', + iconName: 'zmdi-arrow-right-top', + }, + { + to: `${WebsitePaths.Portal}/fill`, + labelText: 'Fill order', + iconName: 'zmdi-arrow-left-bottom', }, ]; diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index e08393791..cb55b0912 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -10,6 +10,7 @@ import { BlockchainErrDialog } from 'ts/components/dialogs/blockchain_err_dialog import { LedgerConfigDialog } from 'ts/components/dialogs/ledger_config_dialog'; import { PortalDisclaimerDialog } from 'ts/components/dialogs/portal_disclaimer_dialog'; import { EthWrappers } from 'ts/components/eth_wrappers'; +import { FillOrder } from 'ts/components/fill_order'; import { AssetPicker } from 'ts/components/generate_order/asset_picker'; import { BackButton } from 'ts/components/portal/back_button'; import { Loading } from 'ts/components/portal/loading'; @@ -336,9 +337,14 @@ export class Portal extends React.Component { render: this._renderTradeHistory.bind(this), }, { - pathName: `${WebsitePaths.Portal}/direct`, - headerText: 'Trade Direct', - render: this._renderTradeDirect.bind(this), + pathName: `${WebsitePaths.Portal}/generate`, + headerText: 'Generate Order', + render: this._renderGenerateOrderForm.bind(this), + }, + { + pathName: `${WebsitePaths.Portal}/fill`, + headerText: 'Fill Order', + render: this._renderFillOrder.bind(this), }, ]; return ( @@ -386,7 +392,7 @@ export class Portal extends React.Component { /> ); } - private _renderTradeDirect(match: any, location: Location, history: History): React.ReactNode { + private _renderGenerateOrderForm(): React.ReactNode { return ( { /> ); } + private _renderFillOrder(): React.ReactNode { + return ( + + ); + } private _renderTokenBalances(): React.ReactNode { const allTokens = _.values(this.props.tokenByAddress); const trackedTokens = _.filter(allTokens, t => t.isTracked); -- cgit v1.2.3 From 31f1a9e5aa2b99dd7d802e67c5cff5854880e884 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 31 May 2018 15:11:04 -0700 Subject: Refactor order parser and add shared order support to new portal --- .../ts/components/legacy_portal/legacy_portal.tsx | 3 +- packages/website/ts/components/portal/portal.tsx | 10 +++++-- packages/website/ts/utils/order_parser.ts | 33 ++++++++++++++++++++++ 3 files changed, 43 insertions(+), 3 deletions(-) create mode 100644 packages/website/ts/utils/order_parser.ts (limited to 'packages') diff --git a/packages/website/ts/components/legacy_portal/legacy_portal.tsx b/packages/website/ts/components/legacy_portal/legacy_portal.tsx index 6a3a54303..446b7507e 100644 --- a/packages/website/ts/components/legacy_portal/legacy_portal.tsx +++ b/packages/website/ts/components/legacy_portal/legacy_portal.tsx @@ -38,6 +38,7 @@ import { } from 'ts/types'; import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; +import { orderParser } from 'ts/utils/order_parser'; import { Translate } from 'ts/utils/translate'; import { utils } from 'ts/utils/utils'; @@ -86,7 +87,7 @@ export class LegacyPortal extends React.Component { private _blockchain: Blockchain; + private _sharedOrderIfExists: Order; private _throttledScreenWidthUpdate: () => void; constructor(props: PortalProps) { super(props); + this._sharedOrderIfExists = orderParser.parse(window.location.search); this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT); const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER); const hasAcceptedDisclaimer = @@ -402,12 +405,15 @@ export class Portal extends React.Component { ); } private _renderFillOrder(): React.ReactNode { + const initialFillOrder = !_.isUndefined(this.props.userSuppliedOrderCache) + ? this.props.userSuppliedOrderCache + : this._sharedOrderIfExists; return ( { + const queryPair = queryParam.split('='); + return queryPair[0] === 'order'; + }); + if (_.isUndefined(orderQueryParam)) { + return undefined; + } + const orderPair = orderQueryParam.split('='); + if (orderPair.length !== 2) { + return undefined; + } + const order = JSON.parse(decodeURIComponent(orderPair[1])); + const validationResult = validator.validate(order, portalOrderSchema); + if (validationResult.errors.length > 0) { + logUtils.log(`Invalid shared order: ${validationResult.errors}`); + return undefined; + } + return order; + }, +}; -- cgit v1.2.3 From 0500d2fb6e17f436535cb4bb5336c139a99e8cfe Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 31 May 2018 15:33:08 -0700 Subject: Remove old parse code --- .../ts/components/legacy_portal/legacy_portal.tsx | 26 ---------------------- 1 file changed, 26 deletions(-) (limited to 'packages') diff --git a/packages/website/ts/components/legacy_portal/legacy_portal.tsx b/packages/website/ts/components/legacy_portal/legacy_portal.tsx index 446b7507e..e5d152e3e 100644 --- a/packages/website/ts/components/legacy_portal/legacy_portal.tsx +++ b/packages/website/ts/components/legacy_portal/legacy_portal.tsx @@ -363,32 +363,6 @@ export class LegacyPortal extends React.Component { - const queryPair = queryParam.split('='); - return queryPair[0] === 'order'; - }); - if (_.isUndefined(orderQueryParam)) { - return undefined; - } - const orderPair = orderQueryParam.split('='); - if (orderPair.length !== 2) { - return undefined; - } - - const order = JSON.parse(decodeURIComponent(orderPair[1])); - const validationResult = validator.validate(order, portalOrderSchema); - if (validationResult.errors.length > 0) { - logUtils.log(`Invalid shared order: ${validationResult.errors}`); - return undefined; - } - return order; - } private _updateScreenWidth(): void { const newScreenWidth = utils.getScreenWidth(); this.props.dispatcher.updateScreenWidth(newScreenWidth); -- cgit v1.2.3