@copart/ops-tool-kit 1.9.0-alpha.1 → 1.9.0-alpha.2

package/dist/ops-tool-kit.js

@@ -33,7 +33,7 @@ var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM);
 
 const name$e = "@copart/ops-tool-kit";
-const version$3 = "1.9.0-alpha.1";
+const version$3 = "1.9.0-alpha.2";
 const main = "dist/ops-tool-kit.js";
 const style = "dist/ops-tool-kit.css";
 const files = [
@@ -2584,13 +2584,11 @@ function set$1(target, path, value, options) {
 
   let opts = options || {};
   const isArray = Array.isArray(path);
-
   if (!isArray && typeof path !== 'string') {
     return target;
   }
 
   let merge = opts.merge;
-
   if (merge && typeof merge !== 'function') {
     merge = Object.assign;
   }
@@ -2633,7 +2631,8 @@ function result(target, path, value, merge) {
 function split(path, options) {
   const id = createKey(path, options);
   if (set$1.memo[id]) return set$1.memo[id];
-  const char = options && options.separator ? options.separator : '.';
+
+  const char = (options && options.separator) ? options.separator : '.';
   let keys = [];
   let res = [];
 
@@ -2645,32 +2644,25 @@ function split(path, options) {
 
   for (let i = 0; i < keys.length; i++) {
     let prop = keys[i];
-
     while (prop && prop.slice(-1) === '\\' && keys[i + 1]) {
       prop = prop.slice(0, -1) + char + keys[++i];
     }
-
     res.push(prop);
   }
-
   set$1.memo[id] = res;
   return res;
 }
 
 function createKey(pattern, options) {
   let id = pattern;
-
   if (typeof options === 'undefined') {
     return id + '';
   }
-
   const keys = Object.keys(options);
-
   for (let i = 0; i < keys.length; i++) {
     const key = keys[i];
     id += ';' + key + '=' + String(options[key]);
   }
-
   return id;
 }
 
@@ -30970,7 +30962,7 @@ var GoHome = function GoHome(props) {
   }, props.reason));
 };
 
-var css_248z$1 = ".utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer {\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  background: #3A4454;\n  min-width: 100px;\n  max-width: 100px;\n  height: 100%;\n  color: #ffffff;\n  transition: max-width 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:hover {\n  max-width: 400px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu {\n  flex: 1;\n  overflow-y: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu::-webkit-scrollbar { \n  display: none;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\n  display: flex;\n  width: 100%;\n  padding: 6px 0px 6px 12px;\n  border-radius: 5px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--selected {\n  color: #323130;\n  background-color: #fff;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\n  margin-left: auto;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--expandedMenu {\n  background-color: #73A6FF;\n  transition: background-color 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i {\n  margin-left: auto;\n  font-size: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemCount {\n  margin-left: auto;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\n  margin-right: 14.5px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  max-width: 0;\n  overflow: hidden;\n  white-space:nowrap;\n  margin: 0 5px;\n  font-weight: 100;\n  transition: max-width 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  max-width: 100%;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  margin: 0 5px 0 0;\n  font-weight: 600;\n  margin-left: 0px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\n  margin-right: 0px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\n  padding-left: 15px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName > span {\n  display: inline;\n  display: initial;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel2 {\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3 {\n  margin-left: 10px;\n  padding: 0 2px;\n  background-color: #232932;\n  border-left: 1px solid #8A8886;\n  overflow: hidden;\n  max-height: 0px;\n  transition: max-height 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3.utilities_ops-app-frame_NavigationBar_NavigationBar--expanded {\n  max-height: 500px;\n  margin-top: 3px;\n}";
+var css_248z$1 = ".utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer {\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  background: #3A4454;\n  min-width: 100px;\n  max-width: 100px;\n  height: 100%;\n  color: #ffffff;\n  transition: max-width 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:hover {\n  max-width: 400px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu {\n  flex: 1;\n  overflow-y: auto;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu::-webkit-scrollbar { \n  display: none;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\n  display: flex;\n  width: 100%;\n  padding: 6px 0px 6px 12px;\n  border-radius: 5px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--selected {\n  color: #323130;\n  background-color: #fff;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\n  margin-left: auto;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--expandedMenu {\n  background-color: #73A6FF;\n  transition: background-color 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i {\n  margin-left: auto;\n  font-size: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemCount {\n  margin-left: auto;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\n  margin-right: 14.5px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  max-width: 0;\n  overflow: hidden;\n  white-space:nowrap;\n  margin: 0 5px;\n  font-weight: 100;\n  cursor: pointer;\n  transition: max-width 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  max-width: 100%;\n  margin-right: 10px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\n  margin: 0 5px 0 0;\n  font-weight: 600;\n  margin-left: 0px;\n  cursor: auto;\n  cursor: initial;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\n  margin-right: 0px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\n  padding-left: 15px;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName > span {\n  display: inline;\n  display: initial;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel2 {\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3 {\n  margin-left: 10px;\n  padding: 0 2px;\n  background-color: #232932;\n  border-left: 1px solid #8A8886;\n  overflow: hidden;\n  max-height: 0px;\n  transition: max-height 0.5s ease-in-out;\n}\n\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3.utilities_ops-app-frame_NavigationBar_NavigationBar--expanded {\n  max-height: 500px;\n  margin-top: 3px;\n}";
 styleInject(css_248z$1);
 
 var _styleModuleImportMap = {
@@ -30991,18 +30983,25 @@ var _styleModuleImportMap = {
   }
 };
 
-var NavigationMenuLevel1 = function NavigationMenuLevel1(_ref) {
+var NavIcon = function NavIcon(_ref) {
+  var icon = _ref.icon;
+  return typeof icon === 'string' ? React__default["default"].createElement(coreComponents.Icon, {
+    name: icon
+  }) : icon;
+};
+
+var NavigationMenuLevel1 = function NavigationMenuLevel1(_ref2) {
   var _navItem$name;
 
-  var navItem = _ref.navItem,
-      isHover = _ref.isHover,
-      activeSubmenu = _ref.activeSubmenu,
-      setActiveSubmenu = _ref.setActiveSubmenu,
-      navigateTo = _ref.navigateTo,
-      selected = _ref.selected,
-      setSelected = _ref.setSelected,
-      defaultRedirect = _ref.defaultRedirect,
-      reloadMenuItems = _ref.reloadMenuItems;
+  var navItem = _ref2.navItem,
+      isHover = _ref2.isHover,
+      activeSubmenu = _ref2.activeSubmenu,
+      setActiveSubmenu = _ref2.setActiveSubmenu,
+      navigateTo = _ref2.navigateTo,
+      selected = _ref2.selected,
+      setSelected = _ref2.setSelected,
+      defaultRedirect = _ref2.defaultRedirect,
+      reloadMenuItems = _ref2.reloadMenuItems;
   var hasSubMenuItems = navItem.subMenuItems && navItem.subMenuItems.length > 0;
   return React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1"
@@ -31010,11 +31009,13 @@ var NavigationMenuLevel1 = function NavigationMenuLevel1(_ref) {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem"
   }, React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon"
-  }, navItem.icon), React__default["default"].createElement("div", {
+  }, React__default["default"].createElement(NavIcon, {
+    icon: navItem.icon
+  })), React__default["default"].createElement("div", {
     className: ((isHover ? 'hovered' : '') ? (isHover ? 'hovered' : '') + " " : "") + "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName"
   }, (_navItem$name = navItem.name) === null || _navItem$name === void 0 ? void 0 : _navItem$name.toUpperCase()), React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemCount"
-  }, navItem.count)), React__default["default"].createElement("div", null, hasSubMenuItems && navItem.subMenuItems.map(function (subItem) {
+  }, navItem.count)), React__default["default"].createElement("div", null, hasSubMenuItems ? navItem.subMenuItems.map(function (subItem) {
     return React__default["default"].createElement(NavigationMenuLevel2, {
       key: subItem.name,
       isHover: isHover,
@@ -31027,19 +31028,19 @@ var NavigationMenuLevel1 = function NavigationMenuLevel1(_ref) {
       navigateTo: navigateTo,
       reloadMenuItems: reloadMenuItems
     });
-  })));
+  }) : null));
 };
 
