page skeleton

src/components/Category/Creatures.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const propTypes = {
+  children: PropTypes.element,
+};
+
+function Creatures({children}) {
+  return (
+    <div>
+    {children||
+      <div>test</div>
+    }
+    </div>
+  );
+}
+
+Creatures.propTypes = propTypes;
+
+export default Creatures;

src/components/Single/Creature.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const propTypes = {
+  location: PropTypes.object.isRequired,
+};
+
+function SingleCreature() {
+  let path = location.pathname.split("/");
+  if (path[path.length-1] == "") path.pop(); // Remove trailing backslash
+
+  // /portal/Creatures/Tribe/Name
+  // The first / gets counted
+  if( path.length !== 5 )
+  {
+    //TODO return PageNotFound
+    return(<div>not valid</div>);
+  }
+
+  return(
+    <div>test</div>
+  );
+}
+
+SingleCreature.propTypes = propTypes;
+
+export default SingleCreature;

src/index.js

@@ -8,7 +8,17 @@ import PageNotFound from './components/PageNotFound';
 import ExampleComponent from './components/ExampleComponent';
 import ExampleTwoDeepComponent from './components/ExampleTwoDeepComponent';
 
+// import Attacks from './component/Category/Attacks';
+// import Battlegear from './component/Category/Battlegear';
+import Creatures from './components/Category/Creatures';
+// import Locations from './component/Category/Locations';
+// import Mugic from './component/Category/Mugic';
 
+// import Attacks from './component/Category/Attacks';
+// import Battlegear from './component/Category/Battlegear';
+import SingleCreature from './components/Single/Creature';
+// import Locations from './component/Category/Locations';
+// import Mugic from './component/Category/Mugic';
 
 const routes = (
   <Route path="/" component={App}>
@@ -19,7 +29,25 @@ const routes = (
         <Route path="two-deep" mapMenuTitle="Two Deep" component={ExampleTwoDeepComponent} />
       </Route>
 
+      <Route path="Attacks" component={PageNotFound}>
+        <Route path="*" component={PageNotFound} />
+      </Route>
 
+      <Route path="Battlegear" component={PageNotFound}>
+        <Route path="*" component={PageNotFound} />
+      </Route>
+
+      <Route path="Creatures" component={Creatures}>
+        <Route path="*" component={SingleCreature} />
+      </Route>
+
+      <Route path="Locations" component={PageNotFound}>
+        <Route path="*" component={PageNotFound} />
+      </Route>
+
+      <Route path="Mugic" component={PageNotFound}>
+        <Route path="*" component={PageNotFound} />
+      </Route>
 
     </Route>
     <Route path="*" mapMenuTitle="Page Not Found" component={PageNotFound} />