Refactor navigation

mruminski · Nov 16, 2018 · 0cb8414 · 0cb8414
1 parent d1ff2ad
commit 0cb8414
Showing 1 changed file with 19 additions and 9 deletions.
diff --git a/src/presentational/navigation.component.jsx b/src/presentational/navigation.component.jsx
@@ -2,6 +2,20 @@ import React from "react";
 import { Link } from "react-router";
 import "../../node_modules/bootstrap/dist/css/bootstrap.css";
 import "../../node_modules/bootstrap/dist/css/bootstrap-theme.css";
+const linksArr = [
+  {
+    url: "/countries",
+    name: "Countries"
+  },
+  {
+    url: "/continents",
+    name: "Continents"
+  },
+  {
+    url: "/contact",
+    name: "Contact"
+  }
+];
 
 const Navigation = props => (
   <div>
@@ -14,15 +28,11 @@ const Navigation = props => (
         </div>
         <div className="collapse navbar-collapse">
           <ul className="nav navbar-nav">
-            <li>
-              <Link to="/countries">Countries</Link>
-            </li>
-            <li>
-              <Link to="/continents">Continents</Link>
-            </li>
-            <li>
-              <Link to="/contact">Contact</Link>
-            </li>
+            {linksArr.map(item => (
+              <li key={item.name}>
+                <Link to={item.url}>{item.name}</Link>
+              </li>
+            ))}
           </ul>
         </div>
       </div>