Merge pull request #93 from kremalicious/fix/duplication

fix some code duplication

src/components/molecules/ProjectLinks.jsx

@@ -13,36 +13,25 @@ import icons from '../atoms/Icons.module.scss'
 import styles from './ProjectLinks.module.scss'
 
 const LinkIcon = ({ title, type, ...props }) => {
-  if (type) {
-    switch (type) {
-      case 'website':
-        return <Link {...props} />
-      case 'github':
-        return <GitHub {...props} />
-      case 'dribbble':
-        return <Dribbble {...props} />
-      case 'info':
-        return <Info {...props} />
-      case 'download':
-        return <Download {...props} />
-      case 'styleguide':
-        return <Styleguide {...props} />
-      default:
-        return null
-    }
-  }
+  let typeOrTitle = type ? type : title
 
-  switch (title) {
+  switch (typeOrTitle) {
+    case 'website':
     case 'Link':
       return <Link {...props} />
+    case 'github':
     case 'GitHub':
       return <GitHub {...props} />
+    case 'dribbble':
     case 'Dribbble':
       return <Dribbble {...props} />
+    case 'info':
     case 'Info':
       return <Info {...props} />
+    case 'download':
     case 'Download':
       return <Download {...props} />
+    case 'styleguide':
     case 'Styleguide':
       return <Styleguide {...props} />
     default:

src/components/molecules/ProjectNav.jsx

@@ -41,6 +41,10 @@ class ProjectLink extends PureComponent {
   }
 }
 
+ProjectLink.propTypes = {
+  node: PropTypes.object
+}
+
 export default class ProjectNav extends PureComponent {
   state = {
     scrolledToCurrent: false
@@ -68,6 +72,20 @@ export default class ProjectNav extends PureComponent {
     this.scrollContainer.scrollLeft += finalPosition
   }
 
+  Project({ node, slug }) {
+    const current = node.slug === slug
+
+    return (
+      <div
+        className={styles.item}
+        key={node.slug}
+        ref={node => current && (this.currentItem = node)}
+      >
+        <ProjectLink node={node} />
+      </div>
+    )
+  }
+
   render() {
     const { slug } = this.props
 
@@ -82,19 +100,9 @@ export default class ProjectNav extends PureComponent {
               className={styles.projectNav}
               ref={node => (this.scrollContainer = node)}
             >
-              {projects.map(({ node }) => {
-                const current = node.slug === slug
-
-                return (
-                  <div
-                    className={styles.item}
-                    key={node.slug}
-                    ref={node => current && (this.currentItem = node)}
-                  >
-                    <ProjectLink node={node} />
-                  </div>
-                )
-              })}
+              {projects.map(({ node }) => (
+                <this.Project key={node.id} node={node} slug={slug} />
+              ))}
             </nav>
           )
         }}
@@ -103,10 +111,6 @@ export default class ProjectNav extends PureComponent {
   }
 }
 
-ProjectLink.propTypes = {
-  node: PropTypes.object
-}
-
 ProjectNav.propTypes = {
   slug: PropTypes.string
 }