aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2018-06-06 14:34:20 +0800
committerBrandon Millman <brandon.millman@gmail.com>2018-06-06 16:33:35 +0800
commit1677817d9fb31d47080705fc4336555f74cbe687 (patch)
treea827aaf67dcd898e38cec74b8ef477b8ea072276
parent03854baf53c5767db7130b8f6d7e91aae015e867 (diff)
downloaddexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar.gz
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar.bz2
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar.lz
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar.xz
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.tar.zst
dexon-sol-tools-1677817d9fb31d47080705fc4336555f74cbe687.zip
Update GenerateOrderForm and FillOrder components
-rw-r--r--packages/website/ts/components/fill_order.tsx17
-rw-r--r--packages/website/ts/components/generate_order/generate_order_form.tsx17
-rw-r--r--packages/website/ts/components/portal/portal.tsx4
-rw-r--r--packages/website/ts/containers/generate_order_form.ts2
4 files changed, 34 insertions, 6 deletions
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 0168ec8f6..e313a43fe 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -39,6 +39,8 @@ interface FillOrderProps {
initialOrder: Order;
dispatcher: Dispatcher;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
+ shouldRenderHeader?: boolean;
}
interface FillOrderState {
@@ -61,6 +63,10 @@ interface FillOrderState {
}
export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
+ public static defaultProps: Partial<FillOrderProps> = {
+ isFullWidth: false,
+ shouldRenderHeader: true,
+ };
private _isUnmounted: boolean;
constructor(props: FillOrderProps) {
super(props);
@@ -97,10 +103,15 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
this._isUnmounted = true;
}
public render(): React.ReactNode {
+ const rootClassName = this.props.isFullWidth ? 'clearfix' : 'lg-px4 md-px4 sm-px2';
return (
- <div className="clearfix lg-px4 md-px4 sm-px2" style={{ minHeight: 600 }}>
- <h3>Fill an order</h3>
- <Divider />
+ <div className={rootClassName} style={{ minHeight: 600 }}>
+ {this.props.shouldRenderHeader && (
+ <div>
+ <h3>Fill an order</h3>
+ <Divider />
+ </div>
+ )}
<div>
{!this.props.isOrderInUrl && (
<div>
diff --git a/packages/website/ts/components/generate_order/generate_order_form.tsx b/packages/website/ts/components/generate_order/generate_order_form.tsx
index 5f968a5e4..e786719b0 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -47,6 +47,8 @@ interface GenerateOrderFormProps {
sideToAssetToken: SideToAssetToken;
tokenByAddress: TokenByAddress;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
+ shouldRenderHeader?: boolean;
}
interface GenerateOrderFormState {
@@ -56,6 +58,10 @@ interface GenerateOrderFormState {
}
export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, GenerateOrderFormState> {
+ public static defaultProps: Partial<GenerateOrderFormProps> = {
+ isFullWidth: false,
+ shouldRenderHeader: true,
+ };
constructor(props: GenerateOrderFormProps) {
super(props);
this.state = {
@@ -80,10 +86,15 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
const exchangeContractIfExists = this.props.blockchain.getExchangeContractAddressIfExists();
const initialTakerAddress =
this.props.orderTakerAddress === constants.NULL_ADDRESS ? '' : this.props.orderTakerAddress;
+ const rootClassName = this.props.isFullWidth ? 'clearfix mb2' : 'clearfix mb2 lg-px4 md-px4 sm-px2';
return (
- <div className="clearfix mb2 lg-px4 md-px4 sm-px2">
- <h3>Generate an order</h3>
- <Divider />
+ <div className={rootClassName}>
+ {this.props.shouldRenderHeader && (
+ <div>
+ <h3>Generate an order</h3>
+ <Divider />
+ </div>
+ )}
<div className="mx-auto" style={{ maxWidth: 580 }}>
<div className="pt3">
<div className="mx-auto clearfix">
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 33f39a468..f0d26aeb0 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -451,6 +451,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
blockchain={this._blockchain}
hashData={this.props.hashData}
dispatcher={this.props.dispatcher}
+ isFullWidth={true}
+ shouldRenderHeader={false}
/>
);
}
@@ -470,6 +472,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
tokenByAddress={this.props.tokenByAddress}
dispatcher={this.props.dispatcher}
lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
+ isFullWidth={true}
+ shouldRenderHeader={false}
/>
);
}
diff --git a/packages/website/ts/containers/generate_order_form.ts b/packages/website/ts/containers/generate_order_form.ts
index 98c9b8cd6..23c869a1e 100644
--- a/packages/website/ts/containers/generate_order_form.ts
+++ b/packages/website/ts/containers/generate_order_form.ts
@@ -13,6 +13,8 @@ interface GenerateOrderFormProps {
blockchain: Blockchain;
hashData: HashData;
dispatcher: Dispatcher;
+ isFullWidth?: boolean;
+ shouldRenderHeader?: boolean;
}
interface ConnectedState {