Added markdown pages for privacy policy and credits

README.md

@@ -43,10 +43,10 @@ There are external components to this template referred to as "microservices". T
 
 # TODO list
 
-- Legal Requirements:
+- ~~Legal Requirements:~~
 	- ~~Physical Mailing Address Config (for emails)~~
 	- ~~Opt-out option (for emails)~~
-	- Privacy policy & data collection notices
+	- ~~Privacy policy & data collection notices~~
 	- ~~LICENSE file~~
 	- ~~annoying "This site uses cookies" message~~
 - ~~Account system~~
@@ -79,6 +79,7 @@ There are external components to this template referred to as "microservices". T
 		- HTTPS
 		- Default admin account
 	- Information about legal requirements of the developers using this template
+		- Privacy policy & data collection notices
 
 # Email settings
 

client/components/app.jsx

@@ -5,6 +5,7 @@ import { useCookies } from 'react-cookie';
 
 //library components
 import LazyRoute from './lazy-route';
+import Markdown from './panels/markdown';
 
 //styling
 //TODO: styling import
@@ -45,6 +46,9 @@ const App = props => {
 
 					<LazyRoute path='/admin' component={() => import('./pages/admin')} />
 
+					<LazyRoute path='/privacypolicy' component={async () => () => <Markdown content={require('../markdown/privacy-policy.md').default} />} />
+					<LazyRoute path='/credits' component={async () => () => <Markdown content={require('../markdown/credits.md').default} />} />
+
 					<LazyRoute path='*' component={() => import('./pages/not-found')} />
 				</Switch>
 				<Footer />

client/components/panels/footer.jsx

@@ -1,9 +1,10 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
 const Footer = () => {
 	return (
 		<footer>
-			<p className='centered'>MERN template designed by Kayne Ruse, KR Game Studios</p>
+			<p className='centered'>MERN template designed by <a href='https://krgamestudios.com'>Kayne Ruse, KR Game Studios</a> - <Link to='/privacypolicy'>Privacy Policy</Link> - <Link to='/credits'>Credits</Link></p>
 		</footer>
 	);
 };

client/components/panels/markdown.jsx

@@ -0,0 +1,34 @@
+import React, { useState, useEffect } from 'react';
+import ReactMarkdown from 'react-markdown/with-html';
+
+const Markdown = props => {
+	//content?
+	let [contentHook, setContentHook] = useState(null);
+
+	//check arguments
+	if (!props.content) {
+		if (!props.uri) {
+			throw 'Markdown requires either content or uri prop';
+		}
+
+		//once
+		useEffect(() => {
+			fetch(props.uri)
+				.then(blob => blob.text())
+				.then(blob => setContentHook(blob))
+				.catch(e => console.error(e))
+			;
+		}, []);
+	} else
+
+	//assume raw info
+	if (!contentHook) {
+		setContentHook(props.content);
+	}
+
+	return (
+		<ReactMarkdown escapeHtml={false} props={{...props}}>{contentHook}</ReactMarkdown>
+	);
+};
+
+export default Markdown;

client/markdown/credits.md

@@ -0,0 +1,5 @@
+# Credits
+
+MERN Template developed by Kayne Ruse, KR Game Studios
+
+[https://github.com/krgamestudios/MERN-template](https://github.com/krgamestudios/MERN-template)

client/markdown/privacy-policy.md

@@ -0,0 +1,2 @@
+# Privacy Policy
+

package.json

@@ -39,6 +39,7 @@
     "nodemailer": "^6.4.17",
     "react-cookie": "^4.0.3",
     "react-dropdown-select": "^4.7.3",
+    "react-markdown": "^5.0.3",
     "regenerator-runtime": "^0.13.7",
     "sequelize": "^6.4.0"
   },
@@ -51,6 +52,7 @@
     "concurrently": "^5.3.0",
     "html-webpack-plugin": "^5.0.0-alpha.14",
     "nodemon": "^2.0.7",
+    "raw-loader": "^4.0.2",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-loadable": "^5.5.0",

webpack.config.js

@@ -36,7 +36,15 @@ module.exports = ({ production, analyzer }) => {
 							}
 						}
 					]
-				}
+				},
+				{
+					test: /\.(md)$/,
+					use: [
+						{
+							loader: 'raw-loader'
+						},
+					],
+				},
 			]
 		},
 		plugins: [