Address PR feedback

This commit is contained in:
fragosti
2018-05-24 10:42:48 -07:00
parent 27d637195d
commit d057b77dc5
8 changed files with 54 additions and 38 deletions

View File

@@ -1,4 +1,12 @@
[
{
"version": "0.4.0",
"changes": [
{
"note": "Add types for `react-joyride`"
}
]
},
{
"timestamp": 1527009133,
"version": "0.3.2",

View File

@@ -4,24 +4,32 @@
declare module 'react-joyride' {
import * as React from 'react';
export interface StyleOptions {
arrowColor?: string,
backgroundColor?: string,
primaryColor?: string,
textColor?: string,
overlayColor?: string,
spotlightShadow?: string,
beaconSize?: number,
zIndex?: number,
arrowColor?: string;
backgroundColor?: string;
primaryColor?: string;
textColor?: string;
overlayColor?: string;
spotlightShadow?: string;
beaconSize?: number;
zIndex?: number;
}
export type Placement = "top" | "top-left" | "top-right" | "bottom" | "bottom-left" | "bottom-right" | "right" | "left";
export type Placement =
| 'top'
| 'top-left'
| 'top-right'
| 'bottom'
| 'bottom-left'
| 'bottom-right'
| 'right'
| 'left';
export interface Step {
title?: string;
content: React.ReactNode;
target: string;
placement?: Placement;
type?: "click" | "hover";
type?: 'click' | 'hover';
isFixed?: boolean;
allowClicksThruHole?: boolean;
disableBeacon?: boolean;
@@ -45,12 +53,12 @@ declare module 'react-joyride' {
}
export interface State {
action: string,
controlled: boolean,
index: number,
lifecycle: string,
size: 0,
status: string,
action: string;
controlled: boolean;
index: number;
lifecycle: string;
size: 0;
status: string;
}
export default class Joyride extends React.Component<Props, State> {

View File

@@ -11,9 +11,12 @@
"clean": "shx rm -f public/bundle*",
"lint": "tslint --project . 'ts/**/*.ts' 'ts/**/*.tsx'",
"watch": "webpack-dev-server --content-base public --https",
"deploy_dogfood": "npm run build; aws s3 sync ./public/. s3://dogfood.0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_staging": "npm run build; aws s3 sync ./public/. s3://staging-0xproject --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_live": "npm run build; aws s3 sync ./public/. s3://0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers"
"deploy_dogfood":
"npm run build; aws s3 sync ./public/. s3://dogfood.0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_staging":
"npm run build; aws s3 sync ./public/. s3://staging-0xproject --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_live":
"npm run build; aws s3 sync ./public/. s3://0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers"
},
"author": "Fabio Berger",
"license": "Apache-2.0",

View File

@@ -4,24 +4,19 @@ import Joyride, { Step, StyleOptions } from 'react-joyride';
import { zIndex } from 'ts/utils/style';
interface OnboardingFlowProps {
export interface OnboardingFlowProps {
steps: Step[];
stepIndex: number;
isRunning: boolean;
onClose: () => void;
onChange?: (options: any) => void;
}
const style: StyleOptions = {
const joyrideStyleOptions: StyleOptions = {
zIndex: zIndex.overlay,
};
// Wrapper around Joyride with defaults and styles set
export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
public static defaultProps: Partial<OnboardingFlowProps> = {
onChange: _.noop,
};
public render(): React.ReactNode {
return (
<Joyride
@@ -29,7 +24,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
debug={true}
steps={this.props.steps}
stepIndex={this.props.stepIndex}
styles={{ options: style }}
styles={{ options: joyrideStyleOptions }}
callback={this._handleChange.bind(this)}
/>
);
@@ -40,6 +35,5 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
case 'close':
this.props.onClose();
}
this.props.onChange(options);
}
}

View File

@@ -1,6 +1,6 @@
import * as React from 'react';
interface ContainerProps {
export interface ContainerProps {
marginTop?: string | number;
marginBottom?: string | number;
marginRight?: string | number;

View File

@@ -20,7 +20,7 @@ const defaultStyle: React.CSSProperties = {
};
export const Island: React.StatelessComponent<IslandProps> = (props: IslandProps) => (
<props.Component style={{...defaultStyle, ...props.style}} className={props.className}>
<props.Component style={{ ...defaultStyle, ...props.style }} className={props.className}>
{props.children}
</props.Component>
);

View File

@@ -192,7 +192,7 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
const isReadyToRender = this.props.blockchainIsLoaded && this.props.blockchainErr === BlockchainErrs.NoError;
const isAddressAvailable = !_.isEmpty(this.props.userAddress);
return (
<Island className="flex flex-column" style={styles.root}>
<Island className="flex flex-column wallet" style={styles.root}>
{isReadyToRender && isAddressAvailable
? _.concat(this._renderConnectedHeaderRows(), this._renderBody(), this._renderFooterRows())
: _.concat(this._renderDisconnectedHeaderRows(), this._renderDisconnectedRows())}

View File

@@ -31,4 +31,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
},
});
export const PortalOnboardingFlow: React.ComponentClass<PortalOnboardingFlowProps> = connect(mapStateToProps, mapDispatchToProps)(PortalOnboardingFlowComponent);
export const PortalOnboardingFlow: React.ComponentClass<PortalOnboardingFlowProps> = connect(
mapStateToProps,
mapDispatchToProps,
)(PortalOnboardingFlowComponent);