-var NavigationMenuLevel2 = function NavigationMenuLevel2(_ref2) {
-  var navItem = _ref2.navItem,
-      isHover = _ref2.isHover,
-      selected = _ref2.selected,
-      setSelected = _ref2.setSelected,
-      defaultRedirect = _ref2.defaultRedirect,
-      activeSubmenu = _ref2.activeSubmenu,
-      setActiveSubmenu = _ref2.setActiveSubmenu,
-      navigateTo = _ref2.navigateTo,
-      reloadMenuItems = _ref2.reloadMenuItems;
+var NavigationMenuLevel2 = function NavigationMenuLevel2(_ref3) {
+  var navItem = _ref3.navItem,
+      isHover = _ref3.isHover,
+      selected = _ref3.selected,
+      setSelected = _ref3.setSelected,
+      defaultRedirect = _ref3.defaultRedirect,
+      activeSubmenu = _ref3.activeSubmenu,
+      setActiveSubmenu = _ref3.setActiveSubmenu,
+      navigateTo = _ref3.navigateTo,
+      reloadMenuItems = _ref3.reloadMenuItems;
 
   var _useState = React.useState(navItem.count),
       _useState2 = _slicedToArray(_useState, 2),
@@ -31071,7 +31072,9 @@ var NavigationMenuLevel2 = function NavigationMenuLevel2(_ref2) {
     })
   }, React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon"
