Added dashboard framework. Components are not yet created nor is the query finalized. BOD-79

Missed in previous commit. BOD-79

client/src/pages/manage-root/manage-root.page.component.jsx

@@ -1,34 +1,10 @@
 import React from "react";
 import DashboardGridComponent from "../../components/dashboard-grid/dashboard-grid.component";
-import Test from "../../components/_test/test.component";
-import { analytics, logImEXEvent } from "../../firebase/firebase.utils";
 
 export default function ManageRootPageComponent() {
   //const client = useApolloClient();
   return (
     <div>
-      <Test />
-      <button
-        onClick={() => {
-          logImEXEvent("IMEXEVENT", { somethignArThare: 5 });
-        }}>
-        LogImEXEvent
-      </button>
-      <button
-        onClick={() => {
-          console.log("Things.");
-          analytics.logEvent("start_game", {
-            level: "10",
-            difficulty: "expert",
-          });
-          analytics.logEvent("select_content", {
-            content_type: "image",
-            content_id: "P12453",
-            items: [{ name: "Kittens" }],
-          });
-        }}>
-        Click me to start an event
-      </button>
       <DashboardGridComponent />
     </div>
   );

client/src/pages/manage-root/manage-root.page.container.jsx

@@ -1,12 +1,29 @@
 import React, { useEffect } from "react";
-import ManageRootPageComponent from "./manage-root.page.component";
 import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { setBreadcrumbs } from "../../redux/application/application.actions";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import ManageRootPageComponent from "./manage-root.page.component";
 
-export default function ManageRootPageContainer() {
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
+});
+
+export function ManageRootPageContainer({ setBreadcrumbs, bodyshop }) {
   const { t } = useTranslation();
   useEffect(() => {
     document.title = t("titles.manageroot");
-  }, [t]);
+    setBreadcrumbs([]);
+  }, [t, setBreadcrumbs]);
 
   return <ManageRootPageComponent />;
 }
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(ManageRootPageContainer);

client/src/pages/manage/manage.page.component.jsx

@@ -20,6 +20,7 @@ import PrintCenterModalContainer from "../../components/print-center-modal/print
 import { QUERY_STRIPE_ID } from "../../graphql/bodyshop.queries";
 import { selectInstanceConflict } from "../../redux/user/user.selectors";
 import "./manage.page.styles.scss";
+import TestComponent from "../../components/_test/test.component";
 
 const ManageRootPage = lazy(() =>
   import("../manage-root/manage-root.page.container")
@@ -167,6 +168,11 @@ export function Manage({ match, conflict }) {
                 <PaymentModalContainer />
               </Elements>
               <Route exact path={`${match.path}`} component={ManageRootPage} />
+              <Route
+                exact
+                path={`${match.path}/ttt`}
+                component={TestComponent}
+              />
               <Route exact path={`${match.path}/jobs`} component={JobsPage} />
               <Switch>
                 <Route