Refactor order parser and add shared order support to new portal

3 files changed, 43 insertions, 3 deletions

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<LegacyPortalProps, LegacyPorta
     }
     constructor(props: LegacyPortalProps) {
         super(props);
-        this._sharedOrderIfExists = this._getSharedOrderIfExists();
+        this._sharedOrderIfExists = orderParser.parse(window.location.search);
         this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT);
 
         const isViewingBalances = _.includes(props.location.pathname, `${WebsitePaths.Portal}/balances`);
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index cb55b0912..589ad00ad 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -43,6 +43,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';
 
@@ -117,9 +118,11 @@ const styles: Styles = {
 
 export class Portal extends React.Component<PortalProps, PortalState> {
     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<PortalProps, PortalState> {
         );
     }
     private _renderFillOrder(): React.ReactNode {
+        const initialFillOrder = !_.isUndefined(this.props.userSuppliedOrderCache)
+            ? this.props.userSuppliedOrderCache
+            : this._sharedOrderIfExists;
         return (
             <FillOrder
                 blockchain={this._blockchain}
                 blockchainErr={this.props.blockchainErr}
-                initialOrder={undefined} // Add user supplied order and shared order stuff here
-                isOrderInUrl={false}
+                initialOrder={initialFillOrder}
+                isOrderInUrl={!_.isUndefined(this._sharedOrderIfExists)}
                 orderFillAmount={this.props.orderFillAmount}
                 networkId={this.props.networkId}
                 userAddress={this.props.userAddress}
diff --git a/packages/website/ts/utils/order_parser.ts b/packages/website/ts/utils/order_parser.ts
new file mode 100644
index 000000000..be08da80e
--- /dev/null
+++ b/packages/website/ts/utils/order_parser.ts
@@ -0,0 +1,33 @@
+import { logUtils } from '@0xproject/utils';
+import * as _ from 'lodash';
+
+import { portalOrderSchema } from 'ts/schemas/portal_order_schema';
+import { validator } from 'ts/schemas/validator';
+import { Order } from 'ts/types';
+
+export const orderParser = {
+    parse(queryString: string): Order | undefined {
+        if (queryString.length === 0) {
+            return undefined;
+        }
+        const queryParams = queryString.substring(1).split('&');
+        const orderQueryParam = _.find(queryParams, queryParam => {
+            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;
+    },
+};