From 5f4097954895f53f9c91119f5fe5883ea5fedf27 Mon Sep 17 00:00:00 2001
From: Mohamed El Mahallawy <mmahalwy@gmail.com>
Date: Wed, 4 May 2016 21:30:55 -0700
Subject: [PATCH] HOTFIX reading mode markers

---
 src/components/Line/index.js | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/components/Line/index.js b/src/components/Line/index.js
index 17d66600d..63a223b8e 100644
--- a/src/components/Line/index.js
+++ b/src/components/Line/index.js
@@ -8,10 +8,6 @@ export default class Line extends React.Component {
     line: React.PropTypes.array.isRequired
   };
 
-  // shouldComponentUpdate(nextProps) {
-  //   return this.props.line.length !== nextProps.line.length;
-  // }
-
   renderText() {
     const { line } = this.props;
 
@@ -25,7 +21,7 @@ export default class Line extends React.Component {
 
         return (
           <b
-            key={`${index}`}
+            key={`${word.pageNum}${word.lineNum}${word.position}${word.code}`}
             className={`${word.className} pointer`}
             data-toggle="tooltip"
             data-ayah={word.ayahKey}
@@ -41,7 +37,7 @@ export default class Line extends React.Component {
       return (
         <b
           className={`${word.className} pointer`}
-          key={`${word.pageNum}${word.lineNum}${word.position}`}
+          key={`${word.pageNum}${word.lineNum}${word.position}${word.code}`}
           data-line={word.lineNum}
           data-page={word.pageNum}
           dangerouslySetInnerHTML={{__html: word.code}}>