Fix tech labels on projects duplicate bug, add Kanye Quest

Author: alexieyizhe

.gitignore

@@ -9,8 +9,7 @@ yarn-error.log
 .DS_Store
 
 # Design mockups of new website, old ideas
-/unneeded
+/mocks
 
 # Prevent iCloud Drive from syncing folder
 .nosync
-

.travis.yml

@@ -14,7 +14,7 @@ before_install:
 
 script:
     - npm run test
-    - npm run prettier
+    - npm run prettier:check
 
 after_success:
   - chmod +x ./scripts/publish_on_netlify.sh

package.json

@@ -18,7 +18,8 @@
     "test:nocov": "jest",
     "test:nocoveralls": "jest --coverage",
     "test:watch": "jest --watch",
-    "prettier": "prettier --single-quote --list-different \"src/**/*.jsx\" \"test/*.test.js\" \"test/*.test.jsx\""
+    "prettier": "npx prettier --single-quote es5 --write './src/**/*.jsx' './test/*.test.js' './test/*.test.jsx'",
+    "prettier:check": "prettier --single-quote --list-different 'src/**/*.jsx' 'test/*.test.js' 'test/*.test.jsx'"
   },
   "dependencies": {
     "babel-plugin-styled-components": "^1.5.1",

src/components/ProjectShowcase.jsx

@@ -201,10 +201,13 @@ class ProjectShowcase extends React.Component {
                   focused={this.state.focused}
                   color={tech.color}
                   data-tip={tech.name}
-                  data-for={`techStackTip${i}`}
+                  data-for={`techStackTip${this.props.id}${i}`}
                 >
                   <span className={tech.icon} style={{ fontSize: '1.5em' }} />
-                  <ReactTooltip id={`techStackTip${i}`} effect="solid" />
+                  <ReactTooltip
+                    id={`techStackTip${this.props.id}${i}`}
+                    effect="solid"
+                  />
                 </ProjectStackItem>
               );
             })}
@@ -215,7 +218,7 @@ class ProjectShowcase extends React.Component {
                 <ProjectLink
                   key={i}
                   data-tip={link.name}
-                  data-for={`actionLinkTip${i}`}
+                  data-for={`actionLinkTip${this.props.id}${i}`}
                 >
                   <a href={link.url} target="_blank">
                     <SVGDrawIcon
@@ -225,7 +228,10 @@ class ProjectShowcase extends React.Component {
                       <Icon name={link.icon} size="1.5em" color="#595959" />
                     </SVGDrawIcon>
                   </a>
-                  <ReactTooltip id={`actionLinkTip${i}`} effect="solid" />
+                  <ReactTooltip
+                    id={`actionLinkTip${this.props.id}${i}`}
+                    effect="solid"
+                  />
                 </ProjectLink>
               );
             })}

src/data/projectData.js

@@ -13,7 +13,7 @@ export const projectsList = [
       {name: 'CSS Grid', icon: 'devicons devicons-css3', color: '#4173D5' },
     ],
     actionLinks: [
-      {name: "Web Demo", icon: "monitor", url: "https://alexieyizhe.me"},
+      {name: "View on Web", icon: "monitor", url: "https://alexieyizhe.me"},
       {name: "View on Github", icon: "github", url: "https://github.com/alexieyizhe/alexieyizhe.github.io"},
     ]
   },
@@ -67,8 +67,21 @@ export const projectsList = [
       {name: 'Heroku', icon: 'devicons devicons-heroku', color: '#9943A7' },
     ],
     actionLinks: [
-      {name: "FB Messenger Demo", icon: "messageSquare", url: "https://m.me/553923414986147"},
+      {name: "View on Facebook Messenger", icon: "messageSquare", url: "https://m.me/553923414986147"},
       {name: "View on Github", icon: "github", url: "https://github.com/alexieyizhe/wat-bus"},
     ]
   },
+  {
+    name: 'Kanye Quest',
+    desc: 'Kanye West goes on a Kanye Quest to be the Kanye Best and clean up this Kanye Mess.',
+    color: '#E4BB0D',
+    imgSource: '/img/projects/kanyequest.png',
+    techStack: [
+      {name: 'Java', icon: 'devicons devicons-java', color: '#E09C03' },
+      {name: 'Graphics2d Library', icon: 'devicons devicons-codepen', color: '#323232' },
+    ],
+    actionLinks: [
+      {name: "View on Github", icon: "github", url: "https://github.com/alexieyizhe/HS_PROJECTS/tree/master/kanye-quest"},
+    ]
+  }
 ]

src/pages/projects.jsx

@@ -39,7 +39,7 @@ class ProjectsPage extends React.Component {
           style={this.props.transition && this.props.transition.style}
         >
           {projectsList.map((project, i) => (
-            <ProjectShowcase key={i} project={project} />
+            <ProjectShowcase key={i} id={i} project={project} />
           ))}
         </ProjectGrid>
       </TemplateWrapper>