From 561851a0299294485d64ed26af92e7fd089500cb Mon Sep 17 00:00:00 2001
From: Chris Troutner <chris.troutner@gmail.com>
Date: Mon, 6 Jul 2020 18:03:44 -0700
Subject: [PATCH 1/2] Created demo component

---
 src/demo-component/index.js                   | 39 +++++++++++++++++++
 .../components/menu-components.js             |  7 ++--
 2 files changed, 43 insertions(+), 3 deletions(-)
 create mode 100644 src/demo-component/index.js

diff --git a/src/demo-component/index.js b/src/demo-component/index.js
new file mode 100644
index 0000000..80089d6
--- /dev/null
+++ b/src/demo-component/index.js
@@ -0,0 +1,39 @@
+/*
+  This is a demonstration component. It helps to show how you can create new
+  menu items and Views in your own BCH web wallet dashboard app.
+
+  This file controls the View (the part on the right side of the dashboard) of
+  the component. The menu item is controlled by the menu-components.js file.
+*/
+
+import React from 'react'
+import { Row, Col, Content, Box, Button } from 'adminlte-2-react'
+
+class DemoComponent extends React.Component {
+  render () {
+    return (
+      <Content
+        title="Demo Component"
+        subTitle="Getting started with adminlte-2-react"
+        browserTitle="Demo Component"
+      >
+        <Row>
+          <Col xs={12}>
+            <Box
+              title="A Box"
+              type="primary"
+              closable
+              collapsable
+              footer={<Button type="danger" text="Danger Button" />}
+            >
+              This is the View portion of the Demo Component. This view is
+              controlled by the src/demo-component/index.js file.
+            </Box>
+          </Col>
+        </Row>
+      </Content>
+    )
+  }
+}
+
+export default DemoComponent
diff --git a/src/gatsby-ipfs-web-wallet/components/menu-components.js b/src/gatsby-ipfs-web-wallet/components/menu-components.js
index 6e02fd0..5fc0d6e 100644
--- a/src/gatsby-ipfs-web-wallet/components/menu-components.js
+++ b/src/gatsby-ipfs-web-wallet/components/menu-components.js
@@ -8,14 +8,15 @@
 
 import React from 'react'
 import { Sidebar } from 'adminlte-2-react'
+import DemoComponent from '../../demo-component'
 
 const { Item } = Sidebar
 
 const MenuComponents = [
   {
-    key: 'New Component',
-    component: <div>Test!</div>,
-    menuItem: <Item icon='fas-cog' key='New Component' text='New Component' />
+    key: 'Demo Component',
+    component: <DemoComponent />,
+    menuItem: <Item icon="fas-cog" key="Demo Component" text="Demo Component" />
   }
 ]
 

From d799c07cf4d25552f31e87f93bbe4a7b7b7968b0 Mon Sep 17 00:00:00 2001
From: Chris Troutner <chris.troutner@gmail.com>
Date: Mon, 6 Jul 2020 18:14:29 -0700
Subject: [PATCH 2/2] fix(eslint): Fixed eslint issue

---
 .eslintrc.json                                       |  3 +++
 .prettierrc                                          |  3 ++-
 src/demo-component/index.js                          | 12 ++++++------
 .../components/menu-components.js                    |  2 +-
 4 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index 1cb87bd..78ff69f 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -6,5 +6,8 @@
   },
   "parserOptions": {
     "ecmaVersion": 10
+  },
+  "rules": {
+    "no-unused-vars": "off"
   }
 }
diff --git a/.prettierrc b/.prettierrc
index 33d2cfa..519323c 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,4 +1,5 @@
 {
   "arrowParens": "avoid",
-  "semi": false
+  "semi": false,
+  "no-unused-vars": false
 }
diff --git a/src/demo-component/index.js b/src/demo-component/index.js
index 80089d6..0011b52 100644
--- a/src/demo-component/index.js
+++ b/src/demo-component/index.js
@@ -13,18 +13,18 @@ class DemoComponent extends React.Component {
   render () {
     return (
       <Content
-        title="Demo Component"
-        subTitle="Getting started with adminlte-2-react"
-        browserTitle="Demo Component"
+        title='Demo Component'
+        subTitle='Getting started with adminlte-2-react'
+        browserTitle='Demo Component'
       >
         <Row>
           <Col xs={12}>
             <Box
-              title="A Box"
-              type="primary"
+              title='A Box'
+              type='primary'
               closable
               collapsable
-              footer={<Button type="danger" text="Danger Button" />}
+              footer={<Button type='danger' text='Danger Button' />}
             >
               This is the View portion of the Demo Component. This view is
               controlled by the src/demo-component/index.js file.
diff --git a/src/gatsby-ipfs-web-wallet/components/menu-components.js b/src/gatsby-ipfs-web-wallet/components/menu-components.js
index 5fc0d6e..3d43c1d 100644
--- a/src/gatsby-ipfs-web-wallet/components/menu-components.js
+++ b/src/gatsby-ipfs-web-wallet/components/menu-components.js
@@ -16,7 +16,7 @@ const MenuComponents = [
   {
     key: 'Demo Component',
     component: <DemoComponent />,
-    menuItem: <Item icon="fas-cog" key="Demo Component" text="Demo Component" />
+    menuItem: <Item icon='fas-cog' key='Demo Component' text='Demo Component' />
   }
 ]