-  }, navItem.icon), React__default["default"].createElement("div", {
+  }, React__default["default"].createElement(NavIcon, {
+    icon: navItem.icon
+  })), React__default["default"].createElement("div", {
     className: ((isHover ? 'hovered' : '') ? (isHover ? 'hovered' : '') + " " : "") + "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName"
   }, navItem.name), hasSubMenuItems ? React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton"
@@ -31083,7 +31086,7 @@ var NavigationMenuLevel2 = function NavigationMenuLevel2(_ref2) {
     className: _getClassName("NavMenuLevel3 ".concat(activeSubmenu == navItem.route ? "expanded" : ""), _styleModuleImportMap, {
       "handleMissingStyleName": "warn"
     })
-  }, hasSubMenuItems && navItem.subMenuItems.map(function (subItem) {
+  }, hasSubMenuItems ? navItem.subMenuItems.map(function (subItem) {
     return React__default["default"].createElement(NavigationMenuLevel3, {
       key: subItem.name,
       isHover: isHover,
@@ -31093,16 +31096,16 @@ var NavigationMenuLevel2 = function NavigationMenuLevel2(_ref2) {
       defaultRedirect: defaultRedirect,
       navigateTo: navigateTo
     });
-  })));
+  }) : null));
 };
 
-var NavigationMenuLevel3 = function NavigationMenuLevel3(_ref3) {
-  var navItem = _ref3.navItem,
-      isHover = _ref3.isHover,
-      selected = _ref3.selected,
-      setSelected = _ref3.setSelected,
-      defaultRedirect = _ref3.defaultRedirect,
-      navigateTo = _ref3.navigateTo;
+var NavigationMenuLevel3 = function NavigationMenuLevel3(_ref4) {
+  var navItem = _ref4.navItem,
+      isHover = _ref4.isHover,
+      selected = _ref4.selected,
+      setSelected = _ref4.setSelected,
+      defaultRedirect = _ref4.defaultRedirect,
+      navigateTo = _ref4.navigateTo;
 
   var _useState3 = React.useState(navItem.count),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -31129,7 +31132,9 @@ var NavigationMenuLevel3 = function NavigationMenuLevel3(_ref3) {
     })
   }, React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon"
-  }, navItem.icon), React__default["default"].createElement("div", {
+  }, React__default["default"].createElement(NavIcon, {
+    icon: navItem.icon
+  })), React__default["default"].createElement("div", {
     className: ((isHover ? 'hovered' : '') ? (isHover ? 'hovered' : '') + " " : "") + "utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName"
   }, navItem.name), React__default["default"].createElement("div", {
     key: isHover,
@@ -31137,12 +31142,12 @@ var NavigationMenuLevel3 = function NavigationMenuLevel3(_ref3) {
   }, countText));
 };
 
