aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--package.json2
-rw-r--r--packages/instant/src/components/erc20_asset_amount_input.tsx3
-rw-r--r--packages/instant/src/components/instant_heading.tsx4
-rw-r--r--packages/instant/src/components/scaling_amount_input.tsx3
-rw-r--r--packages/instant/src/components/scaling_input.tsx5
-rw-r--r--packages/instant/src/components/ui/text.tsx4
-rw-r--r--packages/instant/src/components/zero_ex_instant_provider.tsx17
-rw-r--r--packages/instant/src/util/analytics.ts27
-rw-r--r--packages/website/public/images/team/xianny.pngbin0 -> 49783 bytes
-rw-r--r--packages/website/ts/pages/about/about.tsx8
10 files changed, 61 insertions, 12 deletions
diff --git a/package.json b/package.json
index bc9fd06ed..7307bea5d 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
"build:monorepo_scripts": "PKG=@0x/monorepo-scripts yarn build",
"build:ts": "tsc -b",
"watch:ts": "tsc -b -w",
- "clean": "wsrun clean $PKG --fast-exit -r --parallel",
+ "clean": "wsrun clean $PKG --fast-exit -r --parallel --exclude-missing",
"remove_node_modules": "lerna clean --yes; rm -rf node_modules",
"rebuild": "run-s clean build",
"rebuild:no_website": "run-s clean build:no_website",
diff --git a/packages/instant/src/components/erc20_asset_amount_input.tsx b/packages/instant/src/components/erc20_asset_amount_input.tsx
index b825255c4..ff900842a 100644
--- a/packages/instant/src/components/erc20_asset_amount_input.tsx
+++ b/packages/instant/src/components/erc20_asset_amount_input.tsx
@@ -64,6 +64,9 @@ export class ERC20AssetAmountInput extends React.Component<ERC20AssetAmountInput
maxFontSizePx={this.props.startingFontSizePx}
onAmountChange={this._handleChange}
onFontSizeChange={this._handleFontSizeChange}
+ hasAutofocus={true}
+ /* We send in a key of asset data to force a rerender of this component when the user selects a new asset. We do this so the autofocus attribute will bring focus onto this input */
+ key={asset.assetData}
/>
</Container>
<Container
diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx
index 002695269..ace577824 100644
--- a/packages/instant/src/components/instant_heading.tsx
+++ b/packages/instant/src/components/instant_heading.tsx
@@ -107,7 +107,7 @@ export class InstantHeading extends React.Component<InstantHeadingProps, {}> {
private readonly _renderEthAmount = (): React.ReactNode => {
return (
- <Text fontSize="16px" fontColor={ColorOption.white} fontWeight={500}>
+ <Text fontSize="16px" textAlign="right" width="100%" fontColor={ColorOption.white} fontWeight={500}>
{format.ethBaseUnitAmount(
this.props.totalEthBaseUnitAmount,
4,
@@ -119,7 +119,7 @@ export class InstantHeading extends React.Component<InstantHeadingProps, {}> {
private readonly _renderDollarAmount = (): React.ReactNode => {
return (
- <Text fontSize="16px" fontColor={ColorOption.white}>
+ <Text fontSize="16px" textAlign="right" width="100%" fontColor={ColorOption.white}>
{format.ethBaseUnitAmountInUsd(
this.props.totalEthBaseUnitAmount,
this.props.ethUsdPrice,
diff --git a/packages/instant/src/components/scaling_amount_input.tsx b/packages/instant/src/components/scaling_amount_input.tsx
index 5dc719293..0861bbe05 100644
--- a/packages/instant/src/components/scaling_amount_input.tsx
+++ b/packages/instant/src/components/scaling_amount_input.tsx
@@ -18,6 +18,7 @@ export interface ScalingAmountInputProps {
value?: BigNumber;
onAmountChange: (value?: BigNumber) => void;
onFontSizeChange: (fontSizePx: number) => void;
+ hasAutofocus: boolean;
}
interface ScalingAmountInputState {
stringValue: string;
@@ -29,6 +30,7 @@ export class ScalingAmountInput extends React.Component<ScalingAmountInputProps,
onAmountChange: util.boundNoop,
onFontSizeChange: util.boundNoop,
isDisabled: false,
+ hasAutofocus: false,
};
public constructor(props: ScalingAmountInputProps) {
super(props);
@@ -64,6 +66,7 @@ export class ScalingAmountInput extends React.Component<ScalingAmountInputProps,
placeholder="0.00"
emptyInputWidthCh={3.5}
isDisabled={this.props.isDisabled}
+ hasAutofocus={this.props.hasAutofocus}
/>
);
}
diff --git a/packages/instant/src/components/scaling_input.tsx b/packages/instant/src/components/scaling_input.tsx
index e1599a316..129162a74 100644
--- a/packages/instant/src/components/scaling_input.tsx
+++ b/packages/instant/src/components/scaling_input.tsx
@@ -28,6 +28,7 @@ export interface ScalingInputProps {
maxLength?: number;
scalingSettings: ScalingSettings;
isDisabled: boolean;
+ hasAutofocus: boolean;
}
export interface ScalingInputState {
@@ -51,6 +52,7 @@ export class ScalingInput extends React.Component<ScalingInputProps, ScalingInpu
maxLength: 7,
scalingSettings: defaultScalingSettings,
isDisabled: false,
+ hasAutofocus: false,
};
public state: ScalingInputState = {
inputWidthPxAtPhaseChange: undefined,
@@ -123,7 +125,7 @@ export class ScalingInput extends React.Component<ScalingInputProps, ScalingInpu
}
}
public render(): React.ReactNode {
- const { isDisabled, fontColor, onChange, placeholder, value, maxLength } = this.props;
+ const { hasAutofocus, isDisabled, fontColor, onChange, placeholder, value, maxLength } = this.props;
const phase = ScalingInput.getPhaseFromProps(this.props);
return (
<Input
@@ -136,6 +138,7 @@ export class ScalingInput extends React.Component<ScalingInputProps, ScalingInpu
width={this._calculateWidth(phase)}
maxLength={maxLength}
disabled={isDisabled}
+ autoFocus={hasAutofocus}
/>
);
}
diff --git a/packages/instant/src/components/ui/text.tsx b/packages/instant/src/components/ui/text.tsx
index fd14cc4d1..8e573d7b9 100644
--- a/packages/instant/src/components/ui/text.tsx
+++ b/packages/instant/src/components/ui/text.tsx
@@ -11,6 +11,7 @@ export interface TextProps {
fontSize?: string;
opacity?: number;
letterSpacing?: string;
+ textAlign?: string;
textTransform?: string;
lineHeight?: string;
className?: string;
@@ -22,6 +23,7 @@ export interface TextProps {
noWrap?: boolean;
display?: string;
href?: string;
+ width?: string;
}
export const Text: React.StatelessComponent<TextProps> = ({ href, onClick, ...rest }) => {
@@ -51,6 +53,8 @@ export const StyledText =
${props => (props.display ? `display: ${props.display}` : '')};
${props => (props.letterSpacing ? `letter-spacing: ${props.letterSpacing}` : '')};
${props => (props.textTransform ? `text-transform: ${props.textTransform}` : '')};
+ ${props => (props.textAlign ? `text-align: ${props.textAlign}` : '')};
+ ${props => (props.width ? `width: ${props.width}` : '')};
&:hover {
${props =>
props.onClick ? `color: ${darken(darkenOnHoverAmount, props.theme[props.fontColor || 'white'])}` : ''};
diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx
index 9814aabf8..fe34c4466 100644
--- a/packages/instant/src/components/zero_ex_instant_provider.tsx
+++ b/packages/instant/src/components/zero_ex_instant_provider.tsx
@@ -125,14 +125,15 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
// Analytics
disableAnalytics(this.props.shouldDisableAnalyticsTracking || false);
- analytics.addEventProperties({
- embeddedHost: window.location.host,
- embeddedUrl: window.location.href,
- networkId: state.network,
- providerName: state.providerState.name,
- gitSha: process.env.GIT_SHA,
- npmVersion: process.env.NPM_PACKAGE_VERSION,
- });
+ analytics.addEventProperties(
+ analytics.generateEventProperties(
+ state.network,
+ this.props.orderSource,
+ state.providerState,
+ window,
+ this.props.affiliateInfo,
+ ),
+ );
analytics.trackInstantOpened();
}
public componentWillUnmount(): void {
diff --git a/packages/instant/src/util/analytics.ts b/packages/instant/src/util/analytics.ts
index e389e1530..cec99dd1b 100644
--- a/packages/instant/src/util/analytics.ts
+++ b/packages/instant/src/util/analytics.ts
@@ -1,3 +1,5 @@
+import { AffiliateInfo, Network, OrderSource, ProviderState } from '../types';
+
import { EventProperties, heapUtil } from './heap';
let isDisabled = false;
@@ -47,6 +49,9 @@ export interface AnalyticsEventOptions {
providerName?: string;
gitSha?: string;
npmVersion?: string;
+ orderSource?: string;
+ affiliateAddress?: string;
+ affiliateFeePercent?: number;
}
export const analytics = {
@@ -60,6 +65,28 @@ export const analytics = {
heapUtil.evaluateHeapCall(heap => heap.addEventProperties(properties));
});
},
+ generateEventProperties: (
+ network: Network,
+ orderSource: OrderSource,
+ providerState: ProviderState,
+ window: Window,
+ affiliateInfo?: AffiliateInfo,
+ ): AnalyticsEventOptions => {
+ const affiliateAddress = affiliateInfo ? affiliateInfo.feeRecipient : 'none';
+ const affiliateFeePercent = affiliateInfo ? parseFloat(affiliateInfo.feePercentage.toFixed(4)) : 0;
+ const orderSourceName = typeof orderSource === 'string' ? orderSource : 'provided';
+ return {
+ embeddedHost: window.location.host,
+ embeddedUrl: window.location.href,
+ networkId: network,
+ providerName: providerState.name,
+ gitSha: process.env.GIT_SHA,
+ npmVersion: process.env.NPM_PACKAGE_VERSION,
+ orderSource: orderSourceName,
+ affiliateAddress,
+ affiliateFeePercent,
+ };
+ },
trackInstantOpened: trackingEventFnWithoutPayload(EventNames.INSTANT_OPENED),
trackAccountLocked: trackingEventFnWithoutPayload(EventNames.ACCOUNT_LOCKED),
trackAccountReady: (address: string) => trackingEventFnWithPayload(EventNames.ACCOUNT_READY)({ address }),
diff --git a/packages/website/public/images/team/xianny.png b/packages/website/public/images/team/xianny.png
new file mode 100644
index 000000000..f6fe1ef61
--- /dev/null
+++ b/packages/website/public/images/team/xianny.png
Binary files differ
diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx
index dfe8926b0..81a3f59e1 100644
--- a/packages/website/ts/pages/about/about.tsx
+++ b/packages/website/ts/pages/about/about.tsx
@@ -248,6 +248,14 @@ const teamRow9: ProfileInfo[] = [
linkedIn: 'https://www.linkedin.com/in/steveklebanoff/',
github: 'https://github.com/steveklebanoff',
},
+ {
+ name: 'Xianny Ng',
+ title: 'Engineer',
+ description: `Developer Experience. Previously telemetry at Mapbox and platform engineering at Bench Accounting.`,
+ image: 'images/team/xianny.png',
+ linkedIn: 'https://www.linkedin.com/in/xianny/',
+ github: 'https://github.com/xianny',
+ },
];
const advisors1: ProfileInfo[] = [
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-03 15:20:45 +0800