Show onboarding page if currency is not set

client/src/App.js

@@ -1,24 +1,78 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import './App.css';
 import { Navbar } from 'react-materialize';
 import MakeMoneyMove from './cash/MakeMoneyMove';
 import Flow from "./homies/Flow";
 import Cash from './cash/Cash';
-import Chips from './chips/Chips';
 import Homies from './homies/Homies';
 import { BrowserRouter as Router, Route } from "react-router-dom";
 import RoutableNavItem from './common/RoutableNavItem';
+import axios from 'axios';
 import {
   CRIB,
-  CHIPS,
   MAKE_MONEY_MOVE,
   HOMIE_FLOW,
-  HOMIES, PUT_IN_WORK
+  HOMIES,
+  PUT_IN_WORK
 } from './RouteNames';
 import PutInWork from "./cash/PutInWork";
+import ChipSelection from "./originalGangstaOnboarding/ChipSelection";
+import {errorToast} from "./common/errorHelpers";
+
+
+const App = (props) => {
+  const [loading, setLoading] = useState(true);
+  const [originalGangsta, setOriginalGangsta] = useState({});
+
+  useEffect(() => {
+    (async() => {
+      try {
+        setLoading(true);
+        const response = await axios.get(`/api/original_gangstas/0`);
+        if (response.status === 200 && response.data){
+          setOriginalGangsta(response.data);
+        }else{
+          errorToast();
+        }
+      } catch (e) {
+        errorToast();
+      }
+      setLoading(false);
+    })();
+  }, []);
+
+  const routes = ([
+      <Route key='1' exact path={CRIB} component={() => <Cash originalGangsta={originalGangsta} />} />,
+      <Route key='2' exact path={HOMIES} component={() => <Homies originalGangsta={originalGangsta} />} />,
+      <Route key='3' path={HOMIE_FLOW} component={() => <Flow originalGangsta={originalGangsta} />} />,
+      <Route key='4' path={MAKE_MONEY_MOVE} component={() => <MakeMoneyMove originalGangsta={originalGangsta} />} />,
+      <Route key='5' path={PUT_IN_WORK} component={() => <PutInWork originalGangsta={originalGangsta} />} />
+    ]
+  );
+
+  const onboarded = () => originalGangsta.chip_name && originalGangsta.chip_name.length > 0;
+
+  const preloaderCircle = (
+    <div className="container">
+      <div className="valign-wrapper center-align preloader-circle">
+        <div className="preloader-wrapper big active">
+          <div className="spinner-layer spinner-blue-only">
+            <div className="circle-clipper left">
+              <div className="circle" />
+            </div>
+            <div className="gap-patch">
+              <div className="circle" />
+            </div>
+            <div className="circle-clipper right">
+              <div className="circle" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
 
 
-function App() {
   return (
     <Router>
       <div className="navbar-fixed">
@@ -31,10 +85,6 @@ function App() {
             Homies
           </RoutableNavItem>
 
-          <RoutableNavItem href={CHIPS}>
-            Chips
-          </RoutableNavItem>
-
           <RoutableNavItem href={MAKE_MONEY_MOVE}>
             Make Money Move
           </RoutableNavItem>
@@ -46,12 +96,9 @@ function App() {
       </div>
 
       <div className="autoscrolling">
-        <Route exact path={CRIB} component={Cash} />
-        <Route exact path={HOMIES} component={Homies} />
-        <Route path={HOMIE_FLOW} component={Flow} />
-        <Route path={CHIPS} component={Chips} />
-        <Route path={MAKE_MONEY_MOVE} component={MakeMoneyMove} />
-        <Route path={PUT_IN_WORK} component={PutInWork} />
+        { loading && preloaderCircle }
+        { !loading && !onboarded() && <ChipSelection /> }
+        { !loading && onboarded() && routes }
       </div>
     </Router>
   );