crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rename Portal and PortalMenu components to LegacyPortal and LegacyPortalMenu

Browse Source
This commit is contained in:
Brandon Millman 2018-04-23 11:57:55 -07:00
parent d08bfbf705
commit cc471dd127
5 changed files with 25 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/website/ts/components/portal.tsx → packages/website/ts/components/legacy_portal/legacy_portal.tsx
View File

@ -14,7 +14,7 @@ import { WrappedEthSectionNoticeDialog } from 'ts/components/dialogs/wrapped_eth
import { EthWrappers } from 'ts/components/eth_wrappers'; import { EthWrappers } from 'ts/components/eth_wrappers';
import { FillOrder } from 'ts/components/fill_order'; import { FillOrder } from 'ts/components/fill_order';
import { Footer } from 'ts/components/footer'; import { Footer } from 'ts/components/footer';
import { PortalMenu } from 'ts/components/portal_menu'; import { LegacyPortalMenu } from 'ts/components/legacy_portal/legacy_portal_menu';
import { RelayerIndex } from 'ts/components/relayer_index/relayer_index'; import { RelayerIndex } from 'ts/components/relayer_index/relayer_index';
import { TokenBalances } from 'ts/components/token_balances'; import { TokenBalances } from 'ts/components/token_balances';
import { TopBar } from 'ts/components/top_bar/top_bar'; import { TopBar } from 'ts/components/top_bar/top_bar';
@ -43,9 +43,7 @@ import { utils } from 'ts/utils/utils';
const THROTTLE_TIMEOUT = 100; const THROTTLE_TIMEOUT = 100;
export interface PortalPassedProps {} export interface LegacyPortalProps {
export interface PortalAllProps {
blockchainErr: BlockchainErrs; blockchainErr: BlockchainErrs;
blockchainIsLoaded: boolean; blockchainIsLoaded: boolean;
dispatcher: Dispatcher; dispatcher: Dispatcher;
@ -67,7 +65,7 @@ export interface PortalAllProps {
translate: Translate; translate: Translate;
} }
interface PortalAllState { interface LegacyPortalState {
prevNetworkId: number; prevNetworkId: number;
prevNodeVersion: string; prevNodeVersion: string;
prevUserAddress: string; prevUserAddress: string;
@ -77,7 +75,7 @@ interface PortalAllState {
isLedgerDialogOpen: boolean; isLedgerDialogOpen: boolean;
} }
export class Portal extends React.Component<PortalAllProps, PortalAllState> { export class LegacyPortal extends React.Component<LegacyPortalProps, LegacyPortalState> {
private _blockchain: Blockchain; private _blockchain: Blockchain;
private _sharedOrderIfExists: Order; private _sharedOrderIfExists: Order;
private _throttledScreenWidthUpdate: () => void; private _throttledScreenWidthUpdate: () => void;
@ -86,13 +84,13 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) && !_.isEmpty(didDismissWethNotice); const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) && !_.isEmpty(didDismissWethNotice);
return hasAlreadyDismissedWethNotice; return hasAlreadyDismissedWethNotice;
} }
constructor(props: PortalAllProps) { constructor(props: LegacyPortalProps) {
super(props); super(props);
this._sharedOrderIfExists = this._getSharedOrderIfExists(); this._sharedOrderIfExists = this._getSharedOrderIfExists();
this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT); this._throttledScreenWidthUpdate = _.throttle(this._updateScreenWidth.bind(this), THROTTLE_TIMEOUT);
const isViewingBalances = _.includes(props.location.pathname, `${WebsitePaths.Portal}/balances`); const isViewingBalances = _.includes(props.location.pathname, `${WebsitePaths.Portal}/balances`);
const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice(); const hasAlreadyDismissedWethNotice = LegacyPortal.hasAlreadyDismissedWethNotice();
const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER); const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER);
const hasAcceptedDisclaimer = const hasAcceptedDisclaimer =
@ -123,7 +121,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
// become disconnected from their backing Ethereum node, changes user accounts, etc...) // become disconnected from their backing Ethereum node, changes user accounts, etc...)
this.props.dispatcher.resetState(); this.props.dispatcher.resetState();
} }
public componentWillReceiveProps(nextProps: PortalAllProps) { public componentWillReceiveProps(nextProps: LegacyPortalProps) {
if (nextProps.networkId !== this.state.prevNetworkId) { if (nextProps.networkId !== this.state.prevNetworkId) {
// tslint:disable-next-line:no-floating-promises // tslint:disable-next-line:no-floating-promises
this._blockchain.networkIdUpdatedFireAndForgetAsync(nextProps.networkId); this._blockchain.networkIdUpdatedFireAndForgetAsync(nextProps.networkId);
@ -145,7 +143,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
} }
if (nextProps.location.pathname !== this.state.prevPathname) { if (nextProps.location.pathname !== this.state.prevPathname) {
const isViewingBalances = _.includes(nextProps.location.pathname, `${WebsitePaths.Portal}/balances`); const isViewingBalances = _.includes(nextProps.location.pathname, `${WebsitePaths.Portal}/balances`);
const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice(); const hasAlreadyDismissedWethNotice = LegacyPortal.hasAlreadyDismissedWethNotice();
this.setState({ this.setState({
prevPathname: nextProps.location.pathname, prevPathname: nextProps.location.pathname,
isWethNoticeDialogOpen: !hasAlreadyDismissedWethNotice && isViewingBalances, isWethNoticeDialogOpen: !hasAlreadyDismissedWethNotice && isViewingBalances,
@ -200,7 +198,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
) : ( ) : (
<div className="mx-auto flex"> <div className="mx-auto flex">
<div className="col col-2 pr2 pt1 sm-hide xs-hide" style={portalMenuContainerStyle}> <div className="col col-2 pr2 pt1 sm-hide xs-hide" style={portalMenuContainerStyle}>
<PortalMenu menuItemStyle={{ color: colors.white }} /> <LegacyPortalMenu menuItemStyle={{ color: colors.white }} />
</div> </div>
<div className="col col-12 lg-col-10 md-col-10 sm-col sm-col-12"> <div className="col col-12 lg-col-10 md-col-10 sm-col sm-col-12">
<div className="py2" style={{ backgroundColor: colors.grey50 }}> <div className="py2" style={{ backgroundColor: colors.grey50 }}>

8
packages/website/ts/components/portal_menu.tsx → packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx
View File

@ -4,15 +4,15 @@ import { MenuItem } from 'ts/components/ui/menu_item';
import { Environments, WebsitePaths } from 'ts/types'; import { Environments, WebsitePaths } from 'ts/types';
import { configs } from 'ts/utils/configs'; import { configs } from 'ts/utils/configs';
export interface PortalMenuProps { export interface LegacyPortalMenuProps {
menuItemStyle: React.CSSProperties; menuItemStyle: React.CSSProperties;
onClick?: () => void; onClick?: () => void;
} }
interface PortalMenuState {} interface LegacyPortalMenuState {}
export class PortalMenu extends React.Component<PortalMenuProps, PortalMenuState> { export class LegacyPortalMenu extends React.Component<LegacyPortalMenuProps, LegacyPortalMenuState> {
public static defaultProps: Partial<PortalMenuProps> = { public static defaultProps: Partial<LegacyPortalMenuProps> = {
onClick: _.noop, onClick: _.noop,
}; };
public render() { public render() {

4
packages/website/ts/components/top_bar/top_bar.tsx
View File

@ -8,7 +8,7 @@ import * as React from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import ReactTooltip = require('react-tooltip'); import ReactTooltip = require('react-tooltip');
import { Blockchain } from 'ts/blockchain'; import { Blockchain } from 'ts/blockchain';
import { PortalMenu } from 'ts/components/portal_menu'; import { LegacyPortalMenu } from 'ts/components/legacy_portal/legacy_portal_menu';
import { SidebarHeader } from 'ts/components/sidebar_header'; import { SidebarHeader } from 'ts/components/sidebar_header';
import { ProviderDisplay } from 'ts/components/top_bar/provider_display'; import { ProviderDisplay } from 'ts/components/top_bar/provider_display';
import { TopBarMenuItem } from 'ts/components/top_bar/top_bar_menu_item'; import { TopBarMenuItem } from 'ts/components/top_bar/top_bar_menu_item';
@ -431,7 +431,7 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
<div className="pl1 py1" style={{ backgroundColor: colors.lightGrey }}> <div className="pl1 py1" style={{ backgroundColor: colors.lightGrey }}>
{this.props.translate.get(Key.PortalDApp, Deco.CapWords)} {this.props.translate.get(Key.PortalDApp, Deco.CapWords)}
</div> </div>
<PortalMenu menuItemStyle={{ color: 'black' }} onClick={this._onMenuButtonClick.bind(this)} /> <LegacyPortalMenu menuItemStyle={{ color: 'black' }} onClick={this._onMenuButtonClick.bind(this)} />
</div> </div>
); );
} }

14
packages/website/ts/containers/portal.ts → packages/website/ts/containers/legacy_portal.ts
View File

@ -3,7 +3,10 @@ import * as _ from 'lodash';
import * as React from 'react'; import * as React from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { Dispatch } from 'redux'; import { Dispatch } from 'redux';
import { Portal as PortalComponent, PortalAllProps as PortalComponentAllProps } from 'ts/components/portal'; import {
LegacyPortal as LegacyPortalComponent,
LegacyPortalProps as LegacyPortalComponentProps,
} from 'ts/components/legacy_portal/legacy_portal';
import { Dispatcher } from 'ts/redux/dispatcher'; import { Dispatcher } from 'ts/redux/dispatcher';
import { State } from 'ts/redux/reducer'; import { State } from 'ts/redux/reducer';
import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, Side, TokenByAddress } from 'ts/types'; import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, Side, TokenByAddress } from 'ts/types';
@ -34,7 +37,7 @@ interface ConnectedDispatch {
dispatcher: Dispatcher; dispatcher: Dispatcher;
} }
const mapStateToProps = (state: State, ownProps: PortalComponentAllProps): ConnectedState => { const mapStateToProps = (state: State, ownProps: LegacyPortalComponentProps): ConnectedState => {
const receiveAssetToken = state.sideToAssetToken[Side.Receive]; const receiveAssetToken = state.sideToAssetToken[Side.Receive];
const depositAssetToken = state.sideToAssetToken[Side.Deposit]; const depositAssetToken = state.sideToAssetToken[Side.Deposit];
const receiveAddress = !_.isUndefined(receiveAssetToken.address) const receiveAddress = !_.isUndefined(receiveAssetToken.address)
@ -83,6 +86,7 @@ const mapDispatchToProps = (dispatch: Dispatch<State>): ConnectedDispatch => ({
dispatcher: new Dispatcher(dispatch), dispatcher: new Dispatcher(dispatch),
}); });
export const Portal: React.ComponentClass<PortalComponentAllProps> = connect(mapStateToProps, mapDispatchToProps)( export const LegacyPortal: React.ComponentClass<LegacyPortalComponentProps> = connect(
PortalComponent, mapStateToProps,
); mapDispatchToProps,
)(LegacyPortalComponent);

2
packages/website/ts/index.tsx
View File

@ -35,7 +35,7 @@ import 'less/all.less';
// At the same time webpack statically parses for System.import() to determine bundle chunk split points // At the same time webpack statically parses for System.import() to determine bundle chunk split points
// so each lazy import needs it's own `System.import()` declaration. // so each lazy import needs it's own `System.import()` declaration.
const LazyPortal = createLazyComponent('Portal', async () => const LazyPortal = createLazyComponent('Portal', async () =>
System.import<any>(/* webpackChunkName: "portal" */ 'ts/containers/portal'), System.import<any>(/* webpackChunkName: "portal" */ 'ts/containers/legacy_portal'),
); );
const LazyZeroExJSDocumentation = createLazyComponent('Documentation', async () => const LazyZeroExJSDocumentation = createLazyComponent('Documentation', async () =>
System.import<any>(/* webpackChunkName: "zeroExDocs" */ 'ts/containers/zero_ex_js_documentation'), System.import<any>(/* webpackChunkName: "zeroExDocs" */ 'ts/containers/zero_ex_js_documentation'),