From 4f984ce593e5b524f7df50c95f891796de23ef8c Mon Sep 17 00:00:00 2001
From: aneurysmjs <aneurysmjs@outlook.com>
Date: Tue, 9 Jan 2018 23:11:13 -0500
Subject: [PATCH] feat(RmNav): set 'links' class property

iterate over the links array and set each NavLink
---
 package.json                   |  3 ++-
 src/containers/RmNav/RmNav.jsx | 41 +++++++++++++++++++++-------------
 yarn.lock                      |  2 +-
 3 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/package.json b/package.json
index 0c2b7ce4..835de2d0 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
   "devDependencies": {
     "add-asset-html-webpack-plugin": "2.1.1",
     "babel-core": "6.26.0",
-    "babel-eslint": "^8.2.1",
+    "babel-eslint": "8.2.1",
     "babel-loader": "7.1.2",
     "babel-plugin-transform-async-to-generator": "6.24.1",
     "babel-plugin-transform-class-properties": "6.24.1",
@@ -108,6 +108,7 @@
     "font-awesome": "4.7.0",
     "global": "4.3.2",
     "lodash.throttle": "4.1.1",
+    "node-uuid": "1.4.8",
     "react": "16.2.0",
     "react-dom": "16.2.0",
     "react-medium-editor": "1.8.1",
diff --git a/src/containers/RmNav/RmNav.jsx b/src/containers/RmNav/RmNav.jsx
index dcd24842..b6fea57a 100755
--- a/src/containers/RmNav/RmNav.jsx
+++ b/src/containers/RmNav/RmNav.jsx
@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import { NavLink } from 'react-router-dom';
 import { func, string, bool } from 'prop-types';
 import { connect } from 'react-redux';
+import { v4 } from 'node-uuid';
 
 import RmSearcher from '../../components/RmSearcher/RmSearcher';
 
@@ -17,6 +18,19 @@ class RmNav extends Component {
     this.setState({searchTerm});
   };
 
+  links = [
+    {
+      id: v4(),
+      path: 'home',
+      name: 'Home'
+    },
+    {
+      id: v4(),
+      path: 'movies',
+      name: 'Movies'
+    }
+  ];
+
   render() {
 
     const {
@@ -54,22 +68,17 @@ class RmNav extends Component {
           </button>
           <div className="collapse navbar-collapse">
             <ul className="navbar-nav mr-auto">
-              <li className="nav-item">
-                <NavLink
-                  to="/"
-                  activeClassName="active"
-                  className="nav-link">
-                  Home
-                </NavLink>
-              </li>
-              <li className="nav-item">
-                <NavLink
-                  to="/movies"
-                  activeClassName="active"
-                  className="nav-link">
-                  Movies
-                </NavLink>
-              </li>
+              {this.links.map(({ path, name, id}) => (
+                <li key={id} className="nav-item">
+                  <NavLink
+                    to={`/${path}`}
+                    key={id}
+                    activeClassName="active"
+                    className="nav-link">
+                    {name}
+                  </NavLink>
+                </li>
+              ))}
             </ul>
             <div className="form-inline">
               {space}
diff --git a/yarn.lock b/yarn.lock
index 9b7445a0..c14642f3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5897,7 +5897,7 @@ node-sass@4.5.3:
     sass-graph "^2.1.1"
     stdout-stream "^1.4.0"
 
-node-uuid@~1.4.7:
+node-uuid@^1.4.8, node-uuid@~1.4.7:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/node-uuid/-/node-uuid-1.4.8.tgz#b040eb0923968afabf8d32fb1f17f1167fdab907"