diff options
Diffstat (limited to 'packages/website/ts/pages')
3 files changed, 30 insertions, 2 deletions
diff --git a/packages/website/ts/pages/instant/config_generator.tsx b/packages/website/ts/pages/instant/config_generator.tsx index 9c3161dcc..8b56834ea 100644 --- a/packages/website/ts/pages/instant/config_generator.tsx +++ b/packages/website/ts/pages/instant/config_generator.tsx @@ -3,6 +3,7 @@ import { getContractAddressesForNetworkOrThrow } from '@0x/contract-addresses'; import { assetDataUtils } from '@0x/order-utils'; import { ObjectMap } from '@0x/types'; import * as _ from 'lodash'; +import Slider from 'material-ui/Slider'; import * as React from 'react'; import { CheckMark } from 'ts/components/ui/check_mark'; @@ -65,6 +66,19 @@ export class ConfigGenerator extends React.Component<ConfigGeneratorProps, Confi onChange={this._handleAffiliateAddressChange} /> </ConfigGeneratorSection> + <ConfigGeneratorSection + title="Fee percentage" + actionText="Learn more" + onActionTextClick={this._handleAffiliatePercentageLearnMoreClick} + > + <Slider + min={0} + max={0.05} + step={0.0025} + value={value.affiliateInfo.feePercentage} + onChange={this._handleAffiliatePercentageChange} + /> + </ConfigGeneratorSection> </Container> ); } @@ -91,6 +105,9 @@ export class ConfigGenerator extends React.Component<ConfigGeneratorProps, Confi private readonly _getAllKnownAssetDatas = (): string[] => { return _.map(this.state.allKnownTokens, token => assetDataUtils.encodeERC20AssetData(token.address)); }; + private readonly _handleAffiliatePercentageLearnMoreClick = (): void => { + window.open('/wiki#Learn-About-Affiliate-Fees', '_blank'); + }; private readonly _handleSRASelection = (sraEndpoint: string) => { const newConfig: ZeroExInstantBaseConfig = { ...this.props.value, @@ -109,6 +126,17 @@ export class ConfigGenerator extends React.Component<ConfigGeneratorProps, Confi }; this.props.onConfigChange(newConfig); }; + private readonly _handleAffiliatePercentageChange = (event: any, value: number) => { + const oldConfig: ZeroExInstantBaseConfig = this.props.value; + const newConfig: ZeroExInstantBaseConfig = { + ...oldConfig, + affiliateInfo: { + feeRecipient: oldConfig.affiliateInfo.feeRecipient, + feePercentage: value, + }, + }; + this.props.onConfigChange(newConfig); + }; private readonly _handleSelectAllClick = () => { const newConfig: ZeroExInstantBaseConfig = { ...this.props.value, diff --git a/packages/website/ts/pages/instant/config_generator_address_input.tsx b/packages/website/ts/pages/instant/config_generator_address_input.tsx index dbda547cd..de2640f48 100644 --- a/packages/website/ts/pages/instant/config_generator_address_input.tsx +++ b/packages/website/ts/pages/instant/config_generator_address_input.tsx @@ -48,7 +48,7 @@ export class ConfigGeneratorAddressInput extends React.Component< ); } - private _handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => { + private readonly _handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => { const address = event.target.value; const isValidAddress = addressUtils.isAddress(address.toLowerCase()) || address === ''; const errMsg = isValidAddress ? '' : 'Please enter a valid Ethereum address'; diff --git a/packages/website/ts/pages/instant/configurator.tsx b/packages/website/ts/pages/instant/configurator.tsx index e72f07a70..0ce1d9810 100644 --- a/packages/website/ts/pages/instant/configurator.tsx +++ b/packages/website/ts/pages/instant/configurator.tsx @@ -25,7 +25,7 @@ export class Configurator extends React.Component<ConfiguratorProps> { availableAssetDatas: [], affiliateInfo: { feeRecipient: '', - feePercentage: 0.1, + feePercentage: 0.01, }, }, }; |