-var NavigationMenu = function NavigationMenu(_ref4) {
-  var navItems = _ref4.navItems,
-      isHover = _ref4.isHover,
-      navigateTo = _ref4.navigateTo,
-      configDepth = _ref4.configDepth,
-      reloadMenuItems = _ref4.reloadMenuItems;
+var NavigationMenu = function NavigationMenu(_ref5) {
+  var navItems = _ref5.navItems,
+      isHover = _ref5.isHover,
+      navigateTo = _ref5.navigateTo,
+      configDepth = _ref5.configDepth,
+      reloadMenuItems = _ref5.reloadMenuItems;
 
   var _useState5 = React.useState(null),
       _useState6 = _slicedToArray(_useState5, 2),
@@ -31203,10 +31208,9 @@ var NavigationMenu = function NavigationMenu(_ref4) {
   }));
 };
 
-var NavigationBar = function NavigationBar(_ref5) {
-  var getNavItems = _ref5.getNavItems,
-      showNavigation = _ref5.showNavigation,
-      navigateTo = _ref5.navigateTo;
+var NavigationBar = function NavigationBar(_ref6) {
+  var getNavItems = _ref6.getNavItems,
+      navigateTo = _ref6.navigateTo;
 
   var _useState9 = React.useState(null),
       _useState10 = _slicedToArray(_useState9, 2),
@@ -31228,12 +31232,30 @@ var NavigationBar = function NavigationBar(_ref5) {
       isConfigValid = _useState16[0],
       setConfigValid = _useState16[1];
 
+  React.useEffect(function () {
+    var navItems = getNavItems();
+
+    if (Array.isArray(navItems)) {
+      var isValid = validateConfig(navItems);
+
+      if (isValid) {
+        setConfigDepth(getDepth(navItems));
+        setNavItemsModified(updateRoutes(navItems, ""));
+        setConfigValid(true);
+      } else {
+        setConfigValid(false);
+      }
+    } else {
+      reloadMenuItems();
+    }
+  }, []);
+
   var updateRoutes = function updateRoutes(navItems, parentRoute) {
     var updatedItems = navItems.map(function (item) {
       var updatedItem = _objectSpread2({}, item);
 
       if (updatedItem.route) {
-        updatedItem.route = parentRoute + updatedItem.route;
+        updatedItem.route = parentRoute + '/' + updatedItem.route;
       }
 
       if (updatedItem.subMenuItems) {
@@ -31247,18 +31269,11 @@ var NavigationBar = function NavigationBar(_ref5) {
 
   var getDepth = function getDepth(navItems) {
     var depth = 0;
-
-    if (navItems.subMenuItems) {
-      navItems.subMenuItems.forEach(function (d) {
-        var tmpDepth = getDepth(d);
-
-        if (tmpDepth > depth) {
-          depth = tmpDepth;
-        }
-      });
-    }
-
-    return 1 + depth;
+    navItems.forEach(function (navItem) {
+      var subMenuDepth = navItem.subMenuItems ? getDepth(navItem.subMenuItems) : 0;
+      depth = Math.max(depth, 1 + subMenuDepth);
+    });
+    return depth;
   };
 
   var validateConfig = function validateConfig(navItems) {
@@ -31289,7 +31304,7 @@ var NavigationBar = function NavigationBar(_ref5) {
         var isVaild = validateConfig(result);
 
         if (isVaild) {
-          setConfigDepth(getDepth.apply(void 0, _toConsumableArray(result)));
+          setConfigDepth(getDepth(result));
           setNavItemsModified(updateRoutes(result, ""));
           setConfigValid(true);
         } else {
@@ -31299,24 +31314,6 @@ var NavigationBar = function NavigationBar(_ref5) {
     }
   };
 
-  React.useEffect(function () {
-    var navItems = getNavItems();
-
-    if (Array.isArray(navItems)) {
-      var isValid = validateConfig(navItems);
-
-      if (isValid) {
-        setConfigDepth(getDepth.apply(void 0, _toConsumableArray(navItems)));
-        setNavItemsModified(updateRoutes(navItems, ""));
-        setConfigValid(true);
-      } else {
-        setConfigValid(false);
-      }
-    } else {
-      reloadMenuItems();
-    }
-  }, []);
-
   var onMouseOver = function onMouseOver() {
     setHover(true);
   };
@@ -31325,7 +31322,7 @@ var NavigationBar = function NavigationBar(_ref5) {
     setHover(false);
   };
 
-  return showNavigation ? React__default["default"].createElement("div", {
+  return React__default["default"].createElement("div", {
     className: "utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer",
     onMouseOver: onMouseOver,
     onMouseLeave: onMouseLeave
@@ -31335,7 +31332,7 @@ var NavigationBar = function NavigationBar(_ref5) {
     navigateTo: navigateTo,
     configDepth: configDepth,
     reloadMenuItems: reloadMenuItems
-  }) : null, !isConfigValid ? React__default["default"].createElement("div", null, "Please check your navigation config") : null) : null;
+  }) : null, !isConfigValid ? React__default["default"].createElement("div", null, "Please check your navigation config") : null);
 };
 
 /******************************************************************************
@@ -45625,6 +45622,325 @@ function withFirebaseConfigCheck (Comp) {
 
 var Notifications = withFirebaseConfigCheck(Notifications$2);
 
+var _ref, _ref2;
+var navItems = [{
+  name: "Dispatch",
+  icon: null,
+  count: null,
+  route: 'dispatch',
+  subMenuItems: [{
+    name: "Lots",
+    route: "lots",
+    icon: "Car",
+    count: null,
+    subMenuItems: [{
+      name: "All",
+      route: "all",
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }, {
+      name: "Pending Trip Build",
+      route: 'pendingtripsbuild',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 10958
+    }, {
+      name: "Pending Processing",
+      route: 'dispatch',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 2089
+    }, {
+      name: "Pending Paperwork Verification",
+      route: 'pendingprocessing',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 268
+    }, {
+      name: "Partial Paperwork Verified",
+      route: 'partialpaperwork',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 19
+    }, {
+      name: "Awaiting Dispatch",
+      route: 'awaitingdispatch',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 18
+    }, {
+      name: "Overdue and Due Today",
+      route: 'overdue',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 10462
+    }, {
+      name: "Issue Queue",
+      route: 'issuequeue',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 21
+    }]
+  }, {
+    name: "Trips View",
+    route: 'tripsview',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "AddEvent"
+    })
+  }, (_ref = {
+    name: "Tow Providers",
+    route: 'towproviders',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "DeliveryTruck"
+    })
+  }, _defineProperty(_ref, "route", "/towproviders"), _defineProperty(_ref, "subMenuItems", [{
+    name: "All",
+    route: 'all',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 13174
+  }]), _ref), {
+    name: "Drivers",
+    route: 'drivers',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "AlignHorizontalLeft"
+    }),
+    subMenuItems: [{
+      name: "All",
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      route: 'all',
+      count: 13174
+    }]
+  }, {
+    name: "Work Requests",
+    route: 'workrequests',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "AnchorLock"
+    }),
+    subMenuItems: [{
+      name: "All",
+      route: 'all',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }]
+  }, {
+    name: "Advanced Charge Discrepancy",
+    route: 'advanced',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "CalendarDay"
+    }),
+    subMenuItems: [{
+      name: "All",
+      route: 'all',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }]
+  }, {
+    name: "One Time Rate Request Change",
+    route: 'onetime',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "AddEvent"
+    }),
+    subMenuItems: [{
+      name: "All",
+      route: 'all',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }]
+  }]
+}, {
+  name: "Yard To Yard",
+  route: 'y2y',
+  icon: null,
+  subMenuItems: [{
+    name: "Y2Y Trips",
+    route: 'trips',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Chart"
+    }),
+    subMenuItems: [{
+      name: "All",
+      route: 'all',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }]
+  }, {
+    name: "Y2Y Requests",
+    route: 'requests',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "BucketColor"
+    }),
+    subMenuItems: [{
+      name: "All",
+      route: 'all',
+      icon: React__default["default"].createElement(coreComponents.Icon, {
+        name: "Car"
+      }),
+      count: 13174
+    }]
+  }]
+}];
+[{
+  name: "Lots",
+  route: "/lots",
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "Car"
+  }),
+  count: null,
+  subMenuItems: [{
+    name: "All",
+    route: "/all",
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 13174
+  }, {
+    name: "Pending Trip Build",
+    route: 'pendingtripsbuild',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 10958
+  }, {
+    name: "Pending Processing",
+    route: 'dispatch',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 2089
+  }, {
+    name: "Pending Paperwork Verification",
+    route: 'pendingprocessing',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 268
+  }, {
+    name: "Partial Paperwork Verified",
+    route: 'partialpaperwork',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 19
+  }, {
+    name: "Awaiting Dispatch",
+    route: 'awaitingdispatch',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 18
+  }, {
+    name: "Overdue and Due Today",
+    route: 'overdue',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 10462
+  }, {
+    name: "Issue Queue",
+    route: 'issuequeue',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 21
+  }]
+}, {
+  name: "Trips View",
+  route: 'tripsview',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "AddEvent"
+  })
+}, (_ref2 = {
+  name: "Tow Providers",
+  route: 'towproviders',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "DeliveryTruck"
+  })
+}, _defineProperty(_ref2, "route", "/towproviders"), _defineProperty(_ref2, "subMenuItems", [{
+  name: "All",
+  route: 'all',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "Car"
+  }),
+  count: 13174
+}]), _ref2), {
+  name: "Drivers",
+  route: 'drivers',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "AlignHorizontalLeft"
+  }),
+  subMenuItems: [{
+    name: "All",
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    route: 'all',
+    count: 13174
+  }]
+}, {
+  name: "Work Requests",
+  route: 'workrequests',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "AnchorLock"
+  }),
+  subMenuItems: [{
+    name: "All",
+    route: 'all',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 13174
+  }]
+}, {
+  name: "Advanced Charge Discrepancy",
+  route: 'advanced',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "CalendarDay"
+  }),
+  subMenuItems: [{
+    name: "All",
+    route: 'all',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 13174
+  }]
+}, {
+  name: "One Time Rate Request Change",
+  route: 'onetime',
+  icon: React__default["default"].createElement(coreComponents.Icon, {
+    name: "AddEvent"
+  }),
+  subMenuItems: [{
+    name: "All",
+    route: 'all',
+    icon: React__default["default"].createElement(coreComponents.Icon, {
+      name: "Car"
+    }),
+    count: 13174
+  }]
+}];
+
 var css_248z = ".utilities_ops-app-frame_AppFrame_AppFrame--AppFrame {\n  background: var(--paleGray);\n  background: var(--paleGray);\n  height: 100vh;\n  max-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  flex-basis: 0;\n}\n\n.utilities_ops-app-frame_AppFrame_AppFrame--header {\n  flex: 0 1 auto;\n  display: flex;\n  flex-direction: column;\n}\n\n/* Wrapper that contains the app being developed. */\n\n.utilities_ops-app-frame_AppFrame_AppFrame--AppContainer {\n  flex: 1 1 auto;\n}\n";
 styleInject(css_248z);
 
@@ -45692,22 +46008,20 @@ var AppFrame = function AppFrame(props) {
     pathname: window.location.pathname
   }), React__default["default"].createElement("main", {
     className: "utilities_ops-app-frame_AppFrame_AppFrame--AppContainer"
-  }, !props.hideNavBar && storage.isAuthenticated ? React__default["default"].createElement(NavigationBar, {
+  }, props.showNavigation && storage.isAuthenticated ? React__default["default"].createElement(NavigationBar, {
     navigateTo: props.navigateTo,
-    showNavigation: props.showNavigation,
     getNavItems: props.getNavItems
   }) : null, React__default["default"].createElement("div", {
     style: {
-      marginLeft: props.hideNavBar ? '0px' : '100px'
+      marginLeft: props.showNavigation ? '100px' : '0px'
     }
   }, props.children)))))));
 };
 AppFrame.defaultProps = {
-  hideNavBar: true,
   handleScrolling: true,
   showNavigation: true,
   getNavItems: function getNavItems() {
-    return [];
+    return navItems;
   }
 };