latestErrorDismissed -> latestErrorDisplay enum

packages/instant/src/containers/latest_error.tsx

@@ -3,34 +3,33 @@ import * as React from 'react';
 import { connect } from 'react-redux';
 
 import { SlidingError } from '../components/sliding_error';
-import { State } from '../redux/reducer';
+import { LatestErrorDisplay, State } from '../redux/reducer';
 import { errorDescription } from '../util/error_description';
 
 export interface LatestErrorComponentProps {
     assetData?: string;
     latestError?: any;
-    latestErrorDismissed?: boolean;
+    slidingDirection: 'down' | 'up';
 }
 
 export const LatestErrorComponent: React.StatelessComponent<LatestErrorComponentProps> = props => {
     if (!props.latestError) {
         return <div />;
     }
-    const slidingDirection = props.latestErrorDismissed ? 'down' : 'up';
     const { icon, message } = errorDescription(props.latestError, props.assetData);
-    return <SlidingError direction={slidingDirection} icon={icon} message={message} />;
+    return <SlidingError direction={props.slidingDirection} icon={icon} message={message} />;
 };
 
 interface ConnectedState {
     assetData?: string;
     latestError?: any;
-    latestErrorDismissed?: boolean;
+    slidingDirection: 'down' | 'up';
 }
 export interface LatestErrorProps {}
 const mapStateToProps = (state: State, _ownProps: LatestErrorProps): ConnectedState => ({
     assetData: state.selectedAssetData,
     latestError: state.latestError,
-    latestErrorDismissed: state.latestErrorDismissed,
+    slidingDirection: state.latestErrorDisplay === LatestErrorDisplay.Present ? 'up' : 'down',
 });
 
 export const LatestError = connect(mapStateToProps)(LatestErrorComponent);

packages/instant/src/redux/reducer.ts

@@ -7,22 +7,19 @@ import { AsyncProcessState } from '../types';
 
 import { Action, ActionTypes } from './actions';
 
-interface BaseState {
+export enum LatestErrorDisplay {
+    Present,
+    Hidden,
+}
+export interface State {
     selectedAssetData?: string;
     selectedAssetAmount?: BigNumber;
     selectedAssetBuyState: AsyncProcessState;
     ethUsdPrice?: BigNumber;
     latestBuyQuote?: BuyQuote;
+    latestError?: any;
+    latestErrorDisplay: LatestErrorDisplay;
 }
-interface StateWithError extends BaseState {
-    latestError: any;
-    latestErrorDismissed: boolean;
-}
-interface StateWithoutError extends BaseState {
-    latestError: undefined;
-    latestErrorDismissed: undefined;
-}
-export type State = StateWithError | StateWithoutError;
 
 export const INITIAL_STATE: State = {
     // TODO: Remove hardcoded zrxAssetData
@@ -32,7 +29,7 @@ export const INITIAL_STATE: State = {
     ethUsdPrice: undefined,
     latestBuyQuote: undefined,
     latestError: undefined,
-    latestErrorDismissed: undefined,
+    latestErrorDisplay: LatestErrorDisplay.Hidden,
 };
 
 export const reducer = (state: State = INITIAL_STATE, action: Action): State => {
@@ -61,18 +58,18 @@ export const reducer = (state: State = INITIAL_STATE, action: Action): State =>
             return {
                 ...state,
                 latestError: action.data,
-                latestErrorDismissed: false,
+                latestErrorDisplay: LatestErrorDisplay.Present,
             };
         case ActionTypes.HIDE_ERROR:
             return {
                 ...state,
-                latestErrorDismissed: true,
+                latestErrorDisplay: LatestErrorDisplay.Hidden,
             };
         case ActionTypes.CLEAR_ERROR:
             return {
                 ...state,
                 latestError: undefined,
-                latestErrorDismissed: undefined,
+                latestErrorDisplay: LatestErrorDisplay.Hidden,
             };
         default:
             return state;