import React from 'react';
import { Route, NavLink } from 'react-router-dom';

import Client from '../app/base/client';
import { redirectToLogin } from '../app/base/login';
import { localize } from '../_common/localize';

import TradeApp  from './pages/trading/trade_app.jsx';
import Statement from './pages/statement/statement.jsx';


const routes = [
    { path: '/',          component: TradeApp, exact: true },
    { path: '/statement', component: Statement, is_authenticated: true },
];

const RouteWithSubRoutes = route => (
    (route.is_authenticated && !Client.isLoggedIn()) ? // TODO: update the message style
        <a href='javascript:;' onClick={redirectToLogin}>{localize('Please login to view this page.')}</a>
        :
        <Route
            exact={route.exact}
            path={route.path}
            render={props => (
                <route.component {...props} routes={route.routes} />
            )}
        />
);

export const BinaryRoutes = () => routes.map((route, idx) => (
    <RouteWithSubRoutes key={idx} {...route} />
));

export const BinaryLink = ({ to, children, ...props }) => {
    const path = /^\//.test(to) ? to : `/${to || ''}`; // Default to '/'
    const route = routes.find(r => r.path === path);
    if (to && route) {
        return (
            <NavLink to={path} activeClassName='active' exact={route.exact} {...props}>
                {children}
            </NavLink>
        );
    } else if (!to) {
        return (
            <a href='javascript:;' {...props}>
                {children}
            </a>
        );
    }
    // else
    throw new Error(`Route not found: ${to}`);
};

@@ -520,24 +520,124 @@
  route =%3E (%0A
+    %3CRoute%0A        exact=%7Broute.exact%7D%0A        path=%7Broute.path%7D%0A        render=%7Bprops =%3E (%0A        
     (route.i
@@ -695,16 +695,27 @@
  update 
+styling of 
 the mess
@@ -722,22 +722,25 @@
 age 
-style%0A
+below%0A   
         
 %3Ca h
@@ -727,32 +727,37 @@
 elow%0A           
+     
 %3Ca href='javascr
@@ -842,126 +842,10 @@
 %3C/a%3E
-%0A        :%0A        %3CRoute%0A            exact=%7Broute.exact%7D%0A            path=%7Broute.path%7D%0A            render=%7Bprops =%3E (
+ :
 %0A   
@@ -922,19 +922,11 @@
     
-    )%7D%0A    
+)%7D%0A
     

Fix routing issue