Fix non existant ayat (#708)

* fix page when ayat not found * refactor previous commit * add translation for ‘chapter.index.ayatNotFound’ * fix typo * refactor verses checker * change key in translation * update ar translation
quran · Mar 28, 2017 · 66b8a2e · 66b8a2e
1 parent c93c9a5
commit 66b8a2e
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 14 deletions.
diff --git a/src/containers/Surah/index.js b/src/containers/Surah/index.js
@@ -225,6 +225,17 @@ class Surah extends Component {
     return `${chapter.info ? chapter.info.shortDescription : ''} This Surah has ${chapter.versesCount} verses and resides between pages ${chapter.pages[0]} to ${chapter.pages[1]} in the Quran.`; // eslint-disable-line max-len
   }
 
+  renderNoAyah() {
+    const { isLoading } = this.props;
+
+    const noAyah = (<div className="text-center">
+      <h2><LocaleFormattedMessage id="ayah.notFound" defaultMessage="Ayah not found." /></h2>
+    </div>
+    );
+
+    return isLoading ? <Loader isActive style={LoaderStyle} /> : noAyah;
+  }
+
   renderPagination() {
     const { isSingleAyah, isLoading, isEndOfSurah, chapter } = this.props;
 
@@ -341,7 +352,7 @@ class Surah extends Component {
     const { chapter, options, actions } = this.props; // eslint-disable-line no-shadow
     debug('component:Surah', 'Render');
 
-    if (!this.hasAyahs()) return <div className={style.container} style={{ margin: '50px auto' }}><Loader isActive style={LoaderStyle} /></div>;
+    if (!this.hasAyahs()) return <div className={style.container} style={{ margin: '50px auto' }}>{this.renderNoAyah()}</div>;
 
     return (
       <div className="chapter-body">

diff --git a/src/helpers/buildSegments.js b/src/helpers/buildSegments.js
@@ -24,13 +24,15 @@ export const buildSegments = (segments) => {
 export const extractSegments = (verses) => {
   const segments = {};
 
-  Object.values(verses).forEach((verse) => {
-    if (verse.audio) {
-      if (verse.audio.segments) {
-        segments[verse.verseKey] = buildSegments(verse.audio.segments);
+  if (verses) {
+    Object.values(verses).forEach((verse) => {
+      if (verse.audio) {
+        if (verse.audio.segments) {
+          segments[verse.verseKey] = buildSegments(verse.audio.segments);
+        }
       }
-    }
-  });
+    });
+  }
 
   return segments;
 };
diff --git a/src/locale/ar.js b/src/locale/ar.js
@@ -76,6 +76,8 @@ export default {
     'nav.navigate': 'انتقل',
     'nav.legacySite': 'الموقع القديم',
 
-    'login.message': 'تسجيل الدخول إلى Quran.com لتخزين كل ما تبذلونه من العناوين والملاحظات والأنشطة.'
+    'login.message': 'تسجيل الدخول إلى Quran.com لتخزين كل ما تبذلونه من العناوين والملاحظات والأنشطة.',
+
+    'ayah.notFound': 'لم يتم العثور على الآية'
   }
 };
diff --git a/src/locale/en.js b/src/locale/en.js
@@ -28,6 +28,7 @@ export default {
     'ayah.media.lectureFrom': 'Watch video commentary from {from}',
     'ayah.bookmarked': 'Bookmarked',
     'ayah.bookmark': 'Bookmark',
+    'ayah.notFound': 'Ayah not found',
 
     'search.placeholder': 'Search "Noah"',
     'search.resultHeading': '{from}-{to} OF <span> {total} </span> SEARCH RESULTS FOR: <span>{query}</span>', // eslint-disable-line max-len

diff --git a/src/locale/fr.js b/src/locale/fr.js
@@ -28,6 +28,7 @@ export default {
     'ayah.media.lectureFrom': 'Regarder les commentaires de la vidéo depuis {from}',
     'ayah.bookmarked': 'Favoris ajouté',
     'ayah.bookmark': 'Favoris',
+    'ayah.notFound': 'Verset introuvable',
 
     'search.placeholder': 'Chercher "Noah"',
     'search.resultHeading': '{from}-{to} DE <span> {total} </span> RESULTATS DE LA RECHERCHE POUR : <span>{query}</span>', // eslint-disable-line max-len

diff --git a/src/locale/id.js b/src/locale/id.js
@@ -28,6 +28,7 @@ export default {
     'ayah.media.lectureFrom': 'Lihat kuliah dari {from}',
     'ayah.bookmarked': 'Ditandai',
     'ayah.bookmark': 'Tandai',
+    'ayah.notFound': 'Ayat tidak ditemukan',
 
     'search.placeholder': 'Cari "Nuh"',
     'search.resultHeading': '{from}-{to} DARI <span> {total} </span> HASIL PENCARIAN ATAS: <span>{query}</span>', // eslint-disable-line max-len

diff --git a/src/locale/tr.js b/src/locale/tr.js
@@ -28,6 +28,7 @@ export default {
     'ayah.media.lectureFrom': 'Video anlatımı izle {from}',
     'ayah.bookmarked': 'Yer işareti eklendi',
     'ayah.bookmark': 'Yer işareti',
+    'ayah.notFound': 'Ayet bulunamadı',
 
     'search.placeholder': 'Arama yap "Nuh"',
     'search.resultHeading': '{from}-{to} / <span> {total} </span> ARAMA SONUÇLARI: <span>{query}</span>', // eslint-disable-line max-len

diff --git a/src/locale/ur.js b/src/locale/ur.js
@@ -28,6 +28,7 @@ export default {
     'ayah.media.lectureFrom': 'کے لیکچر دیکھے  {from}',
     'ayah.bookmarked': 'حوالہ ہے',
     'ayah.bookmark': 'حوالہ',
+    'ayah.notFound': 'آیت نہیں ملا',
 
     'search.placeholder': 'تلاش کر یں',
     'search.resultHeading': '{from}-{to} OF <span> {total} </span> SEARCH RESULTS FOR: <span>{query}</span>', // eslint-disable-line max-len

diff --git a/src/redux/modules/fontFaces.js b/src/redux/modules/fontFaces.js
@@ -9,13 +9,15 @@ export default function reducer(state = {}, action = {}) {
       const verses = action.result.entities.verses;
       const classNames = {};
 
-      Object.keys(verses).forEach((ayahId) => {
-        const verse = verses[ayahId];
+      if (verses) {
+        Object.keys(verses).forEach((ayahId) => {
+          const verse = verses[ayahId];
 
-        if (!state[`p${verse.pageNumber}`]) {
-          classNames[`p${verse.pageNumber}`] = false;
-        }
-      });
+          if (!state[`p${verse.pageNumber}`]) {
+            classNames[`p${verse.pageNumber}`] = false;
+          }
+        });
+      }
 
       return {
         ...state,