Redirect to Create Receipt Page on startup

app/App.jsx

@@ -1,33 +1,17 @@
 // Libraries
 import React, {Component} from 'react';
 
-// React Router
-import {browserHistory} from 'history';
-import {BrowserRouter as Router, Route} from 'react-router-dom';
-
 // Custom Components
 import AppNav from './components/shared/AppNav.jsx';
-import Form from './containers/Form.jsx';
-import Receipts from './containers/Receipts.jsx';
-import Settings from './containers/Settings.jsx';
-import Contacts from './containers/Contacts.jsx';
+import AppMain from './components/shared/AppMain.jsx';
 
 // Components
 class App extends Component {
   render = () =>
-    <Router history={browserHistory}>
-      <div className="appWrapper">
-        <div className="sideBarWrapper">
-          <AppNav />
-        </div>
-        <div className="mainContentWrapper">
-          <Route exact path="/" component={Receipts} />
-          <Route path="/form" component={Form} />
-          <Route path="/contacts" component={Contacts} />
-          <Route path="/settings" component={Settings} />
-        </div>
-      </div>
-    </Router>;
+    <div className="appWrapper">
+      <AppNav />
+      <AppMain/>
+    </div>;
 }
 
 export default App;

app/components/shared/AppMain.jsx

@@ -0,0 +1,26 @@
+// Libraries
+import React, {Component} from 'react';
+
+// React Router
+import {Redirect, Switch, Route} from 'react-router-dom';
+
+// Custom Components
+import Form from '../../containers/Form.jsx';
+import Receipts from '../../containers/Receipts.jsx';
+import Settings from '../../containers/Settings.jsx';
+import Contacts from '../../containers/Contacts.jsx';
+
+class AppMain extends Component {
+  render = () =>
+    <div className='mainContentWrapper'>
+      <Redirect to='/form'/>
+      <Switch>
+        <Route path='/form' component={Form} />
+        <Route path='/receipts' component={Receipts} />
+        <Route path='/contacts' component={Contacts} />
+        <Route path='/settings' component={Settings} />
+      </Switch>
+    </div>;
+}
+
+export default AppMain;

app/components/shared/AppNav.jsx

@@ -3,36 +3,35 @@ import React, {Component} from 'react';
 import {NavLink} from 'react-router-dom';
 
 class AppNav extends Component {
-  render() {
-    return (
-      <ul className="sideBar">
+  render = () =>
+    <div className='sideBarWrapper'>
+      <ul className='sideBar'>
         <li>
-          <NavLink exact to="/">
-            <i id="icon-archive" className="ion-ios-box" />
-            Receipts
+          <NavLink to='/form'>
+            <i id='icon-form' className='ion-android-list' />
+            Create
           </NavLink>
         </li>
         <li>
-          <NavLink exact to="/form">
-            <i id="icon-form" className="ion-android-list" />
-            New Receipt
+          <NavLink to='/receipts'>
+            <i id='icon-archive' className='ion-ios-box' />
+            Receipts
           </NavLink>
         </li>
         <li>
-          <NavLink exact to="/contacts">
-            <i id="icon-contacts" className="ion-person" />
+          <NavLink to='/contacts'>
+            <i id='icon-contacts' className='ion-person' />
             Contacts
           </NavLink>
         </li>
         <li>
-          <NavLink exact to="/settings">
-            <i id="icon-settings" className="ion-ios-gear" />
+          <NavLink to='/settings'>
+            <i id='icon-settings' className='ion-ios-gear' />
             Settings
           </NavLink>
         </li>
       </ul>
-    );
-  }
+    </div>;
 }
 
 export default AppNav;

app/containers/Receipts.jsx

@@ -15,7 +15,7 @@ import Receipt from '../components/receipts/Receipt.jsx';
 import EmptyMessage from '../components/shared/EmptyMessage.jsx';
 
 // Component
-class Receipts extends Component {
+class List extends Component {
   state = { openPrevWinHint: false };
 
   // Will Mount
@@ -113,4 +113,4 @@ class Receipts extends Component {
 
 export default connect(state => ({
   receipts: state.ReceiptsReducer,
-}))(Receipts);
+}))(List);

app/index.js

@@ -22,13 +22,19 @@ const AppStore = createStore(
   composeEnhancers(applyMiddleware(ReduxThunk, Logger))
 );
 
+// React Router
+import {browserHistory} from 'history';
+import {BrowserRouter as Router} from 'react-router-dom';
+
 // Main App
 import App from './App';
 
 // Render App
 ReactDOM.render(
   <Provider store={AppStore}>
-    <App />
+    <Router history={browserHistory}>
+      <App />
+    </Router>
   </Provider>,
   document.getElementById('root')
 );

modal/index.html

@@ -26,7 +26,7 @@ <h4 id="modalTitle"></h4>
     </script>
 
     <!-- Renderer -->
-    <script src="./modal.js"></script>
+    <script src="./modal_index.js"></script>
 
     <script>if (window.module) module = window.module;</script>
   </body>

preview/index.html

@@ -30,7 +30,7 @@
     </script>
 
     <!-- Renderer -->
-    <script src="./index.js"></script>
+    <script src="./preview_index.js"></script>
 
     <script>if (window.module) module = window.module;</script>
   </body>