use singular modular component for lesson and course navigation

Author: emily-yang

src/components/index.js

@@ -10,7 +10,7 @@ export { default as CourseInfo } from './course/CourseInfo';
 // ========================================
 // lesson
 export { default as LessonInfo } from './lesson/LessonInfo';
-export { default as LessonNav } from './lesson/LessonNav';
+export { default as LessonNavBar } from './lesson/LessonNavBar';
 export { default as LessonVideo } from './lesson/LessonVideo';
 export { default as LessonLink } from './lesson/LessonLink';
 export { default as LessonsPane } from './lesson/LessonsPane';

src/components/lesson/LessonInfo.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { LessonNav } from '..';
+import { LessonNavBar } from '..';
 import PropTypes from 'prop-types';
 import '../../css/lesson/LessonInfo.scss';
 
@@ -11,7 +11,7 @@ const LessonInfo = ({ lesson, base_path, course_size }) => {
   const nextPath = order < course_size - 1 ? `/courses/${base_path}/${order + 1}` : undefined;
   return (
     <div className="lesson-info">
-      <LessonNav order={order} base_path={base_path} course_size={course_size} prev_path={prevPath} next_path={nextPath} />
+      <LessonNavBar order={order} base_path={base_path} course_size={course_size} prev_path={prevPath} next_path={nextPath} />
       <h4 id="lesson-playing">Now playing:</h4>
       <h2>{title || 'Lesson'}</h2>
       <hr />

src/components/lesson/LessonNav.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 import PropTypes from 'prop-types';
-import '../../css/lesson/LessonNav.scss';
+import '../../css/lesson/LessonNavBar.scss';
 
-const CourseNav = ({prev_path, next_path}) => (
+const LessonNavBar = ({prev_path, next_path}) => (
   <div className="lesson-nav">
     { prev_path
       ? <button type="button" className='btn prev-btn'>
@@ -18,9 +18,9 @@ const CourseNav = ({prev_path, next_path}) => (
   </div>
 );
 
-CourseNav.propTypes = {
+LessonNavBar.propTypes = {
   prev_path: PropTypes.string.isRequired,
   next_path: PropTypes.string.isRequired,
 };
 
-export default CourseNav;
+export default LessonNavBar;

src/components/lesson/CourseNav.js renamed to src/components/lesson/LessonNavBar.js

@@ -2,12 +2,12 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { LessonLink } from '..';
 import '../../css/lesson/LessonsPane.scss';
-import LessonNav from './CourseNav';
+import LessonNavBar from './LessonNavBar';
 
 // TODO: add next and previous course buttons
 const LessonsPane = ({ course_title, lessons, curr_lesson_num, base_path, prev_slug, next_slug }) => (
   <div className="lessons-pane">
-    <LessonNav prev_path={prev_slug ? `/courses/${prev_slug}/0`: undefined} next_path={next_slug ? `/courses/${next_slug}/0` : undefined} />
+    <LessonNavBar prev_path={prev_slug ? `/courses/${prev_slug}/0`: undefined} next_path={next_slug ? `/courses/${next_slug}/0` : undefined} />
     <h2>{course_title}</h2>
     {lessons.map(({ order, title, length }) => (
       <LessonLink