Fix ui warning

src/app/Layout/Layout.js

@@ -47,7 +47,7 @@ export type Props = {
   accountLoading: boolean,
   address: string,
   locale: string,
-  messages: string,
+  messages: { todo: string },
   currentBlock?: string,
   referenceCurrencies: Array<string>,
   updateReferenceCurrency: void => string,
@@ -100,7 +100,7 @@ class Layout extends React.PureComponent<Props, State> {
               <NavbarGroup align={Alignment.LEFT}>
                 <NavbarHeading>
                   <NavbarHeaderBox>
-                    <img src={ampLogo} class="Profile-image" height={25} width={25} alt="AMP Logo" />
+                    <img src={ampLogo} className="Profile-image" height={25} width={25} alt="AMP Logo" />
                   </NavbarHeaderBox>
                 </NavbarHeading>
                 {authenticated && <NavbarLink to="/wallet">Wallet</NavbarLink>}    

src/app/Layout/connect.js

@@ -11,7 +11,7 @@ export function mapStateToProps(state: State, props: Object) {
   return {
     ...selectorData,
     locale: 'en',
-    messages: 'TODO',
+    messages: { todo: 'TODO' },
   };
 }
 

src/components/Common/Blueprint.js

@@ -100,7 +100,7 @@ export const ComponentWrapper = (props) => {
 //     )
 // }
 
-export const NavbarDivider = styled(Blueprint.NavbarDivider)`
+export const NavbarDivider = styled(({ hideOnMobileS, hideOnMobileM, hideOnMobile, hideOnTablet, ...rest  }) => <Blueprint.NavbarDivider {...rest} />)`
   ${space}
   ${width}
   ${height}
@@ -170,7 +170,7 @@ export const NavbarGroup = styled(Blueprint.NavbarGroup)`
 `
 
 
-export const Card = styled(Blueprint.Card)`
+export const Card = styled(({ hideOnMobileS, hideOnMobileM, hideOnMobile, hideOnTablet, ...rest } ) => <Blueprint.Card {...rest} />)`
   ${space}
   ${width}
   ${height}

src/components/Common/Footer.js

@@ -26,7 +26,7 @@ const Footer = () => (
     <Container>
       <TopSection>
         <LogosWrapper>
-        <img src={ampLogo} class="Profile-image" width="120" height="120" alt=""/>
+        <img src={ampLogo} className="Profile-image" width="120" height="120" alt=""/>
         <FooterText mt={3}>
             <FooterSatoshiQuote>"03/Jan/2009 Chancellor on brink of second bailout for banks"</FooterSatoshiQuote>
             <FooterFirstBlock>1A1zP1eP5QGefi2DMPTfTL5SLmv7DivfNa in Block 1</FooterFirstBlock>
@@ -286,5 +286,5 @@ const FooterFirstBlock = styled.div`
   text-align: right;
 `;
 
-const LinkText = styled.a`
+const LinkText = styled.span`
 `;

src/components/Common/Icons/icon/dai.js

@@ -3,9 +3,9 @@ import React from 'react';
 
 const SvgDai = props => (
     <svg width={props.width || 64} height={props.height || 64} {...props}>
-        <g fill="none" fill-rule="evenodd">
+        <g fill="none" fillRule="evenodd">
             <circle fill="#FFF" cx="16" cy="16" r="16"/>
-            <g fill-rule="nonzero">
+            <g fillRule="nonzero">
                 <path fill="#FFCE45" d="M15.998 3.645L28.253 15.9 15.998 28.155 3.743 15.9z"/>
                 <path fill="#FEBE44" d="M15.998 19.899l-12.265-4L15.998 3.644 28.263 15.9z"/>
                 <path fill="#FFF" d="M7.999 15.1h5.6l2.399-2.667 2.666 2.666h5.6l-8.266-8.932z"/>

src/components/Common/stories.js

@@ -3,7 +3,7 @@ import { storiesOf } from '@storybook/react';
 import { withKnobs } from '@storybook/addon-knobs/react';
 import { withInfo } from '@storybook/addon-info';
 import { Intent } from '@blueprintjs/core';
-import Text, { EmphasizedText, LargeText } from './Text';
+import { Text, EmphasizedText, LargeText } from './Text';
 import CloseableCallout from './CloseableCallout'
 
 import Heading from './Heading';

src/components/OrderBook/VerticalOrderBook.js

@@ -157,6 +157,8 @@ export const OrderListRenderer = (props: *) => {
               <List className="bp3-list-unstyled">
                 <ReactCSSTransitionGroup
                   transitionName="flash-sell"
+                  transitionEnterTimeout={500}
+                  transitionLeaveTimeout={300}
                 >
                   {[...asks].reverse().map((order, index) => <SellOrder key={order.price} order={order} onClick={() => onSelect(order)} />)}
                 </ReactCSSTransitionGroup>
@@ -174,6 +176,8 @@ export const OrderListRenderer = (props: *) => {
               <List className="bp3-list-unstyled">
                 <ReactCSSTransitionGroup
                   transitionName="flash-buy"
+                  transitionEnterTimeout={500}
+                  transitionLeaveTimeout={300}
                 >
                   {bids.map((order, index) => <BuyOrder key={order.price} order={order} onClick={() => onSelect(order)} />)}
                 </ReactCSSTransitionGroup>

src/components/TradesTable/TradesTableRenderer.js

@@ -149,7 +149,11 @@ const MarketTradesPanel = (props: *) => {
           </HeadingRow>
         </ListHeader>
         <ListBody>
-        <ReactCSSTransitionGroup transitionName="flash-buy">
+        <ReactCSSTransitionGroup
+          transitionName="flash-buy"
+          transitionEnterTimeout={500}
+          transitionLeaveTimeout={300}
+        >
           {trades.map((trade, index) => (
             <Row 
               color={trade.change === 'positive' ? Colors.BUY_MUTED : Colors.SELL_MUTED} 
@@ -205,7 +209,11 @@ const UserTradesPanel = (props: *) => {
         </HeadingRow>
       </ListHeader>
       <ListBody>
-      <ReactCSSTransitionGroup transitionName="flash-buy">
+      <ReactCSSTransitionGroup
+        transitionName="flash-buy"
+        transitionEnterTimeout={500}
+        transitionLeaveTimeout={300}
+      >
         {trades.map((trade, index) => (
           <Row color={trade.status === 'EXECUTED' ? Colors.BUY_MUTED : Colors.SELL_MUTED} key={trade.hash}>
             <Cell>

src/store/services/mixpanel/index.js

@@ -2,6 +2,8 @@
 import mixpanel from 'mixpanel-browser'
 import { MIXPANEL_TOKEN } from '../../../config/environment'
 
-mixpanel.init(MIXPANEL_TOKEN)
+if (process.env.NODE_ENV === 'production') {
+  mixpanel.init(MIXPANEL_TOKEN)
+}
 
 export default mixpanel

src/store/services/provider/index.js

@@ -26,7 +26,7 @@ export const getEtherscanProvider = () => {
 export async function detectContract(address: string) {
   try {
     const contract = new Contract(address, ERC20, window.provider)
-  
+
     let decimals = await contract.decimals()
     let symbol = await contract.symbol()
 
@@ -70,7 +70,7 @@ export async function queryTransactionHistory(address: string) {
             case 'transfer':
               parsedTxs.push({ type: 'Token Transferred', status: 'CONFIRMED', hash: tx.hash, time: tx.timestamp * 1000 })
               break
-            case 'deposit': 
+            case 'deposit':
               parsedTxs.push({ type: 'ETH Deposited', status: 'CONFIRMED', hash: tx.hash, time: tx.timestamp * 1000 })
               break
             case 'withdraw':