Setup demo Routes

Author: modularcoder

src/Dashboard/Demo/Components/index.tsx

@@ -0,0 +1 @@
+export { default } from './Components'

src/Dashboard/Demo/Demo.tsx

@@ -1,7 +1,22 @@
 import React from 'react'
+import { Switch, Route, RouteComponentProps } from 'react-router-dom'
 
-const Demo = () => {
-  return <div>Demo</div>
+import Features from './Features'
+import Docs from './Docs'
+import Supporters from './Supporters'
+import Discuss from './Discuss'
+
+export interface DemoProps extends RouteComponentProps {}
+
+const Demo: React.FC<DemoProps> = ({ match }) => {
+  return (
+    <Switch>
+      <Route path={`${match.url}/features`} component={Features} />
+      <Route path={`${match.url}/docs`} component={Docs} />
+      <Route path={`${match.url}/supporters`} component={Supporters} />
+      <Route path={`${match.url}/discuss`} component={Discuss} />
+    </Switch>
+  )
 }
 
 export default Demo

src/Dashboard/Demo/Discuss/Discuss.tsx

@@ -19,10 +19,11 @@ const Discuss = () => {
 
   return (
     <PageContainer>
+      <h1>Let&apos;s discuss this!</h1>
       <Paper className={classes.content}>
-        <Typography variant="h4" component="h1">
+        {/* <Typography variant="h4" component="h1">
           Discuss
-        </Typography>
+        </Typography> */}
         <Disqus.DiscussionEmbed shortname={disqusShortname} config={disqusConfig} />
       </Paper>
     </PageContainer>

src/Dashboard/Demo/Discuss/index.tsx

@@ -0,0 +1 @@
+export { default } from './Discuss'

src/Dashboard/Demo/Docs/Docs.tsx

@@ -3,7 +3,11 @@ import React from 'react'
 import PageContainer from '../../_common/BasePageContainer'
 
 const Docs = () => {
-  return <PageContainer>Docs</PageContainer>
+  return (
+    <PageContainer>
+      <h1>Docs</h1>
+    </PageContainer>
+  )
 }
 
 export default Docs

src/Dashboard/Demo/Docs/index.tsx

@@ -0,0 +1 @@
+export { default } from './Docs'

src/Dashboard/Demo/Features/Features.tsx

@@ -3,7 +3,11 @@ import React from 'react'
 import PageContainer from '../../_common/BasePageContainer'
 
 const Features = () => {
-  return <PageContainer>Features!</PageContainer>
+  return (
+    <PageContainer>
+      <h1>Features</h1>
+    </PageContainer>
+  )
 }
 
 export default Features

src/Dashboard/Demo/Features/index.tsx

@@ -0,0 +1 @@
+export { default } from './Features'

src/Dashboard/Demo/Supporters/Supporters.tsx

@@ -3,7 +3,24 @@ import React from 'react'
 import PageContainer from '../../_common/BasePageContainer'
 
 const Supporters = () => {
-  return <PageContainer>Supporters!</PageContainer>
+  return (
+    <PageContainer>
+      <h1>Supporters</h1>
+      <div
+        style={{
+          marginBottom: '10px',
+        }}
+      >
+        Support me on <strong>Patreon</strong> to release this project faster!
+      </div>
+      <a href="https://www.patreon.com/modularcoder">
+        <img
+          src="https://c5.patreon.com/external/logo/become_a_patron_button.png"
+          alt="Support me on patreon"
+        />
+      </a>
+    </PageContainer>
+  )
 }
 
 export default Supporters

src/Dashboard/Demo/Supporters/index.tsx

@@ -0,0 +1 @@
+export { default } from './Supporters'