Added dynamic menu

src/components/admin-lte/index.js

@@ -13,7 +13,7 @@ import "./admin-lte.css"
 import BchWallet from "minimal-slp-wallet"
 import VersionStatus from "../version-status"
 import { BrowserRouter as Router } from "react-router-dom"
-// import menuComponents from "../menu-components.js"
+import menuComponents from "../menu-components.js"
 
 import SendReceive from "./send-receive"
 
@@ -63,7 +63,7 @@ class AdminLTEPage extends React.Component {
 
             {_this.sidebar}
 
-            
+            {_this.renderNewMenuItems()}
           </Sidebar.Core>
 
           <Navbar.Core>
@@ -105,8 +105,7 @@ class AdminLTEPage extends React.Component {
                 />
               )}
 
-
-
+              {_this.renderNewViewItems()}
             </div>
           </Layout>
         </AdminLTE>
@@ -259,6 +258,32 @@ class AdminLTEPage extends React.Component {
       showScannerModal: !_this.state.showScannerModal,
     })
   }
+
+  // Render non-default menu items. The catch ensures that the render function
+  // won't be interrupted if there is an issue porting new menu items.
+  renderNewMenuItems() {
+    try {
+      return menuComponents && menuComponents.map(m => m.menuItem)
+    } catch (err) {
+      // TODO: Figure out how to return an invisible Item.
+      return <Item style={{display: 'none'}} />
+    }
+
+  }
+
+  // Displays the View corresponding to the dynamically loaded menu item.
+  renderNewViewItems() {
+    try {
+      return(menuComponents && menuComponents.map(m => {
+        if (_this.state.section === m.key) {
+          return m.component
+        }
+        return ""
+      }))
+    } catch(err) {
+
+    }
+  }
 }
 // Props prvided by redux
 AdminLTEPage.propTypes = {

src/components/menu-components.js

@@ -1,5 +1,3 @@
-const MenuComponents = () => {
+const MenuComponents = () => {}
 
-}
-
-export default MenuComponents;
+export default MenuComponents

src/pages/index.js

@@ -5,7 +5,8 @@ let AdminLTE =
   typeof window !== `undefined`
     ? require("../components/admin-lte").default
     : null
-// Maps the props that are going to be sended 
+
+// Maps the props that are going to be sended
 // to the component connected with Redux
 const mapStateToProps = ({ walletInfo, bchBalance, bchWallet }) => {
   return { walletInfo, bchBalance, bchWallet }
@@ -34,4 +35,11 @@ class AdminLTEPage extends React.Component {
   }
 }
 
+// const AdminLTEPage = props => {
+//   <>
+//     {ConnectedDashboard &&
+//       (<ConnectedDashboard menuComponents={props.pageContext.menuComponents} />)}
+//   </>
+// }
+
 export default AdminLTEPage