From 002845b0e6218ce5864088c5239909784ef7f41f Mon Sep 17 00:00:00 2001
From: Mohamed El Mahallawy <mmahalwy@gmail.com>
Date: Thu, 2 Mar 2017 19:06:34 -0800
Subject: [PATCH] V3 API (#633)

* changes

* work homepage

* fix surah

* Fix linting

* chapter for repeat dropdown
---
 .../Audioplayer/RepeatDropdown/index.js       |  18 +-
 .../Audioplayer/RepeatDropdown/spec.js        |   4 +-
 src/components/Audioplayer/Segments/index.js  |   8 +-
 src/components/Audioplayer/Segments/spec.js   |   4 +-
 src/components/Audioplayer/index.js           | 100 ++++-----
 src/components/Audioplayer/spec.js            |   4 +-
 src/components/Bismillah/index.js             |   6 +-
 src/components/ContentDropdown/index.js       |  84 --------
 src/components/GlobalNav/Surah/index.js       |  16 +-
 src/components/GlobalSidebar/Surah/index.js   |  20 +-
 src/components/Home/LastVisit/index.js        |  12 +-
 src/components/Home/SurahsList/index.js       |  16 +-
 src/components/Line/index.js                  |  14 +-
 src/components/SearchAutocomplete/index.js    |  40 ++--
 src/components/SettingsModal/index.js         |  10 +-
 src/components/Share/index.js                 |  12 +-
 src/components/SurahInfo/index.js             |  18 +-
 src/components/SurahsDropdown/index.js        |  30 +--
 src/components/TopOptions/index.js            |   8 +-
 src/components/TopOptions/spec.js             |   2 +-
 src/components/{Ayah => Verse}/index.js       |  86 ++++----
 src/components/{Ayah => Verse}/spec.js        |   2 +-
 src/components/{Ayah => Verse}/style.scss     |   0
 src/components/VersesDropdown/index.js        |   6 +-
 src/components/Word/index.js                  |  32 +--
 src/containers/Home/index.js                  |  16 +-
 src/containers/Profile/index.js               |   4 +-
 src/containers/Search/index.js                |  16 +-
 src/containers/Surah/Header/index.js          |  85 --------
 src/containers/Surah/Header/style.scss        |  15 --
 src/containers/Surah/Title/index.js           |  10 +-
 src/containers/Surah/Title/spec.js            |  16 +-
 src/containers/Surah/connect.js               |  36 ++--
 src/containers/Surah/index.js                 | 202 +++++++++---------
 src/helpers/buildFontFaces.js                 |   4 +-
 src/helpers/buildSegments.js                  |  10 +-
 src/helpers/index.js                          |   8 +-
 src/locale/ar.js                              |   4 +-
 src/locale/en.js                              |   4 +-
 src/locale/id.js                              |   4 +-
 src/locale/ur.js                              |   4 +-
 src/redux/actions/audioplayer.js              |  16 +-
 src/redux/actions/bookmarks.js                |  12 +-
 src/redux/actions/{surahs.js => chapters.js}  |  18 +-
 src/redux/actions/search.js                   |   6 +-
 src/redux/actions/spec.js                     |   8 +-
 src/redux/actions/{ayahs.js => verses.js}     |  22 +-
 src/redux/constants/ayahs.js                  |   7 -
 .../constants/{surahs.js => chapters.js}      |   0
 src/redux/constants/verses.js                 |   7 +
 src/redux/modules/audioplayer.js              | 110 +++++-----
 src/redux/modules/bookmarks.js                |   4 +-
 src/redux/modules/{surahs.js => chapters.js}  |   8 +-
 src/redux/modules/fontFaces.js                |  12 +-
 src/redux/modules/lines.js                    |  12 +-
 src/redux/modules/reducer.js                  |   8 +-
 src/redux/modules/searchResults.js            |   2 +-
 src/redux/modules/{ayahs.js => verses.js}     |  24 +--
 src/redux/schemas.js                          |  10 +-
 src/routes.js                                 |   4 +-
 src/server/config/sitemap.js                  |  12 +-
 src/styles/nightmode.scss                     |   2 +-
 src/types/ayahType.js                         |  19 --
 src/types/bookmarkType.js                     |   2 +-
 src/types/index.js                            |   2 +-
 src/types/surahType.js                        |  20 +-
 src/types/verseType.js                        |  19 ++
 src/types/wordType.js                         |  20 +-
 src/utils/checkValidSurah.js                  |   9 +-
 tests/fixtures/ayah.json                      |  12 +-
 tests/functional/pageobjects/HomePage.js      |   4 +-
 71 files changed, 608 insertions(+), 793 deletions(-)
 rename src/components/{Ayah => Verse}/index.js (73%)
 rename src/components/{Ayah => Verse}/spec.js (90%)
 rename src/components/{Ayah => Verse}/style.scss (100%)
 delete mode 100644 src/containers/Surah/Header/index.js
 delete mode 100644 src/containers/Surah/Header/style.scss
 rename src/redux/actions/{surahs.js => chapters.js} (53%)
 rename src/redux/actions/{ayahs.js => verses.js} (63%)
 delete mode 100644 src/redux/constants/ayahs.js
 rename src/redux/constants/{surahs.js => chapters.js} (100%)
 create mode 100644 src/redux/constants/verses.js
 rename src/redux/modules/{surahs.js => chapters.js} (86%)
 rename src/redux/modules/{ayahs.js => verses.js} (77%)
 delete mode 100644 src/types/ayahType.js
 create mode 100644 src/types/verseType.js

diff --git a/src/components/Audioplayer/RepeatDropdown/index.js b/src/components/Audioplayer/RepeatDropdown/index.js
index b5ff5d1db..e3e2f5227 100644
--- a/src/components/Audioplayer/RepeatDropdown/index.js
+++ b/src/components/Audioplayer/RepeatDropdown/index.js
@@ -15,7 +15,7 @@ const style = require('../style.scss');
 
 class RepeatButton extends Component {
   static propTypes = {
-    surah: surahType,
+    chapter: surahType,
     repeat: PropTypes.shape({
       from: PropTypes.number,
       to: PropTypes.number,
@@ -57,8 +57,8 @@ class RepeatButton extends Component {
   }
 
   renderRangeAyahs() {
-    const { surah, repeat, setRepeat } = this.props;
-    const array = Array(surah.ayat).join().split(',');
+    const { chapter, repeat, setRepeat } = this.props;
+    const array = Array(chapter.versesCount).join().split(',');
 
     return (
       <div className="col-md-12" style={{ paddingTop: 15 }}>
@@ -74,7 +74,7 @@ class RepeatButton extends Component {
               value={repeat.from}
               onChange={(event) => {
                 let to = parseInt(event.target.value, 10) + 3;
-                to = to < surah.ayat ? to : surah.ayat;
+                to = to < chapter.ayat ? to : chapter.ayat;
                 setRepeat({
                   ...repeat,
                   from: parseInt(event.target.value, 10),
@@ -84,7 +84,7 @@ class RepeatButton extends Component {
             >
               {
                 array.reduce((options, ayah, index) => {
-                  if (index + 1 < surah.ayat) { // Exclude last verse
+                  if (index + 1 < chapter.ayat) { // Exclude last verse
                     options.push(
                       <option key={index} value={index + 1}>
                         {index + 1}
@@ -110,7 +110,7 @@ class RepeatButton extends Component {
             >
               {
                 array.reduce((options, ayah, index) => {
-                  if ((repeat.from ? repeat.from : 1) < index + 1 && index + 1 <= surah.ayat) {
+                  if ((repeat.from ? repeat.from : 1) < index + 1 && index + 1 <= chapter.ayat) {
                     options.push(
                       <option key={index} value={index + 1}>
                         {index + 1}
@@ -128,13 +128,13 @@ class RepeatButton extends Component {
   }
 
   renderSingleAyah() {
-    const { repeat, setRepeat, surah } = this.props;
-    const array = Array(surah.ayat).join().split(',');
+    const { repeat, setRepeat, chapter } = this.props;
+    const array = Array(chapter.versesCount).join().split(',');
 
     return (
       <div className="col-md-12" style={{ paddingTop: 15 }}>
         <LocaleFormattedMessage
-          id="player.currentAyah"
+          id="player.currentVerse"
           defaultMessage="Ayah"
         />{' '}: <br />
         <FormControl
diff --git a/src/components/Audioplayer/RepeatDropdown/spec.js b/src/components/Audioplayer/RepeatDropdown/spec.js
index 7d89fb2ed..578bed164 100644
--- a/src/components/Audioplayer/RepeatDropdown/spec.js
+++ b/src/components/Audioplayer/RepeatDropdown/spec.js
@@ -6,7 +6,7 @@ import RepeatDropdown from './index';
 let component;
 let overlay;
 let setRepeat;
-const surah = {
+const chapter = {
   ayat: 10
 };
 
@@ -18,7 +18,7 @@ const makeComponent = (repeat) => {
       repeat={repeat}
       setRepeat={setRepeat}
       current={1}
-      surah={surah}
+      chapter={chapter}
     />
   );
 
diff --git a/src/components/Audioplayer/Segments/index.js b/src/components/Audioplayer/Segments/index.js
index f32ed272b..91ae279db 100644
--- a/src/components/Audioplayer/Segments/index.js
+++ b/src/components/Audioplayer/Segments/index.js
@@ -7,19 +7,19 @@ import debug from 'helpers/debug';
 export default class Segments extends Component {
   static propTypes = {
     segments: PropTypes.objectOf(segmentType).isRequired,
-    currentAyah: PropTypes.string,
+    currentVerse: PropTypes.string,
     currentTime: PropTypes.number
   };
 
   shouldComponentUpdate(nextProps) {
     return [
-      this.props.currentAyah !== nextProps.currentAyah,
+      this.props.currentVerse !== nextProps.currentVerse,
       this.props.currentTime !== nextProps.currentTime,
     ].some(test => test);
   }
 
   render() {
-    const { segments, currentAyah, currentTime } = this.props;
+    const { segments, currentVerse, currentTime } = this.props;
     const style = [];
     let currentWord = null;
 
@@ -29,7 +29,7 @@ export default class Segments extends Component {
       const word = segments.words[wordIndex];
 
       if (currentTime >= word.startTime && currentTime < word.endTime) {
-        currentWord = `${currentAyah}:${wordIndex}`;
+        currentWord = `${currentVerse}:${wordIndex}`;
       }
     });
 
diff --git a/src/components/Audioplayer/Segments/spec.js b/src/components/Audioplayer/Segments/spec.js
index be3b3fd5e..6dfca9a12 100644
--- a/src/components/Audioplayer/Segments/spec.js
+++ b/src/components/Audioplayer/Segments/spec.js
@@ -29,7 +29,7 @@ describe('<Segments />', () => {
         <Segments
           segments={{ words: { 0: { startTime: 0, endTime: 1 }, 1: { startTime: 1, endTime: 2 } } }}
           currentTime={1.5}
-          currentAyah="1:1"
+          currentVerse="1:1"
         />
       );
     });
@@ -64,7 +64,7 @@ describe('<Segments />', () => {
             }
           }}
           currentTime={1.5}
-          currentAyah="1:1"
+          currentVerse="1:1"
         />
       );
     });
diff --git a/src/components/Audioplayer/index.js b/src/components/Audioplayer/index.js
index 7f5f6354f..94b018241 100644
--- a/src/components/Audioplayer/index.js
+++ b/src/components/Audioplayer/index.js
@@ -25,12 +25,12 @@ const style = require('./style.scss');
 export class Audioplayer extends Component {
   static propTypes = {
     className: PropTypes.string,
-    surah: surahType,
+    chapter: surahType,
     onLoadAyahs: PropTypes.func.isRequired,
     segments: PropTypes.objectOf(segmentType),
     // NOTE: should be PropTypes.instanceOf(Audio) but not on server.
     files: PropTypes.object, // eslint-disable-line
-    currentAyah: PropTypes.string,
+    currentVerse: PropTypes.string,
     buildOnClient: PropTypes.func.isRequired,
     isLoadedOnClient: PropTypes.bool.isRequired,
     isLoading: PropTypes.bool.isRequired,
@@ -56,14 +56,14 @@ export class Audioplayer extends Component {
   };
 
   componentDidMount() {
-    const { isLoadedOnClient, buildOnClient, surah, currentFile } = this.props; // eslint-disable-line no-shadow, max-len
+    const { isLoadedOnClient, buildOnClient, chapter, currentFile } = this.props; // eslint-disable-line no-shadow, max-len
 
     debug('component:Audioplayer', 'componentDidMount');
 
     if (!isLoadedOnClient && __CLIENT__) {
       debug('component:Audioplayer', 'componentDidMount on client');
 
-      return buildOnClient(surah.id);
+      return buildOnClient(chapter.chapterNumber);
     }
 
     if (currentFile) {
@@ -75,16 +75,16 @@ export class Audioplayer extends Component {
 
   componentWillReceiveProps(nextProps) {
     // Make sure we have a current ayah to mount it to Audio
-    if (!this.props.currentAyah && !nextProps.currentFile) {
+    if (!this.props.currentVerse && !nextProps.currentFile) {
       return false;
     }
 
-    // When you go directly to the surah page, /2, the files are not loaded yet
+    // When you go directly to the chapter page, /2, the files are not loaded yet
     if (this.props.isLoadedOnClient !== nextProps.isLoadedOnClient) {
       return this.handleAddFileListeners(nextProps.currentFile);
     }
 
-    if (this.props.currentAyah !== nextProps.currentAyah) {
+    if (this.props.currentVerse !== nextProps.currentVerse) {
       this.handleAddFileListeners(nextProps.currentFile);
 
       if (this.props.currentFile) {
@@ -109,21 +109,21 @@ export class Audioplayer extends Component {
   }
 
   getPrevious() {
-    const { currentAyah, files } = this.props;
+    const { currentVerse, files } = this.props;
     const ayahIds = Object.keys(files);
-    const index = ayahIds.findIndex(id => id === currentAyah);
+    const index = ayahIds.findIndex(id => id === currentVerse);
 
     return ayahIds[index - 1];
   }
 
   getNext() {
-    const { currentAyah, surah, files, onLoadAyahs } = this.props;
+    const { currentVerse, chapter, files, onLoadAyahs } = this.props;
     const ayahIds = Object.keys(files);
-    const ayahNum = currentAyah.split(':')[1];
-    const index = ayahIds.findIndex(id => id === currentAyah);
+    const ayahNum = currentVerse.split(':')[1];
+    const index = ayahIds.findIndex(id => id === currentVerse);
 
-    if (surah.ayat === ayahNum + 1) {
-      // We are at the end of the surah!
+    if (chapter.versesCount === ayahNum + 1) {
+      // We are at the end of the chapter!
       return false;
     }
 
@@ -136,16 +136,16 @@ export class Audioplayer extends Component {
   }
 
   handleAyahChange = (direction = 'next') => {
-    const { isPlaying, play, pause, currentAyah } = this.props; // eslint-disable-line no-shadow, max-len
+    const { isPlaying, play, pause, currentVerse } = this.props; // eslint-disable-line no-shadow, max-len
     const previouslyPlaying = isPlaying;
 
     if (isPlaying) pause();
 
     if (!this[camelize(`get_${direction}`)]()) return pause();
 
-    this.props[direction](currentAyah);
+    this.props[direction](currentVerse);
 
-    this.handleScrollTo(currentAyah);
+    this.handleScrollTo(currentVerse);
 
     this.preloadNext();
 
@@ -154,7 +154,7 @@ export class Audioplayer extends Component {
     return false;
   }
 
-  handleScrollTo = (ayahNum = this.props.currentAyah) => {
+  handleScrollTo = (ayahNum = this.props.currentVerse) => {
     const { shouldScroll } = this.props;
 
     if (shouldScroll) {
@@ -170,16 +170,16 @@ export class Audioplayer extends Component {
   }
 
   preloadNext() {
-    const { currentAyah, files } = this.props;
+    const { currentVerse, files } = this.props;
     const ayahIds = Object.keys(files);
-    const index = ayahIds.findIndex(id => id === currentAyah) + 1;
+    const index = ayahIds.findIndex(id => id === currentVerse) + 1;
 
     for (let id = index; id <= index + 2; id += 1) {
       if (ayahIds[id]) {
-        const ayahKey = ayahIds[id];
+        const verseKey = ayahIds[id];
 
-        if (files[ayahKey]) {
-          files[ayahKey].setAttribute('preload', 'auto');
+        if (files[verseKey]) {
+          files[verseKey].setAttribute('preload', 'auto');
         }
       }
     }
@@ -188,11 +188,11 @@ export class Audioplayer extends Component {
   handleRepeat = (file) => {
     const {
       repeat,
-      currentAyah,
+      currentVerse,
       setRepeat, // eslint-disable-line no-shadow
       setAyah // eslint-disable-line no-shadow
     } = this.props;
-    const [surah, ayah] = currentAyah.split(':').map(val => parseInt(val, 10));
+    const [chapter, ayah] = currentVerse.split(':').map(val => parseInt(val, 10));
 
     file.pause();
 
@@ -235,7 +235,7 @@ export class Audioplayer extends Component {
         }
 
         setRepeat({ ...repeat, times: repeat.times - 1 });
-        setAyah(`${surah}:${repeat.from}`);
+        setAyah(`${chapter}:${repeat.from}`);
 
         return this.play();
       }
@@ -247,14 +247,14 @@ export class Audioplayer extends Component {
   handleScrollToggle = (event) => {
     event.preventDefault();
 
-    const { shouldScroll, currentAyah } = this.props;
+    const { shouldScroll, currentVerse } = this.props;
 
     if (!shouldScroll) { // we use the inverse (!) here because we're toggling, so false is true
-      const elem = document.getElementsByName(`ayah:${currentAyah}`)[0];
+      const elem = document.getElementsByName(`ayah:${currentVerse}`)[0];
       if (elem && elem.getBoundingClientRect().top < 0) { // if the ayah is above our scroll offset
-        scroller.scrollTo(`ayah:${currentAyah}`, -150);
+        scroller.scrollTo(`ayah:${currentVerse}`, -150);
       } else {
-        scroller.scrollTo(`ayah:${currentAyah}`, -80);
+        scroller.scrollTo(`ayah:${currentVerse}`, -80);
       }
     }
 
@@ -353,9 +353,9 @@ export class Audioplayer extends Component {
   }
 
   renderPreviousButton() {
-    const { currentAyah, files } = this.props;
+    const { currentVerse, files } = this.props;
     if (!files) return false;
-    const index = Object.keys(files).findIndex(id => id === currentAyah);
+    const index = Object.keys(files).findIndex(id => id === currentVerse);
 
     return (
       <a
@@ -369,9 +369,9 @@ export class Audioplayer extends Component {
   }
 
   renderNextButton() {
-    const { surah, currentAyah } = this.props;
-    if (!surah) return false;
-    const isEnd = surah.ayat === parseInt(currentAyah.split(':')[1], 10);
+    const { chapter, currentVerse } = this.props;
+    if (!chapter) return false;
+    const isEnd = chapter.versesCount === parseInt(currentVerse.split(':')[1], 10);
 
     return (
       <a
@@ -391,10 +391,10 @@ export class Audioplayer extends Component {
       className,
       segments,
       isLoading,
-      currentAyah,
+      currentVerse,
       currentTime,
       duration,
-      surah,
+      chapter,
       isPlaying,
       isLoadedOnClient,
       repeat, // eslint-disable-line no-shadow
@@ -402,7 +402,7 @@ export class Audioplayer extends Component {
       setRepeat // eslint-disable-line no-shadow
     } = this.props;
 
-    if (isLoading || !currentAyah) {
+    if (isLoading || !currentVerse) {
       return (
         <li className={`${style.container} ${className}`}>
           <div>
@@ -426,11 +426,11 @@ export class Audioplayer extends Component {
           {
             isLoadedOnClient &&
             segments &&
-            segments[currentAyah] &&
-            segments[currentAyah] &&
+            segments[currentVerse] &&
+            segments[currentVerse] &&
               <Segments
-                segments={segments[currentAyah]}
-                currentAyah={currentAyah}
+                segments={segments[currentVerse]}
+                currentVerse={currentVerse}
                 currentTime={currentTime}
               />
           }
@@ -438,9 +438,9 @@ export class Audioplayer extends Component {
         <ul className={`list-inline ${style.controls}`}>
           <li className={style.controlItem}>
             <LocaleFormattedMessage
-              id="player.currentAyah"
+              id="player.currentVerse"
               defaultMessage="Ayah"
-            />: {currentAyah.split(':')[1]}
+            />: {currentVerse.split(':')[1]}
           </li>
           <li className={style.controlItem}>
             {this.renderPreviousButton()}
@@ -455,8 +455,8 @@ export class Audioplayer extends Component {
             <RepeatDropdown
               repeat={repeat}
               setRepeat={setRepeat}
-              current={parseInt(currentAyah.split(':')[1], 10)}
-              surah={surah}
+              current={parseInt(currentVerse.split(':')[1], 10)}
+              chapter={chapter}
             />
           </li>
           <li className={style.controlItem}>
@@ -469,11 +469,11 @@ export class Audioplayer extends Component {
 }
 
 const mapStateToProps = (state, ownProps) => ({
-  files: state.audioplayer.files[ownProps.surah.id],
-  segments: state.audioplayer.segments[ownProps.surah.id],
+  files: state.audioplayer.files[ownProps.chapter.chapterNumber],
+  segments: state.audioplayer.segments[ownProps.chapter.chapterNumber],
   currentFile: state.audioplayer.currentFile,
-  currentAyah: state.audioplayer.currentAyah,
-  surahId: state.audioplayer.surahId,
+  currentVerse: state.audioplayer.currentVerse,
+  chapterId: state.audioplayer.chapterId,
   isPlaying: state.audioplayer.isPlaying,
   isLoadedOnClient: state.audioplayer.isLoadedOnClient,
   isLoading: state.audioplayer.isLoading,
diff --git a/src/components/Audioplayer/spec.js b/src/components/Audioplayer/spec.js
index fff7dbe49..7eb52ba6d 100644
--- a/src/components/Audioplayer/spec.js
+++ b/src/components/Audioplayer/spec.js
@@ -27,7 +27,7 @@ describe('<Audioplayer />', () => {
               setRepeat={setRepeat}
               setAyah={setAyah}
               repeat={repeat}
-              currentAyah="2:3"
+              currentVerse="2:3"
             />
           );
 
@@ -91,7 +91,7 @@ describe('<Audioplayer />', () => {
               setRepeat={setRepeat}
               setAyah={setAyah}
               repeat={repeat}
-              currentAyah="2:3"
+              currentVerse="2:3"
             />
           );
 
diff --git a/src/components/Bismillah/index.js b/src/components/Bismillah/index.js
index 9520a8799..02735dc75 100644
--- a/src/components/Bismillah/index.js
+++ b/src/components/Bismillah/index.js
@@ -1,8 +1,8 @@
 import React from 'react';
 import { surahType } from 'types';
 
-const Bismillah = ({ surah }) => {
-  if (surah && surah.bismillahPre) {
+const Bismillah = ({ chapter }) => {
+  if (chapter && chapter.bismillahPre) {
     return (
       <div
         className="bismillah text-center word-font"
@@ -17,7 +17,7 @@ const Bismillah = ({ surah }) => {
 };
 
 Bismillah.propTypes = {
-  surah: surahType.isRequired
+  chapter: surahType.isRequired
 };
 
 export default Bismillah;
diff --git a/src/components/ContentDropdown/index.js b/src/components/ContentDropdown/index.js
index 62eb06fc9..01ea4f164 100644
--- a/src/components/ContentDropdown/index.js
+++ b/src/components/ContentDropdown/index.js
@@ -28,8 +28,6 @@ export const slugs = [
   {
     language: 'ar',
     name: 'ابن كثير',
-    description: null,
-    is_available: 1,
     cardinality: 'n_ayah',
     slug: 'resource_id_14',
     id: 13,
@@ -38,8 +36,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Dr. Ghali',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'dr_ghali',
     id: 16,
@@ -48,8 +44,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Muhsin Khan',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'muhsin_khan',
     id: 17,
@@ -58,8 +52,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Pickthall',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'pickthall',
     id: 18,
@@ -68,8 +60,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Sahih International',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'sahih_international',
     id: 19,
@@ -78,8 +68,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Shakir',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'shakir',
     id: 20,
@@ -88,8 +76,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Yusuf Ali',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'yusuf_ali',
     id: 21,
@@ -98,8 +84,6 @@ export const slugs = [
   {
     language: 'az',
     name: 'Azerbaijani',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'azerbaijani',
     id: 22,
@@ -108,8 +92,6 @@ export const slugs = [
   {
     language: 'bn',
     name: 'Bangla',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'bangla',
     id: 23,
@@ -118,8 +100,6 @@ export const slugs = [
   {
     language: 'bs',
     name: 'Bosnian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'bosnian',
     id: 24,
@@ -128,8 +108,6 @@ export const slugs = [
   {
     language: 'cs',
     name: 'Czech',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'czech',
     id: 25,
@@ -138,8 +116,6 @@ export const slugs = [
   {
     language: 'de',
     name: 'German',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'german',
     id: 26,
@@ -148,8 +124,6 @@ export const slugs = [
   {
     language: 'es',
     name: 'Spanish',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'spanish',
     id: 27,
@@ -158,8 +132,6 @@ export const slugs = [
   {
     language: 'fa',
     name: 'Farsi',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'farsi',
     id: 28,
@@ -168,8 +140,6 @@ export const slugs = [
   {
     language: 'fi',
     name: 'Finnish',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'finnish',
     id: 29,
@@ -178,8 +148,6 @@ export const slugs = [
   {
     language: 'fr',
     name: 'French',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'french',
     id: 30,
@@ -188,8 +156,6 @@ export const slugs = [
   {
     language: 'ha',
     name: 'Hausa',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'hausa',
     id: 31,
@@ -198,8 +164,6 @@ export const slugs = [
   {
     language: 'id',
     name: 'Indonesian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'indonesian',
     id: 32,
@@ -208,8 +172,6 @@ export const slugs = [
   {
     language: 'it',
     name: 'Italian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'italian',
     id: 33,
@@ -218,8 +180,6 @@ export const slugs = [
   {
     language: 'ja',
     name: 'Japanese',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'japanese',
     id: 34,
@@ -228,8 +188,6 @@ export const slugs = [
   {
     language: 'ko',
     name: 'Korean',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'korean',
     id: 35,
@@ -238,8 +196,6 @@ export const slugs = [
   {
     language: 'ml',
     name: 'Malayalam',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'malayalam',
     id: 36,
@@ -248,8 +204,6 @@ export const slugs = [
   {
     language: 'mrn',
     name: 'Maranao',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'maranao',
     id: 37,
@@ -258,8 +212,6 @@ export const slugs = [
   {
     language: 'ms',
     name: 'Malay',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'malay',
     id: 38,
@@ -268,8 +220,6 @@ export const slugs = [
   {
     language: 'nl',
     name: 'Dutch',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'dutch',
     id: 39,
@@ -278,8 +228,6 @@ export const slugs = [
   {
     language: 'no',
     name: 'Norwegian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'norwegian',
     id: 40,
@@ -288,8 +236,6 @@ export const slugs = [
   {
     language: 'pl',
     name: 'Polish',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'polish',
     id: 41,
@@ -298,8 +244,6 @@ export const slugs = [
   {
     language: 'pt',
     name: 'Portuguese',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'portuguese',
     id: 42,
@@ -308,8 +252,6 @@ export const slugs = [
   {
     language: 'ro',
     name: 'Romanian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'romanian',
     id: 43,
@@ -318,8 +260,6 @@ export const slugs = [
   {
     language: 'ru',
     name: 'Russian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'russian',
     id: 44,
@@ -328,8 +268,6 @@ export const slugs = [
   {
     language: 'so',
     name: 'Somali',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'somali',
     id: 45,
@@ -338,8 +276,6 @@ export const slugs = [
   {
     language: 'sq',
     name: 'Albanian',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'albanian',
     id: 46,
@@ -348,8 +284,6 @@ export const slugs = [
   {
     language: 'sv',
     name: 'Swedish',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'swedish',
     id: 47,
@@ -358,8 +292,6 @@ export const slugs = [
   {
     language: 'sw',
     name: 'Swahili',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'swahili',
     id: 48,
@@ -368,8 +300,6 @@ export const slugs = [
   {
     language: 'ta',
     name: 'Tamil',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'tamil',
     id: 49,
@@ -378,8 +308,6 @@ export const slugs = [
   {
     language: 'th',
     name: 'Thai',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'thai',
     id: 50,
@@ -388,8 +316,6 @@ export const slugs = [
   {
     language: 'tr',
     name: 'Turkish',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'turkish',
     id: 51,
@@ -398,8 +324,6 @@ export const slugs = [
   {
     language: 'tt',
     name: 'Tatar',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'tatar',
     id: 52,
@@ -408,8 +332,6 @@ export const slugs = [
   {
     language: 'ur',
     name: 'Urdu',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'urdu',
     id: 53,
@@ -418,8 +340,6 @@ export const slugs = [
   {
     language: 'uz',
     name: 'Uzbek',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'uzbek',
     id: 54,
@@ -428,8 +348,6 @@ export const slugs = [
   {
     language: 'zh',
     name: 'Chinese',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'chinese',
     id: 55,
@@ -438,8 +356,6 @@ export const slugs = [
   {
     language: 'en',
     name: 'Transliteration',
-    description: null,
-    is_available: 1,
     cardinality: '1_ayah',
     slug: 'transliteration',
     id: 56,
diff --git a/src/components/GlobalNav/Surah/index.js b/src/components/GlobalNav/Surah/index.js
index 71d15df60..babde9eea 100644
--- a/src/components/GlobalNav/Surah/index.js
+++ b/src/components/GlobalNav/Surah/index.js
@@ -18,11 +18,11 @@ import GlobalNav from '../index';
 
 const styles = require('../style.scss');
 
-const GlobalNavSurah = ({ surah, surahs, setOption, options, ...props }) => (
+const GlobalNavSurah = ({ chapter, chapters, setOption, options, ...props }) => (
   <GlobalNav
     {...props}
     leftControls={[
-      <SurahsDropdown title={surah.name.simple} surahs={surahs} />,
+      <SurahsDropdown title={chapter.nameSimple} chapters={chapters} />,
       <NavDropdown
         id="hidden-dropdown"
         className={`visible-xs-inline-block ${styles.optionsDropdown}`}
@@ -70,19 +70,19 @@ const GlobalNavSurah = ({ surah, surahs, setOption, options, ...props }) => (
 );
 
 GlobalNavSurah.propTypes = {
-  surah: surahType.isRequired,
-  surahs: PropTypes.objectOf(surahType).isRequired,
+  chapter: surahType.isRequired,
+  chapters: PropTypes.objectOf(surahType).isRequired,
   options: optionsType.isRequired,
   setOption: PropTypes.func.isRequired,
 };
 
 function mapStateToProps(state, ownProps) {
-  const surahId = parseInt(ownProps.params.surahId, 10);
-  const surah: Object = state.surahs.entities[surahId];
+  const chapterId = parseInt(ownProps.params.chapterId, 10);
+  const chapter: Object = state.chapters.entities[chapterId];
 
   return {
-    surah,
-    surahs: state.surahs.entities,
+    chapter,
+    chapters: state.chapters.entities,
     options: state.options
   };
 }
diff --git a/src/components/GlobalSidebar/Surah/index.js b/src/components/GlobalSidebar/Surah/index.js
index 82c843399..85684bb33 100644
--- a/src/components/GlobalSidebar/Surah/index.js
+++ b/src/components/GlobalSidebar/Surah/index.js
@@ -4,25 +4,25 @@ import { connect } from 'react-redux';
 import { surahType } from 'types';
 import GlobalSidebar from '../index.js';
 
-const GlobalSidebarSurah = ({ ...props, surah, ayahIds }) => (
-  <GlobalSidebar {...props} settingsModalProps={{ surah, ayahIds }} />
+const GlobalSidebarSurah = ({ ...props, chapter, versesIds }) => (
+  <GlobalSidebar {...props} settingsModalProps={{ chapter, versesIds }} />
 );
 
 GlobalSidebarSurah.propTypes = {
-  surah: surahType,
-  ayahIds: PropTypes.instanceOf(Set)
+  chapter: surahType,
+  versesIds: PropTypes.instanceOf(Set)
 };
 
 function mapStateToProps(state, ownProps) {
-  const surahId = parseInt(ownProps.params.surahId, 10);
-  const surah: Object = state.surahs.entities[surahId];
-  const ayahs: Object = state.ayahs.entities[surahId];
+  const chapterId = parseInt(ownProps.params.chapterId, 10);
+  const chapter: Object = state.chapters.entities[chapterId];
+  const ayahs: Object = state.verses.entities[chapterId];
   const ayahArray = ayahs ? Object.keys(ayahs).map(key => parseInt(key.split(':')[1], 10)) : [];
-  const ayahIds = new Set(ayahArray);
+  const versesIds = new Set(ayahArray);
 
   return {
-    surah,
-    ayahIds
+    chapter,
+    versesIds
   };
 }
 
diff --git a/src/components/Home/LastVisit/index.js b/src/components/Home/LastVisit/index.js
index 3ebb76210..af77cf6b0 100644
--- a/src/components/Home/LastVisit/index.js
+++ b/src/components/Home/LastVisit/index.js
@@ -8,15 +8,15 @@ const styles = require('containers/Home/style.scss');
 
 const LastVisit = (props) => {
   debug('component:Index', 'LastVisit');
-  if (!props.surah) return false;
+  if (!props.chapter) return false;
 
   return (
     <div>
       <h4 className={`text-muted ${styles.title}`}>
-        <LocaleFormattedMessage id="surah.index.continue" defaultMessage="Continue" />{' '}
-        <Link to={`/${props.surah.id}/${props.ayah}`}>
+        <LocaleFormattedMessage id="chapter.index.continue" defaultMessage="Continue" />{' '}
+        <Link to={`/${props.chapter.chapterNumber}/${props.verse}`}>
           <span>
-            {props.surah.name.simple} ({props.surah.id}:{props.ayah})
+            {props.chapter.nameSimple} ({props.chapter.chapterNumber}:{props.verse})
           </span>
         </Link>
       </h4>
@@ -25,8 +25,8 @@ const LastVisit = (props) => {
 };
 
 LastVisit.propTypes = {
-  surah: surahType.isRequired,
-  ayah: PropTypes.number.isRequired
+  chapter: surahType.isRequired,
+  verse: PropTypes.number.isRequired
 };
 
 export default LastVisit;
diff --git a/src/components/Home/SurahsList/index.js b/src/components/Home/SurahsList/index.js
index e98281d1d..0c747c46a 100644
--- a/src/components/Home/SurahsList/index.js
+++ b/src/components/Home/SurahsList/index.js
@@ -11,19 +11,19 @@ const SurahsList = (props) => {
 
   return (
     <ul className="col-md-4 list-unstyled">
-      {props.surahs.map(surah => (
-        <li className={`${styles.item}`} key={surah.id}>
-          <Link to={`/${surah.id}`} className={`${styles.link} row`}>
+      {props.chapters.map(chapter => (
+        <li className={`${styles.item}`} key={chapter.id}>
+          <Link to={`/${chapter.id}`} className={`${styles.link} row`}>
             <div className="col-xs-2 text-muted">
-              {surah.id}
+              {chapter.chapterNumber}
             </div>
             <div className="col-xs-7">
-              {surah.name.simple}
+              {chapter.nameSimple}
               <br />
-              <span className={`text-uppercase ${styles.english}`}>{surah.name.english}</span>
+              <span className={`text-uppercase ${styles.english}`}>{chapter.translatedName.name}</span>
             </div>
             <div className={`col-xs-3 text-right ${styles.arabic}`}>
-              {surah.name.arabic}
+              {chapter.nameArabic}
             </div>
           </Link>
         </li>
@@ -32,7 +32,7 @@ const SurahsList = (props) => {
 };
 
 SurahsList.propTypes = {
-  surahs: PropTypes.arrayOf(surahType).isRequired
+  chapters: PropTypes.arrayOf(surahType).isRequired
 };
 
 export default SurahsList;
diff --git a/src/components/Line/index.js b/src/components/Line/index.js
index 585354fe1..2ab9de416 100644
--- a/src/components/Line/index.js
+++ b/src/components/Line/index.js
@@ -4,13 +4,13 @@ import debug from 'helpers/debug';
 import { wordType } from 'types';
 import Word from 'components/Word';
 
-const styles = require('../Ayah/style.scss');
+const styles = require('../Verse/style.scss');
 
 export default class Line extends React.Component {
   static propTypes = {
     line: PropTypes.arrayOf(wordType).isRequired,
     tooltip: PropTypes.string,
-    currentAyah: PropTypes.string.isRequired,
+    currentVerse: PropTypes.string.isRequired,
     audioActions: PropTypes.shape({
       pause: PropTypes.func.isRequired,
       setAyah: PropTypes.func.isRequired,
@@ -23,7 +23,7 @@ export default class Line extends React.Component {
   // NOTE: this is commented out as it caused problems with 55:31 with missing text.
   // shouldComponentUpdate(nextProps) {
   //   const conditions = [
-  //     this.props.currentAyah !== nextProps.currentAyah,
+  //     this.props.currentVerse !== nextProps.currentVerse,
   //     this.props.line !== nextProps.line,
   //     this.props.isPlaying !== nextProps.isPlaying
   //   ];
@@ -34,13 +34,13 @@ export default class Line extends React.Component {
   // }
 
   renderText() {
-    const { tooltip, currentAyah, audioActions, isPlaying, line } = this.props;
+    const { tooltip, currentVerse, audioActions, isPlaying, line } = this.props;
 
     const text = line.map(word => (
       <Word
         word={word}
         key={`${word.position}-${word.code}-${word.lineNum}`}
-        currentAyah={currentAyah}
+        currentVerse={currentVerse}
         tooltip={tooltip}
         isPlaying={isPlaying}
         audioActions={audioActions}
@@ -59,12 +59,12 @@ export default class Line extends React.Component {
 
     debug(
       'component:Line',
-      `Page: ${line[0].pageNum} - Line: ${line[0].lineNum} - Ayah: ${line[0].ayahKey}`
+      `Page: ${line[0].pageNum} - Line: ${line[0].lineNum} - Ayah: ${line[0].verseKey}`
     );
 
     return (
       <div className={`row ${styles.font} text-justify text-arabic`}>
-        <div className="col-md-12 line-container" name={`ayah:${line[0].ayahKey}`}>
+        <div className="col-md-12 line-container" name={`ayah:${line[0].verseKey}`}>
           {this.renderText()}
         </div>
       </div>
diff --git a/src/components/SearchAutocomplete/index.js b/src/components/SearchAutocomplete/index.js
index 7f34aa059..b7f2ea6f3 100644
--- a/src/components/SearchAutocomplete/index.js
+++ b/src/components/SearchAutocomplete/index.js
@@ -12,7 +12,7 @@ const ayahRegex = /^(\d+)(?::(\d+))?$/;
 
 class SearchAutocomplete extends Component {
   static propTypes = {
-    surahs: PropTypes.objectOf(surahType).isRequired,
+    chapters: PropTypes.objectOf(surahType).isRequired,
     value: PropTypes.string,
     // TODO: This should not be doing html stuff. Should use react onKeydown.
     input: PropTypes.any, // eslint-disable-line
@@ -64,23 +64,23 @@ class SearchAutocomplete extends Component {
 
     if (!value) return matches;
 
-    const isAyahKeySearch = ayahRegex.test(value);
+    const isverseKeySearch = ayahRegex.test(value);
 
-    if (isAyahKeySearch) {
+    if (isverseKeySearch) {
       const captures = value.match(ayahRegex);
-      const surahId = captures[1];
+      const chapterId = captures[1];
       const ayahNum = captures[2];
-      const surah = this.props.surahs[surahId];
-      matches.push([surah.name.simple, surah.id + (ayahNum ? `/${ayahNum}` : '')]);
+      const chapter = this.props.chapters[chapterId];
+      matches.push([chapter.name.simple, chapter.chapterNumber + (ayahNum ? `/${ayahNum}` : '')]);
     } else if (value.length >= 2) {
       const escaped = value.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&');
 
-      Object.keys(this.props.surahs).forEach((surahId) => {
-        const surah = this.props.surahs[surahId];
-        if (RegExp(escaped, 'i').test(surah.name.simple.replace(/['-]/g, ''))) {
-          matches.push([surah.name.simple, surah.id]);
-        } else if (RegExp(escaped, 'i').test(surah.name.arabic)) {
-          matches.push([surah.name.arabic, surah.id]);
+      Object.keys(this.props.chapters).forEach((chapterId) => {
+        const chapter = this.props.chapters[chapterId];
+        if (RegExp(escaped, 'i').test(chapter.name.simple.replace(/['-]/g, ''))) {
+          matches.push([chapter.nameSimple, chapter.chapterNumber]);
+        } else if (RegExp(escaped, 'i').test(chapter.nameArabic)) {
+          matches.push([chapter.nameArabic, chapter.chapterNumber]);
         }
       });
     }
@@ -195,17 +195,17 @@ class SearchAutocomplete extends Component {
 }
 
 function mapStateToProps(state, ownProps) {
-  const surahs = state.surahs.entities;
-  const surahId = state.surahs.current;
+  const chapters = state.chapters.entities;
+  const chapterId = state.chapters.current;
   const suggestions = state.suggestResults.results[ownProps.value];
   let lang = 'en';
 
-  if (state.ayahs && state.ayahs.entities && state.ayahs.entities[surahId]) {
-    const ayahs = state.ayahs.entities[surahId];
-    const ayahKey = Object.keys(ayahs)[0];
+  if (state.verses && state.verses.entities && state.verses.entities[chapterId]) {
+    const ayahs = state.verses.entities[chapterId];
+    const verseKey = Object.keys(ayahs)[0];
 
-    if (ayahKey) {
-      const ayah = ayahs[ayahKey];
+    if (verseKey) {
+      const ayah = ayahs[verseKey];
 
       if (ayah.content && ayah.content[0] && ayah.content[0].lang) {
         lang = ayah.content[0].lang;
@@ -214,7 +214,7 @@ function mapStateToProps(state, ownProps) {
   }
 
   return {
-    surahs,
+    chapters,
     suggestions,
     lang
   };
diff --git a/src/components/SettingsModal/index.js b/src/components/SettingsModal/index.js
index 2c46faca4..df6c80f53 100644
--- a/src/components/SettingsModal/index.js
+++ b/src/components/SettingsModal/index.js
@@ -8,7 +8,7 @@ import ContentDropdown from 'components/ContentDropdown';
 import TooltipDropdown from 'components/TooltipDropdown';
 
 import { setOption } from 'redux/actions/options.js';
-import { load } from 'redux/actions/ayahs.js';
+import { load } from 'redux/actions/verses.js';
 import { optionsType, surahType } from 'types';
 
 const ModalHeader = Modal.Header;
@@ -16,7 +16,7 @@ const ModalTitle = Modal.Title;
 const ModalBody = Modal.Body;
 
 const SettingsModal = ({
-  surah,
+  chapter,
   ayahIds,
   open,
   handleHide,
@@ -27,10 +27,10 @@ const SettingsModal = ({
   const handleOptionChange = (payload) => {
     setOption(payload);
 
-    if (surah) {
+    if (chapter) {
       const first = [...ayahIds][0];
       const last = [...ayahIds][[...ayahIds].length - 1];
-      load(surah.id, first, last, { ...options, ...payload });
+      load(chapter.chapterNumber, first, last, { ...options, ...payload });
     }
   };
 
@@ -75,7 +75,7 @@ const SettingsModal = ({
 };
 
 SettingsModal.propTypes = {
-  surah: surahType,
+  chapter: surahType,
   ayahIds: PropTypes.instanceOf(Set),
   open: PropTypes.bool,
   handleHide: PropTypes.func.isRequired,
diff --git a/src/components/Share/index.js b/src/components/Share/index.js
index a00e8ed6d..eadf66bb7 100644
--- a/src/components/Share/index.js
+++ b/src/components/Share/index.js
@@ -8,12 +8,12 @@ const { FacebookShareButton, TwitterShareButton } = ShareButtons;
 const FacebookIcon = generateShareIcon('facebook');
 const TwitterIcon = generateShareIcon('twitter');
 
-const Share = ({ surah, ayahKey }) => {
+const Share = ({ chapter, verseKey }) => {
   // Fallback to Surah Id
-  const path = ayahKey ? ayahKey.replace(':', '/') : surah.id;
+  const path = verseKey ? verseKey.replace(':', '/') : chapter.chapterNumber;
   const shareUrl = `https://quran.com/${path}`;
-  const title = ayahKey ? `Surah ${surah.name.simple} [${ayahKey}]` : `Surah ${surah.name.simple}`;
-  const iconProps = ayahKey ? { iconBgStyle: { fill: '#d1d0d0' } } : {};
+  const title = verseKey ? `Surah ${chapter.nameSimple} [${verseKey}]` : `Surah ${chapter.nameSimple}`;
+  const iconProps = verseKey ? { iconBgStyle: { fill: '#d1d0d0' } } : {};
 
   return (
     <div className={`${styles.shareContainer}`}>
@@ -38,8 +38,8 @@ const Share = ({ surah, ayahKey }) => {
 };
 
 Share.propTypes = {
-  ayahKey: PropTypes.string,
-  surah: surahType.isRequired
+  verseKey: PropTypes.string,
+  chapter: surahType.isRequired
 };
 
 export default Share;
diff --git a/src/components/SurahInfo/index.js b/src/components/SurahInfo/index.js
index 944f58574..8a90d36a8 100644
--- a/src/components/SurahInfo/index.js
+++ b/src/components/SurahInfo/index.js
@@ -5,15 +5,15 @@ import Loader from 'components/Loader';
 
 const style = require('./style.scss');
 
-const SurahInfo = ({ surah, isShowingSurahInfo, onClose }) => {
+const SurahInfo = ({ chapter, isShowingSurahInfo, onClose }) => {
   // So we don't need to load images and files unless needed
   if (!isShowingSurahInfo) return <noscript />;
-  if (!surah.info) {
+  if (!chapter.info) {
     return <Loader />;
   }
 
   return (
-    <div className={`col-xs-12 ${style.container} surah-info ${style.show}`}>
+    <div className={`col-xs-12 ${style.container} chapter-info ${style.show}`}>
       <button
         tabIndex="-1"
         className={`${style.close} ss-delete`}
@@ -21,22 +21,22 @@ const SurahInfo = ({ surah, isShowingSurahInfo, onClose }) => {
       />
       <div className={`${style.row} row`}>
         <div
-          className={`col-md-6 col-xs-6 ${style.bg} ${style[surah.revelation.place]}`}
+          className={`col-md-3 col-xs-6 ${style.bg} ${style[chapter.revelationPlace]}`}
         />
         <div className={`${style.list} col-md-1 col-xs-6`}>
           <dl>
             <dt>VERSES</dt>
-            <dd className="text-uppercase">{surah.ayat}</dd>
+            <dd className="text-uppercase">{chapter.versesCount}</dd>
             <dt>PAGES</dt>
-            <dd className="text-uppercase">{surah.page.join('-')}</dd>
+            <dd className="text-uppercase">{chapter.pages.join('-')}</dd>
           </dl>
         </div>
         <div className={`${style.info} times-new col-md-8`}>
-          <div dangerouslySetInnerHTML={{ __html: surah.info.description }} />
+          <div dangerouslySetInnerHTML={{ __html: chapter.info.text }} />
           <div>
             <p>
               <em>
-                Source: {surah.info.contentSource}
+                Source: {chapter.info.source}
               </em>
             </p>
           </div>
@@ -49,7 +49,7 @@ const SurahInfo = ({ surah, isShowingSurahInfo, onClose }) => {
 SurahInfo.propTypes = {
   onClose: PropTypes.func,
   isShowingSurahInfo: PropTypes.bool,
-  surah: surahType
+  chapter: surahType
 };
 
 export default SurahInfo;
diff --git a/src/components/SurahsDropdown/index.js b/src/components/SurahsDropdown/index.js
index ea095af91..1a0a4dcab 100644
--- a/src/components/SurahsDropdown/index.js
+++ b/src/components/SurahsDropdown/index.js
@@ -11,33 +11,33 @@ const styles = require('./style.scss');
 
 export default class SurahsDropdown extends Component {
   static propTypes = {
-    surahs: PropTypes.objectOf(surahType).isRequired,
+    chapters: PropTypes.objectOf(surahType).isRequired,
     title: PropTypes.string,
   };
 
   shouldComponentUpdate(nextProps) {
-    return this.props.surahs !== nextProps.surahs;
+    return this.props.chapters !== nextProps.chapters;
   }
 
   renderList() {
-    const { surahs } = this.props;
+    const { chapters } = this.props;
 
-    return Object.values(surahs).map((surah, index) => (
-      <LinkContainer to={`/${surah.id}`} activeClass="active" key={`surah-${index}`}>
+    return Object.values(chapters).map((chapter, index) => (
+      <LinkContainer to={`/${chapter.chapterNumber}`} activeClass="active" key={`chapter-${index}`}>
         <MenuItem>
           <div className="row">
-            <div className="col-xs-2">
-              <span className="surah-num">
-                {surah.id}
+            <div className="col-xs-2 col-md-2">
+              <span className="chapter-num">
+                {chapter.chapterNumber}
               </span>
             </div>
-            <div className="col-xs-2">
-              <span className="suran-name">{surah.name.simple}</span>
+            <div className="col-xs-7 col-md-7">
+              <span className="suran-name">{chapter.nameSimple}</span>
               <br />
-              <span className="surah-meaning">{surah.name.english}</span>
+              <span className="chapter-meaning">{chapter.translatedName.name}</span>
             </div>
-            <div className={`col-xs-3 text-right ${styles.arabicName}`}>
-              {surah.name.arabic}
+            <div className={`col-xs-3  col-md-3 text-right ${styles.arabicName}`}>
+              {chapter.nameArabic}
             </div>
           </div>
         </MenuItem>
@@ -52,8 +52,8 @@ export default class SurahsDropdown extends Component {
       <NavDropdown
         link
         className={styles.dropdown}
-        id="surahs-dropdown"
-        title={title || <LocaleFormattedMessage id="setting.surahs" defaultMessage="Surahs" />}
+        id="chapters-dropdown"
+        title={title || <LocaleFormattedMessage id="setting.chapters" defaultMessage="Surahs" />}
       >
         {this.renderList()}
       </NavDropdown>
diff --git a/src/components/TopOptions/index.js b/src/components/TopOptions/index.js
index ac5627744..118a13192 100644
--- a/src/components/TopOptions/index.js
+++ b/src/components/TopOptions/index.js
@@ -4,21 +4,21 @@ import Title from 'containers/Surah/Title';
 import Share from 'components/Share';
 import { surahType } from 'types';
 
-const TopOptions = ({ surah }) => (
+const TopOptions = ({ chapter }) => (
   <div className="row">
     <div className="col-md-4 hidden-xs hidden-sm">
-      <Title surah={surah} />
+      <Title chapter={chapter} />
     </div>
     <div className="col-md-8 text-right">
       <ul className="list-inline">
-        <li><Share surah={surah} /></li>
+        <li><Share chapter={chapter} /></li>
       </ul>
     </div>
   </div>
 );
 
 TopOptions.propTypes = {
-  surah: surahType.isRequired
+  chapter: surahType.isRequired
 };
 
 export default TopOptions;
diff --git a/src/components/TopOptions/spec.js b/src/components/TopOptions/spec.js
index facd92a94..4a6c55174 100644
--- a/src/components/TopOptions/spec.js
+++ b/src/components/TopOptions/spec.js
@@ -30,7 +30,7 @@ describe('<TopOptions />', () => {
       <TopOptions
         options={options}
         actions={actions}
-        surah={getSurahs[5]}
+        chapter={getSurahs[5]}
       />
     );
 
diff --git a/src/components/Ayah/index.js b/src/components/Verse/index.js
similarity index 73%
rename from src/components/Ayah/index.js
rename to src/components/Verse/index.js
index 3b7aca6dd..35f9294af 100644
--- a/src/components/Ayah/index.js
+++ b/src/components/Verse/index.js
@@ -2,7 +2,7 @@ import React, { Component, PropTypes } from 'react';
 import Link from 'react-router/lib/Link';
 import { Element } from 'react-scroll';
 
-import { ayahType, matchType, surahType } from 'types';
+import { verseType, matchType, surahType } from 'types';
 import Share from 'components/Share';
 import Copy from 'components/Copy';
 import LocaleFormattedMessage from 'components/LocaleFormattedMessage';
@@ -12,11 +12,11 @@ import debug from 'helpers/debug';
 
 const styles = require('./style.scss');
 
-export default class Ayah extends Component {
+export default class Verse extends Component {
   static propTypes = {
     isSearched: PropTypes.bool,
-    ayah: ayahType.isRequired,
-    surah: surahType.isRequired,
+    verse: verseType.isRequired,
+    chapter: surahType.isRequired,
     bookmarked: PropTypes.bool, // TODO: Add this for search
     bookmarkActions: PropTypes.shape({
       isLoaded: PropTypes.func.isRequired,
@@ -39,8 +39,8 @@ export default class Ayah extends Component {
     isAuthenticated: PropTypes.bool,
     tooltip: PropTypes.string,
     currentWord: PropTypes.number, // gets passed in an integer, null by default
-    isCurrentAyah: PropTypes.bool,
-    currentAyah: PropTypes.string
+    iscurrentVerse: PropTypes.bool,
+    currentVerse: PropTypes.string
   };
 
   static defaultProps = {
@@ -50,11 +50,11 @@ export default class Ayah extends Component {
 
   shouldComponentUpdate(nextProps) {
     const conditions = [
-      this.props.ayah !== nextProps.ayah,
+      this.props.verse !== nextProps.verse,
       this.props.bookmarked !== nextProps.bookmarked,
       this.props.tooltip !== nextProps.tooltip,
       this.props.currentWord !== nextProps.currentWord,
-      this.props.isCurrentAyah !== nextProps.isCurrentAyah
+      this.props.iscurrentVerse !== nextProps.iscurrentVerse
     ];
 
     if (this.props.match) {
@@ -64,7 +64,7 @@ export default class Ayah extends Component {
     return conditions.some(condition => condition);
   }
 
-  handlePlay(ayah) {
+  handlePlay(verse) {
     const { isPlaying, audioActions } = this.props;
     const { pause, setAyah, play } = audioActions;
 
@@ -72,14 +72,14 @@ export default class Ayah extends Component {
       pause();
     }
 
-    setAyah(ayah);
+    setAyah(verse);
     play();
   }
 
   renderTranslations() {
-    const { ayah, match } = this.props;
+    const { verse, match } = this.props;
 
-    const array = match || ayah.content || [];
+    const array = match || verse.content || [];
 
     return array.map((content, index) => {
       const arabic = new RegExp(/[\u0600-\u06FF]/);
@@ -105,14 +105,14 @@ export default class Ayah extends Component {
   }
 
   renderMedia() {
-    const { ayah, mediaActions, isSearched } = this.props;
+    const { verse, mediaActions, isSearched } = this.props;
 
-    if (isSearched || !ayah.mediaContent) return false;
+    if (isSearched || !verse.mediaContent) return false;
 
     return (
       <div>
         {
-          ayah.mediaContent.map((content, index) => (
+          verse.mediaContent.map((content, index) => (
             <div
               className={`${styles.translation} translation`}
               key={index}
@@ -126,10 +126,10 @@ export default class Ayah extends Component {
                     data-metrics-event-name="Media Click"
                     data-metrics-media-content-url={content.url}
                     data-metrics-media-content-id={content.id}
-                    data-metrics-media-content-ayah-key={ayah.ayahKey}
+                    data-metrics-media-content-verse-key={verse.verseKey}
                   >
                     <LocaleFormattedMessage
-                      id="ayah.media.lectureFrom"
+                      id="verse.media.lectureFrom"
                       defaultMessage="Watch lecture by {from}"
                       values={{ from: content.resource.name }}
                     />
@@ -144,15 +144,15 @@ export default class Ayah extends Component {
   }
 
   renderText() {
-    const { ayah, tooltip, currentAyah, isPlaying, audioActions, isSearched } = this.props;
+    const { verse, tooltip, currentVerse, isPlaying, audioActions, isSearched } = this.props;
     // NOTE: Some 'word's are glyphs (jeem). Not words and should not be clicked for audio
     let wordAudioPosition = -1;
 
-    const text = ayah.words.map(word => ( // eslint-disable-line
+    const text = verse.words.map(word => ( // eslint-disable-line
       <Word
         word={word}
         key={`${word.position}-${word.code}-${word.lineNum}`}
-        currentAyah={currentAyah}
+        currentVerse={currentVerse}
         tooltip={tooltip}
         isPlaying={isPlaying}
         audioActions={audioActions}
@@ -167,22 +167,22 @@ export default class Ayah extends Component {
         <p
           dir="rtl"
           lang="ar"
-          className={`text-tashkeel text-p${ayah.pageNum}`}
-          dangerouslySetInnerHTML={{ __html: ayah.textTashkeel }}
+          className={`text-tashkeel text-p${verse.pageNumber}`}
+          dangerouslySetInnerHTML={{ __html: verse.textMadani }}
         />
       </h1>
     );
   }
 
   renderPlayLink() {
-    const { isSearched, ayah, currentAyah, isPlaying } = this.props;
-    const playing = ayah.ayahKey === currentAyah && isPlaying;
+    const { isSearched, verse, currentVerse, isPlaying } = this.props;
+    const playing = verse.verseKey === currentVerse && isPlaying;
 
     if (!isSearched) {
       return (
         <a
           tabIndex="-1"
-          onClick={() => this.handlePlay(ayah.ayahKey)}
+          onClick={() => this.handlePlay(verse.verseKey)}
           className="text-muted"
         >
           <i className={`ss-icon ${playing ? 'ss-pause' : 'ss-play'} vertical-align-middle`} />{' '}
@@ -198,11 +198,11 @@ export default class Ayah extends Component {
   }
 
   renderCopyLink() {
-    const { isSearched, ayah: { textTashkeel } } = this.props;
+    const { isSearched, verse: { textMadani } } = this.props;
 
     if (!isSearched) {
       return (
-        <Copy text={textTashkeel} />
+        <Copy text={textMadani} />
       );
     }
 
@@ -210,7 +210,7 @@ export default class Ayah extends Component {
   }
 
   renderBookmark() {
-    const { ayah, bookmarked, isAuthenticated, bookmarkActions, isSearched } = this.props;
+    const { verse, bookmarked, isAuthenticated, bookmarkActions, isSearched } = this.props;
 
     if (isSearched || !isAuthenticated) return false;
 
@@ -218,13 +218,13 @@ export default class Ayah extends Component {
       return (
         <a
           tabIndex="-1"
-          onClick={() => bookmarkActions.removeBookmark(ayah.ayahKey)}
+          onClick={() => bookmarkActions.removeBookmark(verse.verseKey)}
           className="text-muted"
         >
           <strong>
             <i className="ss-icon ss-bookmark vertical-align-middle" />{' '}
             <LocaleFormattedMessage
-              id="ayah.bookmarked"
+              id="verse.bookmarked"
               defaultMessage="Bookmarked"
             />
           </strong>
@@ -235,12 +235,12 @@ export default class Ayah extends Component {
     return (
       <a
         tabIndex="-1"
-        onClick={() => bookmarkActions.addBookmark(ayah.ayahKey)}
+        onClick={() => bookmarkActions.addBookmark(verse.verseKey)}
         className="text-muted"
       >
         <i className="ss-icon ss-bookmark vertical-align-middle" />{' '}
         <LocaleFormattedMessage
-          id="ayah.bookmark"
+          id="verse.bookmark"
           defaultMessage="Bookmark"
         />
       </a>
@@ -252,7 +252,7 @@ export default class Ayah extends Component {
     const content = (
       <h4>
         <span className={`label label-default ${styles.label}`}>
-          {this.props.ayah.surahId}:{this.props.ayah.ayahNum}
+          {this.props.verse.chapterId}:{this.props.verse.ayahNum}
         </span>
       </h4>
     );
@@ -260,8 +260,8 @@ export default class Ayah extends Component {
     if (isSearched) {
       return (
         <Link
-          to={`/${this.props.ayah.surahId}/${this.props.ayah.ayahNum}`}
-          data-metrics-event-name="Ayah:Searched:Link"
+          to={`/${this.props.verse.chapterId}/${this.props.verse.ayahNum}`}
+          data-metrics-event-name="Verse:Searched:Link"
         >
           {content}
         </Link>
@@ -270,8 +270,8 @@ export default class Ayah extends Component {
 
     return (
       <Link
-        to={`/${this.props.ayah.surahId}:${this.props.ayah.ayahNum}`}
-        data-metrics-event-name="Ayah:Link"
+        to={`/${this.props.verse.chapterId}:${this.props.verse.ayahNum}`}
+        data-metrics-event-name="Verse:Link"
       >
         {content}
       </Link>
@@ -279,7 +279,7 @@ export default class Ayah extends Component {
   }
 
   renderControls() {
-    const { surah, ayah } = this.props;
+    const { chapter, verse } = this.props;
 
     return (
       <div className={`col-md-1 col-sm-1 ${styles.controls}`}>
@@ -287,19 +287,19 @@ export default class Ayah extends Component {
         {this.renderPlayLink()}
         {this.renderCopyLink()}
         {this.renderBookmark()}
-        <Share surah={surah} ayahKey={ayah.ayahKey} />
+        <Share chapter={chapter} verseKey={verse.verseKey} />
       </div>
     );
   }
 
   render() {
-    const { ayah, isCurrentAyah } = this.props;
-    debug('component:Ayah', `Render ${this.props.ayah.ayahNum}`);
+    const { verse, iscurrentVerse } = this.props;
+    debug('component:Verse', `Render ${this.props.verse.ayahNum}`);
 
     return (
       <Element
-        name={`ayah:${ayah.ayahKey}`}
-        className={`row ${isCurrentAyah && 'highlight'} ${styles.container}`}
+        name={`verse:${verse.verseKey}`}
+        className={`row ${iscurrentVerse && 'highlight'} ${styles.container}`}
       >
         {this.renderControls()}
         <div className="col-md-11 col-sm-11">
diff --git a/src/components/Ayah/spec.js b/src/components/Verse/spec.js
similarity index 90%
rename from src/components/Ayah/spec.js
rename to src/components/Verse/spec.js
index 075dd704a..765bd7db8 100644
--- a/src/components/Ayah/spec.js
+++ b/src/components/Verse/spec.js
@@ -16,7 +16,7 @@ describe('<Ayah />', () => {
   });
 
   it('should have correct ayah number', () => {
-    expect(wrapper.find('.label').text()).to.eql(ayah.ayahKey);
+    expect(wrapper.find('.label').text()).to.eql(ayah.verseKey);
   });
 
   it('should contain translations', () => {
diff --git a/src/components/Ayah/style.scss b/src/components/Verse/style.scss
similarity index 100%
rename from src/components/Ayah/style.scss
rename to src/components/Verse/style.scss
diff --git a/src/components/VersesDropdown/index.js b/src/components/VersesDropdown/index.js
index 4f77bc5b2..27f8c9715 100644
--- a/src/components/VersesDropdown/index.js
+++ b/src/components/VersesDropdown/index.js
@@ -12,7 +12,7 @@ export default class VersesDropdown extends Component {
   static propTypes = {
     ayat: PropTypes.number.isRequired,
     loadedAyahs: PropTypes.instanceOf(Set).isRequired,
-    surah: surahType.isRequired, // Set
+    chapter: surahType.isRequired, // Set
     onClick: PropTypes.func.isRequired,
     isReadingMode: PropTypes.bool,
     className: PropTypes.string
@@ -23,7 +23,7 @@ export default class VersesDropdown extends Component {
   };
 
   renderItem = (ayah, index) => {
-    const { surah, loadedAyahs, isReadingMode, onClick } = this.props;
+    const { chapter, loadedAyahs, isReadingMode, onClick } = this.props;
     const ayahNum = index + 1;
 
     if (loadedAyahs.has(ayahNum) && !isReadingMode) {
@@ -31,7 +31,7 @@ export default class VersesDropdown extends Component {
         <li key={index}>
           <Link
             onClick={() => onClick(ayahNum)}
-            to={`ayah:${surah.id}:${ayahNum}`}
+            to={`ayah:${chapter.chapterNumber}:${ayahNum}`}
             smooth
             spy
             offset={-120}
diff --git a/src/components/Word/index.js b/src/components/Word/index.js
index 1e81d4d7a..348b31441 100644
--- a/src/components/Word/index.js
+++ b/src/components/Word/index.js
@@ -1,11 +1,11 @@
 import React, { PropTypes } from 'react';
 import bindTooltip from 'utils/bindTooltip';
 /* eslint-disable no-unused-vars */
-const CHAR_TYPE_WORD = 1;
-const CHAR_TYPE_END = 2;
-const CHAR_TYPE_PAUSE = 3;
-const CHAR_TYPE_RUB = 4;
-const CHAR_TYPE_SAJDAH = 5;
+const CHAR_TYPE_WORD = 'word';
+const CHAR_TYPE_END = 'end';
+const CHAR_TYPE_PAUSE = 'pause';
+const CHAR_TYPE_RUB = 'rub';
+const CHAR_TYPE_SAJDAH = 'sajdah';
 
 export default class Word extends React.Component {
   static propTypes = {
@@ -13,46 +13,46 @@ export default class Word extends React.Component {
     tooltip: PropTypes.string,
     audioActions: PropTypes.object.isRequired, // eslint-disable-line
     audioPosition: PropTypes.number,
-    currentAyah: PropTypes.string.isRequired,
+    currentVerse: PropTypes.string.isRequired,
     isPlaying: PropTypes.bool,
     isSearched: PropTypes.bool
   };
 
   buildTooltip = (word, tooltip) => {
     let title;
-    if (!word.wordId && word.charTypeId === CHAR_TYPE_END) {
-      title = `Verse ${word.ayahKey.split(':')[1]}`;
+    if (!word.wordId && word.charType === CHAR_TYPE_END) {
+      title = `Verse ${word.verseKey.split(':')[1]}`;
     } else {
-      title = word[tooltip];
+      title = word[tooltip].text;
     }
     return title;
   }
 
   handleWordClick = () => {
-    const { word, currentAyah, audioActions, audioPosition, isPlaying, isSearched } = this.props;
+    const { word, currentVerse, audioActions, audioPosition, isPlaying, isSearched } = this.props;
 
     if (isSearched) {
       return;
     }
 
-    if ((currentAyah === word.ayahKey) && isPlaying) {
+    if ((currentVerse === word.verseKey) && isPlaying) {
       audioActions.setCurrentWord(word.code);
     } else {
       audioActions.pause();
-      audioActions.setAyah(word.ayahKey);
+      audioActions.setAyah(word.verseKey);
       audioActions.playCurrentWord({ word, position: audioPosition });
     }
   }
 
   render() {
-    const { tooltip, word, currentAyah, isPlaying, audioPosition } = this.props;
+    const { tooltip, word, currentVerse, isPlaying, audioPosition } = this.props;
 
     let id = null;
-    const highlight = currentAyah === word.ayahKey && isPlaying ? 'highlight' : '';
+    const highlight = currentVerse === word.verseKey && isPlaying ? 'highlight' : '';
     const className = `${word.className} ${highlight} ${word.highlight ? word.highlight : ''}`;
 
-    if (word.charTypeId === CHAR_TYPE_WORD) {
-      id = `word-${word.ayahKey.replace(/:/, '-')}-${audioPosition || word.position}`;
+    if (word.charType === CHAR_TYPE_WORD) {
+      id = `word-${word.verseKey.replace(/:/, '-')}-${audioPosition || word.position}`;
     }
 
     return (
diff --git a/src/containers/Home/index.js b/src/containers/Home/index.js
index e64a55d02..6d651d8d9 100644
--- a/src/containers/Home/index.js
+++ b/src/containers/Home/index.js
@@ -5,7 +5,7 @@ import cookie from 'react-cookie';
 import { asyncConnect } from 'redux-connect';
 import { connect } from 'react-redux';
 import debug from 'helpers/debug';
-import { isAllLoaded, loadAll } from 'redux/actions/surahs.js';
+import { isAllLoaded, loadAll } from 'redux/actions/chapters.js';
 
 import LastVisit from 'components/Home/LastVisit';
 import SurahsList from 'components/Home/SurahsList';
@@ -29,16 +29,16 @@ const Home = (props) => {
           <div className="col-md-10 col-md-offset-1">
             {
               lastVisit &&
-              <LastVisit surah={props.surahs[lastVisit.surahId]} ayah={lastVisit.ayahId} />
+              <LastVisit chapter={props.chapters[lastVisit.chapterId]} verse={lastVisit.verseId} />
             }
             <QuickSurahs />
             <h4 className={`text-muted ${styles.title}`}>
-              <LocaleFormattedMessage id="surah.index.heading" defaultMessage="SURAHS (CHAPTERS)" />
+              <LocaleFormattedMessage id="chapter.index.heading" defaultMessage="SURAHS (CHAPTERS)" />
             </h4>
             <div className="row">
-              <SurahsList surahs={Object.values(props.surahs).slice(0, 38)} />
-              <SurahsList surahs={Object.values(props.surahs).slice(38, 76)} />
-              <SurahsList surahs={Object.values(props.surahs).slice(76, 114)} />
+              <SurahsList chapters={Object.values(props.chapters).slice(0, 38)} />
+              <SurahsList chapters={Object.values(props.chapters).slice(38, 76)} />
+              <SurahsList chapters={Object.values(props.chapters).slice(76, 114)} />
             </div>
           </div>
         </div>
@@ -48,7 +48,7 @@ const Home = (props) => {
 };
 
 Home.propTypes = {
-  surahs: PropTypes.objectOf(surahType).isRequired
+  chapters: PropTypes.objectOf(surahType).isRequired
 };
 
 const AsyncHome = asyncConnect([{
@@ -61,4 +61,4 @@ const AsyncHome = asyncConnect([{
   }
 }])(Home);
 
-export default connect(state => ({ surahs: state.surahs.entities }))(AsyncHome);
+export default connect(state => ({ chapters: state.chapters.entities }))(AsyncHome);
diff --git a/src/containers/Profile/index.js b/src/containers/Profile/index.js
index 496b2e81b..39450ee1a 100644
--- a/src/containers/Profile/index.js
+++ b/src/containers/Profile/index.js
@@ -40,8 +40,8 @@ class Profile extends Component { // eslint-disable-line
                   <ul className="list-group">
                     {
                       Object.values(bookmarks).map(bookmark => (
-                        <Link to={bookmark.ayahKey.split(':').join('/')} className="list-group-item">
-                          {bookmark.ayahKey}
+                        <Link to={bookmark.verseKey.split(':').join('/')} className="list-group-item">
+                          {bookmark.verseKey}
                         </Link>
                       ))
                     }
diff --git a/src/containers/Search/index.js b/src/containers/Search/index.js
index 0b05aab62..a4dd30737 100644
--- a/src/containers/Search/index.js
+++ b/src/containers/Search/index.js
@@ -8,14 +8,14 @@ import Helmet from 'react-helmet';
 import ReactPaginate from 'react-paginate';
 import { FormattedHTMLMessage } from 'react-intl';
 
-import Ayah from 'components/Ayah';
+import Verse from 'components/Verse';
 import Loader from 'components/Loader';
 
 import { search } from 'redux/actions/search.js';
 
 import LocaleFormattedMessage from 'components/LocaleFormattedMessage';
 
-import { ayahType, optionsType } from 'types';
+import { verseType, optionsType } from 'types';
 
 import Header from './Header';
 
@@ -31,7 +31,7 @@ class Search extends Component {
     from: PropTypes.number,
     query: PropTypes.string,
     results: PropTypes.array, // eslint-disable-line
-    ayahs: PropTypes.objectOf(ayahType),
+    verses: PropTypes.objectOf(verseType),
     push: PropTypes.func.isRequired,
     location: PropTypes.shape({
       q: PropTypes.string,
@@ -121,7 +121,7 @@ class Search extends Component {
   }
 
   renderBody() {
-    const { location, isErrored, isLoading, results, options, ayahs } = this.props;
+    const { location, isErrored, isLoading, results, options, verses } = this.props;
 
     if (!location.q) {
       return (
@@ -152,10 +152,10 @@ class Search extends Component {
     }
 
     return results.map(result => (
-      <Ayah
-        ayah={ayahs[result.ayah]}
+      <Verse
+        verse={verses[result.verse]}
         match={result.match}
-        key={result.ayah}
+        key={result.verse}
         tooltip={options.tooltip}
         isSearched
       />
@@ -210,7 +210,7 @@ function mapStateToProps(state) {
     took: state.searchResults.took,
     query: state.searchResults.query,
     results: state.searchResults.results,
-    ayahs: state.searchResults.entities,
+    verses: state.searchResults.entities,
     options: state.options
   };
 }
diff --git a/src/containers/Surah/Header/index.js b/src/containers/Surah/Header/index.js
deleted file mode 100644
index ce5ebfac8..000000000
--- a/src/containers/Surah/Header/index.js
+++ /dev/null
@@ -1,85 +0,0 @@
-import React, { PropTypes } from 'react';
-import { Link } from 'react-router';
-import Navbar from 'react-bootstrap/lib/Navbar';
-
-import LocaleFormattedMessage from 'components/LocaleFormattedMessage';
-
-import debug from 'helpers/debug';
-import surahType from 'types/surahType';
-
-const Header = Navbar.Header;
-
-const styles = require('./style.scss');
-
-const SurahHeader = ({ surah, handleToggleSidebar }) => {
-  debug('component:SurahHeader', 'Render');
-
-  return (
-    <Navbar className="montserrat surah" fixedTop fluid>
-      <Header>
-        <div className="row">
-          <div className="col-xs-3 col-md-1">
-            <button type="button" className="navbar-toggle collapsed" onClick={handleToggleSidebar}>
-              <span className="sr-only">Toggle navigation</span>
-              <span className="icon-bar" />
-              <span className="icon-bar" />
-              <span className="icon-bar" />
-            </button>
-          </div>
-          <div className="col-xs-6 col-md-10">
-            <ul className={`list-inline ${styles.container} text-center`}>
-              <li className={styles.verticalAlign}>
-                {
-                  surah.id > 1 &&
-                    <Link
-                      data-metrics-event-name="Title:PreviousSurah"
-                      className="navbar-text previous-chapter"
-                      to={`/${surah.id - 1}`}
-                    >
-                      <i
-                        data-metrics-event-name="Title:PreviousSurah"
-                        className="ss-icon ss-navigateleft"
-                      />
-                      <span className="hidden-xs hidden-sm">
-                        <LocaleFormattedMessage id={'surah.previous'} defaultMessage={'PREVIOUS SURAH'} />
-                      </span>
-                    </Link>
-                }
-              </li>
-              <li className={styles.verticalAlign}>
-                {
-                  surah &&
-                    <p className="navbar-text text-uppercase surah-name">
-                      {surah.name.simple} <span className="hidden-xs">({surah.name.english}) - سورة {surah.name.arabic}</span>
-                    </p>
-                }
-              </li>
-              <li className={styles.verticalAlign}>
-                {
-                  surah.id < 114 &&
-                    <Link
-                      data-metrics-event-name="Title:NextSurah"
-                      className="navbar-text next-chapter"
-                      to={`/${surah.id + 1}`}
-                    >
-                      <span className="hidden-xs hidden-sm">
-                        <LocaleFormattedMessage id={'surah.next'} defaultMessage={'NEXT SURAH'} />
-                      </span>
-                      <i data-metrics-event-name="Title:NextSurah" className="ss-icon ss-navigateright" />
-                    </Link>
-                }
-              </li>
-            </ul>
-          </div>
-        </div>
-      </Header>
-    </Navbar>
-  );
-};
-
-SurahHeader.propTypes = {
-  surah: surahType.isRequired,
-  handleToggleSidebar: PropTypes.func.isRequired
-};
-
-export default SurahHeader;
diff --git a/src/containers/Surah/Header/style.scss b/src/containers/Surah/Header/style.scss
deleted file mode 100644
index 32726d33e..000000000
--- a/src/containers/Surah/Header/style.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-@import '../../../styles/variables.scss';
-
-.container{
-  margin: 0px;
-  width: 100%;
-  margin-left: 15px;
-  display: inline-block;
-}
-.verticalAlign{
-  vertical-align: middle;
-}
-.ornament{
-  height: $navbar-height;
-  opacity: 0.15;
-}
diff --git a/src/containers/Surah/Title/index.js b/src/containers/Surah/Title/index.js
index 5bb040429..55580e93f 100644
--- a/src/containers/Surah/Title/index.js
+++ b/src/containers/Surah/Title/index.js
@@ -10,24 +10,24 @@ const zeroPad = (num, places) => {
   return Array(+(zero > 0 && zero)).join('0') + num;
 };
 
-const Title = ({ surah }) => {
-  const title = require(`../../../../static/images/titles/${zeroPad(surah.id, 3)}.svg`); // eslint-disable-line
+const Title = ({ chapter }) => {
+  const title = require(`../../../../static/images/titles/${zeroPad(chapter.chapterNumber, 3)}.svg`); // eslint-disable-line
 
-  if (!surah) return <noscript />;
+  if (!chapter) return <noscript />;
 
   return (
     <Isvg src={title}>
       <img
         src={title}
         className={styles.title}
-        alt={`${surah.name.simple} (${surah.name.english}) - سورة ${surah.name.arabic}`}
+        alt={`${chapter.nameSimple} (${chapter.translatedName.name}) - سورة ${chapter.nameArabic}`}
       />
     </Isvg>
   );
 };
 
 Title.propTypes = {
-  surah: surahType.isRequired
+  chapter: surahType.isRequired
 };
 
 export default Title;
diff --git a/src/containers/Surah/Title/spec.js b/src/containers/Surah/Title/spec.js
index fca1e74e0..4f9a304a4 100644
--- a/src/containers/Surah/Title/spec.js
+++ b/src/containers/Surah/Title/spec.js
@@ -4,7 +4,7 @@ import { shallow } from 'enzyme';
 import Title from './index';
 
 let wrapper;
-const surah = {
+const chapter = {
   id: 1,
   name: {
     arabic: 'الفاتحة',
@@ -14,23 +14,23 @@ const surah = {
   }
 };
 
-const renderComponent = data => shallow(<Title surah={data} />);
+const renderComponent = data => shallow(<Title chapter={data} />);
 
 describe('<Title />', () => {
   it('should render', () => {
-    wrapper = renderComponent(surah);
+    wrapper = renderComponent(chapter);
     expect(wrapper).to.be.ok; // eslint-disable-line
   });
 
-  it('should not show previous surah if on the first surah', () => {
-    wrapper = renderComponent(surah);
+  it('should not show previous chapter if on the first chapter', () => {
+    wrapper = renderComponent(chapter);
     const previous = wrapper.find('.previous-chapter').length;
     expect(previous).to.equal(0);
   });
 
-  it('should not show next surah if on the last surah', () => {
-    surah.id = 114;
-    wrapper = renderComponent(surah);
+  it('should not show next chapter if on the last chapter', () => {
+    chapter.chapterNumber = 114;
+    wrapper = renderComponent(chapter);
     const next = wrapper.find('.next-chapter').length;
     expect(next).to.equal(0);
   });
diff --git a/src/containers/Surah/connect.js b/src/containers/Surah/connect.js
index ae9bee19c..4dd251b32 100644
--- a/src/containers/Surah/connect.js
+++ b/src/containers/Surah/connect.js
@@ -3,22 +3,22 @@ import {
   loadAll,
   loadInfo,
   setCurrent as setCurrentSurah
-  } from 'redux/actions/surahs.js';
+} from 'redux/actions/chapters.js';
 
 import {
   clearCurrent,
   load as loadAyahs
-  } from 'redux/actions/ayahs.js';
+  } from 'redux/actions/verses.js';
 
 import { debug, isLoaded } from 'helpers';
 
 const ayahRangeSize = 30;
 
-export const surahsConnect = ({ store: { getState, dispatch } }) => {
-  debug('component:Surah:surahsConnect', 'Init');
+export const chaptersConnect = ({ store: { getState, dispatch } }) => {
+  debug('component:Surah:chaptersConnect', 'Init');
 
   if (!isAllLoaded(getState())) {
-    debug('component:Surah:surahsConnect', 'Surahs not loaded');
+    debug('component:Surah:chaptersConnect', 'Surahs not loaded');
 
     if (__CLIENT__) {
       dispatch(loadAll());
@@ -31,20 +31,20 @@ export const surahsConnect = ({ store: { getState, dispatch } }) => {
   return true;
 };
 
-export const surahInfoConnect = ({ store: { dispatch }, params }) => {
+export const chapterInfoConnect = ({ store: { dispatch }, params }) => {
   if (__CLIENT__) {
-    dispatch(loadInfo(params.surahId));
+    dispatch(loadInfo(params.chapterId));
     return true;
   }
 
-  return dispatch(loadInfo(params.surahId));
+  return dispatch(loadInfo(params.chapterId));
 };
 
-export const ayahsConnect = ({ store: { dispatch, getState }, params }) => {
-  debug('component:Surah:ayahsConnect', 'Init');
+export const versesConnect = ({ store: { dispatch, getState }, params }) => {
+  debug('component:Surah:versesConnect', 'Init');
 
   const range = params.range;
-  const surahId = parseInt(params.surahId, 10);
+  const chapterId = parseInt(params.chapterId, 10);
 
   let from;
   let to;
@@ -70,21 +70,21 @@ export const ayahsConnect = ({ store: { dispatch, getState }, params }) => {
   from = parseInt(from, 10);
   to = parseInt(to, 10);
 
-  if (surahId !== getState().surahs.current) {
-    dispatch(setCurrentSurah(surahId));
+  if (chapterId !== getState().chapters.current) {
+    dispatch(setCurrentSurah(chapterId));
   }
 
-  if (!isLoaded(getState(), surahId, from, to)) {
-    debug('component:Surah:ayahsConnect', 'Not loaded');
+  if (!isLoaded(getState(), chapterId, from, to)) {
+    debug('component:Surah:versesConnect', 'Not loaded');
 
-    dispatch(clearCurrent(surahId)); // In the case where you go to same surah but later ayahs.
+    dispatch(clearCurrent(chapterId)); // In the case where you go to same surah but later ayahs.
 
     if (__CLIENT__) {
-      dispatch(loadAyahs(surahId, from, to, getState().options));
+      dispatch(loadAyahs(chapterId, from, to, getState().options));
       return true;
     }
 
-    return dispatch(loadAyahs(surahId, from, to, getState().options));
+    return dispatch(loadAyahs(chapterId, from, to, getState().options));
   }
 
   return true;
diff --git a/src/containers/Surah/index.js b/src/containers/Surah/index.js
index d2bdddb51..a1a04c7df 100644
--- a/src/containers/Surah/index.js
+++ b/src/containers/Surah/index.js
@@ -15,7 +15,7 @@ import LazyLoad from 'components/LazyLoad';
 import PageBreak from 'components/PageBreak';
 import Audioplayer from 'components/Audioplayer';
 import SurahInfo from 'components/SurahInfo';
-import Ayah from 'components/Ayah';
+import Verse from 'components/Verse';
 import Line from 'components/Line';
 import Bismillah from 'components/Bismillah';
 import TopOptions from 'components/TopOptions';
@@ -28,27 +28,27 @@ import scroller from 'utils/scroller';
 import makeHeadTags from 'helpers/makeHeadTags';
 import debug from 'helpers/debug';
 
-import { surahType, ayahType } from 'types';
+import { surahType, verseType } from 'types';
 
 import * as AudioActions from 'redux/actions/audioplayer.js';
-import * as AyahActions from 'redux/actions/ayahs.js';
+import * as AyahActions from 'redux/actions/verses.js';
 import * as BookmarkActions from 'redux/actions/bookmarks.js';
 import * as OptionsActions from 'redux/actions/options.js';
 import * as MediaActions from 'redux/actions/media.js';
 
-import { surahsConnect, surahInfoConnect, ayahsConnect } from './connect';
+import { chaptersConnect, chapterInfoConnect, versesConnect } from './connect';
 
 const style = require('./style.scss');
 
 class Surah extends Component {
   static propTypes = {
-    surah: surahType.isRequired,
-    surahs: PropTypes.objectOf(surahType).isRequired,
+    chapter: surahType.isRequired,
+    chapters: PropTypes.objectOf(surahType).isRequired,
     actions: PropTypes.object.isRequired, // eslint-disable-line
     lines: PropTypes.object.isRequired, // eslint-disable-line
     isEndOfSurah: PropTypes.bool.isRequired,
-    ayahIds: PropTypes.instanceOf(Set),
-    currentAyah: PropTypes.string,
+    verseIds: PropTypes.instanceOf(Set),
+    currentVerse: PropTypes.string,
     bookmarks: PropTypes.object.isRequired, // eslint-disable-line
     isLoading: PropTypes.bool.isRequired,
     isLoaded: PropTypes.bool.isRequired,
@@ -56,9 +56,9 @@ class Surah extends Component {
     isAuthenticated: PropTypes.bool.isRequired,
     options: PropTypes.object.isRequired, // eslint-disable-line
     params: PropTypes.shape({
-      surahId: PropTypes.string.isRequired
+      chapterId: PropTypes.string.isRequired
     }).isRequired,
-    ayahs: PropTypes.objectOf(ayahType),
+    verses: PropTypes.objectOf(verseType),
     isPlaying: PropTypes.bool
   };
 
@@ -68,13 +68,13 @@ class Surah extends Component {
   };
 
   componentWillMount() {
-    const { params, surah, actions } = this.props; // eslint-disable-line no-shadow
+    const { params, chapter, actions } = this.props; // eslint-disable-line no-shadow
 
     if (params.range && params.range.includes('-')) {
       const start = parseInt(params.range.split('-')[0], 10);
 
-      if (start > surah.ayat || isNaN(start)) {
-        return actions.push.push('/error/invalid-ayah-range');
+      if (start > chapter.versesCount || isNaN(start)) {
+        return actions.push.push('/error/invalid-verse-range');
       }
 
       return false;
@@ -87,15 +87,15 @@ class Surah extends Component {
     const conditions = [
       this.state.lazyLoading !== nextState.lazyLoading,
       this.state.sidebarOpen !== nextState.sidebarOpen,
-      this.props.surah !== nextProps.surah,
+      this.props.chapter !== nextProps.chapter,
       this.props.isEndOfSurah !== nextProps.isEndOfSurah,
-      this.props.ayahIds.length !== nextProps.ayahIds.length,
-      this.props.surahs !== nextProps.surahs,
+      this.props.verseIds.length !== nextProps.verseIds.length,
+      this.props.chapters !== nextProps.chapters,
       this.props.bookmarks !== nextProps.bookmarks,
       this.props.isLoading !== nextProps.isLoading,
       this.props.isLoaded !== nextProps.isLoaded,
       this.props.options !== nextProps.options,
-      this.props.currentAyah !== nextProps.currentAyah,
+      this.props.currentVerse !== nextProps.currentVerse,
       this.props.isPlaying !== nextProps.isPlaying,
     ];
 
@@ -103,52 +103,52 @@ class Surah extends Component {
   }
 
   getLast() {
-    const { ayahIds } = this.props;
+    const { verseIds } = this.props;
 
-    return [...ayahIds][[...ayahIds].length - 1];
+    return [...verseIds][[...verseIds].length - 1];
   }
 
   getFirst() {
-    const { ayahIds } = this.props;
+    const { verseIds } = this.props;
 
-    return [...ayahIds][0];
+    return [...verseIds][0];
   }
 
   hasAyahs() {
-    return Object.keys(this.props.ayahs).length;
+    return Object.keys(this.props.verses).length;
   }
 
-  handleVerseDropdownClick = (ayahNum) => {
-    const { ayahIds, surah, actions } = this.props; // eslint-disable-line no-shadow
+  handleVerseDropdownClick = (verseNum) => {
+    const { verseIds, chapter, actions } = this.props; // eslint-disable-line no-shadow
 
-    actions.ayah.setCurrentAyah(`${surah.id}:${ayahNum}`);
+    actions.verse.setcurrentVerse(`${chapter.chapterNumber}:${verseNum}`);
 
-    if (ayahIds.has(ayahNum)) {
+    if (verseIds.has(verseNum)) {
       return false;
     }
 
-    if (ayahNum > (this.getLast() + 10) || ayahNum < this.getFirst()) {
+    if (verseNum > (this.getLast() + 10) || verseNum < this.getFirst()) {
       // This is beyond lazy loading next page.
       if (actions.push) {
-        return actions.push.push(`/${surah.id}/${ayahNum}-${ayahNum + 10}`);
+        return actions.push.push(`/${chapter.chapterNumber}/${verseNum}-${verseNum + 10}`);
       }
     }
 
     return this.handleLazyLoadAyahs(() => setTimeout(() =>
-      scroller.scrollTo(`ayah:${surah.id}:${ayahNum}`),
+      scroller.scrollTo(`verse:${chapter.chapterNumber}:${verseNum}`),
     1000)); // then scroll to it
   }
 
   handleLazyLoadAyahs = (callback) => {
-    const { ayahIds, surah, isEndOfSurah, options, actions } = this.props; // eslint-disable-line no-shadow, max-len
+    const { verseIds, chapter, isEndOfSurah, options, actions } = this.props; // eslint-disable-line no-shadow, max-len
     const range = [this.getFirst(), this.getLast()];
 
     const size = 10;
     const from = range[1];
     const to = (from + size);
 
-    if (!isEndOfSurah && !ayahIds.has(to)) {
-      actions.ayah.load(surah.id, from, to, options).then(() => {
+    if (!isEndOfSurah && !verseIds.has(to)) {
+      actions.verse.load(chapter.chapterNumber, from, to, options).then(() => {
         this.setState({ lazyLoading: false });
         return callback && callback();
       });
@@ -164,27 +164,27 @@ class Surah extends Component {
   }
 
   title() {
-    const { params, surah } = this.props;
+    const { params, chapter } = this.props;
 
     if (params.range) {
-      return `Surah ${surah.name.simple} [${surah.id}:${params.range}]`;
+      return `Surah ${chapter.nameSimple} [${chapter.chapterNumber}:${params.range}]`;
     }
 
-    return `Surah ${surah.name.simple} [${surah.id}]`;
+    return `Surah ${chapter.nameSimple} [${chapter.chapterNumber}]`;
   }
 
   description() {
-    const { params, ayahs, surah } = this.props;
+    const { params, verses, chapter } = this.props;
 
     if (params.range) {
       if (params.range.includes('-')) {
         const [from, to] = params.range.split('-').map(num => parseInt(num, 10));
         const array = Array(to - from).fill(from);
         const translations = array.map((fromAyah, index) => {
-          const ayah = ayahs[`${surah.id}:${fromAyah + index}`];
+          const verse = verses[`${chapter.chapterNumber}:${fromAyah + index}`];
 
-          if (ayah && ayah.content && ayah.content[0]) {
-            return ayah.content[0].text;
+          if (verse && verse.content && verse.content[0]) {
+            return verse.content[0].text;
           }
 
           return '';
@@ -192,33 +192,35 @@ class Surah extends Component {
 
         const content = translations.join(' - ').slice(0, 250);
 
-        return `Surat ${surah.name.simple} [verse ${params.range}] - ${content}`;
+        return `Surat ${chapter.nameSimple} [verse ${params.range}] - ${content}`;
       }
 
-      const ayah = ayahs[`${surah.id}:${params.range}`];
+      const verse = verses[`${chapter.chapterNumber}:${params.range}`];
 
-      if (ayah && ayah.content && ayah.content[0]) {
-        return `Surat ${surah.name.simple} [verse ${params.range}] - ${ayah.content[0].text}`;
+      if (verse && verse.content && verse.content[0]) {
+        return `Surat ${chapter.nameSimple} [verse ${params.range}] - ${verse.content[0].text}`;
       }
 
-      return `Surat ${surah.name.simple} [verse ${params.range}]`;
+      return `Surat ${chapter.nameSimple} [verse ${params.range}]`;
     }
 
-    return `${surah.info ? surah.info.shortDescription : ''} This Surah has ${surah.ayat} ayahs and resides between pages ${surah.page[0]} to ${surah.page[1]} in the Quran.`; // eslint-disable-line max-len
+    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
   }
 
   renderPagination() {
-    const { isSingleAyah, isLoading, isEndOfSurah, surah } = this.props;
+    const { isSingleAyah, isLoading, isEndOfSurah, chapter } = this.props;
 
-    // If single ayah, eh. /2/30
+    // If single verse, eh. /2/30
     if (isSingleAyah) {
-      const to = this.getFirst() + 10 > surah.ayat ? surah.ayat : this.getFirst() + 10;
+      const to = this.getFirst() + 10 > chapter.versesCount ?
+        chapter.versesCount :
+        this.getFirst() + 10;
 
       return (
         <ul className="pager">
           <li className="text-center">
-            <Link to={`/${surah.id}/${this.getFirst()}-${to}`}>
-              <LocaleFormattedMessage id="surah.index.continue" defaultMessage="Continue" />
+            <Link to={`/${chapter.chapterNumber}/${this.getFirst()}-${to}`}>
+              <LocaleFormattedMessage id="chapter.index.continue" defaultMessage="Continue" />
             </Link>
           </li>
         </ul>
@@ -233,31 +235,31 @@ class Surah extends Component {
         endComponent={
           <ul className="pager">
             {
-              surah.id > 1 &&
+              chapter.chapterNumber > 1 &&
                 <li className="previous">
-                  <Link to={`/${(surah.id * 1) - 1}`}>
+                  <Link to={`/${(chapter.chapterNumber * 1) - 1}`}>
                     &larr;
                     <LocaleFormattedMessage
-                      id="surah.previous"
+                      id="chapter.previous"
                       defaultMessage="Previous Surah"
                     />
                   </Link>
                 </li>
             }
             <li className="text-center">
-              <Link to={`/${surah.id}`}>
+              <Link to={`/${chapter.chapterNumber}`}>
                 <LocaleFormattedMessage
-                  id="surah.goToBeginning"
+                  id="chapter.goToBeginning"
                   defaultMessage="Beginning of Surah"
                 />
               </Link>
             </li>
             {
-              surah.id < 114 &&
+              chapter.chapterNumber < 114 &&
                 <li className="next">
-                  <Link to={`/${(surah.id * 1) + 1}`}>
+                  <Link to={`/${(chapter.chapterNumber * 1) + 1}`}>
                     <LocaleFormattedMessage
-                      id="surah.next"
+                      id="chapter.next"
                       defaultMessage="Next Surah"
                     />
                     &rarr;
@@ -273,36 +275,36 @@ class Surah extends Component {
 
   renderAyahs() {
     const {
-      surah,
-      ayahs,
+      chapter,
+      verses,
       actions,
       options,
       bookmarks,
       isPlaying,
       isAuthenticated,
-      currentAyah,
+      currentVerse,
     } = this.props; // eslint-disable-line no-shadow
 
-    return Object.values(ayahs).map(ayah => (
-      <Ayah
-        ayah={ayah}
-        surah={surah}
-        currentAyah={currentAyah}
-        isCurrentAyah={isPlaying && ayah.ayahKey === currentAyah}
-        bookmarked={!!bookmarks[ayah.ayahKey]}
+    return Object.values(verses).map(verse => (
+      <Verse
+        verse={verse}
+        chapter={chapter}
+        currentVerse={currentVerse}
+        iscurrentVerse={isPlaying && verse.verseKey === currentVerse}
+        bookmarked={!!bookmarks[verse.verseKey]}
         tooltip={options.tooltip}
         bookmarkActions={actions.bookmark}
         audioActions={actions.audio}
         mediaActions={actions.media}
         isPlaying={isPlaying}
         isAuthenticated={isAuthenticated}
-        key={`${ayah.surahId}-${ayah.ayahNum}-ayah`}
+        key={`${verse.chapterId}-${verse.id}-verse`}
       />
     ));
   }
 
   renderLines() {
-    const { lines, options, currentAyah, isPlaying, actions } = this.props;
+    const { lines, options, currentVerse, isPlaying, actions } = this.props;
     const keys = Object.keys(lines);
 
     return keys.map((lineNum, index) => {
@@ -315,7 +317,7 @@ class Surah extends Component {
           <Line
             line={line}
             key={lineNum}
-            currentAyah={currentAyah}
+            currentVerse={currentVerse}
             tooltip={options.tooltip}
             audioActions={actions.audio}
             isPlaying={isPlaying}
@@ -328,7 +330,7 @@ class Surah extends Component {
         <Line
           line={line}
           key={lineNum}
-          currentAyah={currentAyah}
+          currentVerse={currentVerse}
           tooltip={options.tooltip}
           audioActions={actions.audio}
           isPlaying={isPlaying}
@@ -338,13 +340,13 @@ class Surah extends Component {
   }
 
   render() {
-    const { surah, options, actions } = this.props; // eslint-disable-line no-shadow
+    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 /></div>;
 
     return (
-      <div className="surah-body">
+      <div className="chapter-body">
         <Helmet
           {...makeHeadTags({
             title: this.title(),
@@ -366,8 +368,8 @@ class Surah extends Component {
                 "@type": "ListItem",
                 "position": 2,
                 "item": {
-                  "@id": "https://quran.com/${surah.id}",
-                  "name": "${surah.name.simple}"
+                  "@id": "https://quran.com/${chapter.chapterNumber}",
+                  "name": "${chapter.nameSimple}"
                 }
               }]
             }`
@@ -386,14 +388,14 @@ class Surah extends Component {
         <div className={`container-fluid ${style.container}`}>
           <div className="row">
             <SurahInfo
-              surah={surah}
+              chapter={chapter}
               loadInfo={actions.loadInfo}
               isShowingSurahInfo={options.isShowingSurahInfo}
               onClose={this.handleSurahInfoToggle}
             />
             <div className="col-md-10 col-md-offset-1">
-              <TopOptions surah={surah} />
-              <Bismillah surah={surah} />
+              <TopOptions chapter={chapter} />
+              <Bismillah chapter={chapter} />
               {options.isReadingMode ? this.renderLines() : this.renderAyahs()}
             </div>
             <div className="col-md-10 col-md-offset-1">
@@ -402,7 +404,7 @@ class Surah extends Component {
           </div>
         </div>
         <Audioplayer
-          surah={surah}
+          chapter={chapter}
           onLoadAyahs={this.handleLazyLoadAyahs}
         />
       </div>
@@ -411,36 +413,36 @@ class Surah extends Component {
 }
 
 const AsyncSurah = asyncConnect([
-  { promise: surahsConnect },
-  { promise: surahInfoConnect },
-  { promise: ayahsConnect }
+  { promise: chaptersConnect },
+  { promise: chapterInfoConnect },
+  { promise: versesConnect }
 ])(Surah);
 
 function mapStateToProps(state, ownProps) {
-  const surahId = parseInt(ownProps.params.surahId, 10);
-  const surah: Object = state.surahs.entities[surahId];
-  const ayahs: Object = state.ayahs.entities[surahId];
-  const ayahArray = ayahs ? Object.keys(ayahs).map(key => parseInt(key.split(':')[1], 10)) : [];
-  const ayahIds = new Set(ayahArray);
-  const lastAyahInArray = ayahArray.slice(-1)[0];
-  const isSingleAyah = !ownProps.params.range.includes('-');
+  const chapterId = parseInt(ownProps.params.chapterId, 10);
+  const chapter: Object = state.chapters.entities[chapterId];
+  const verses: Object = state.verses.entities[chapterId];
+  const verseArray = verses ? Object.keys(verses).map(key => parseInt(key.split(':')[1], 10)) : [];
+  const verseIds = new Set(verseArray);
+  const lastAyahInArray = verseArray.slice(-1)[0];
+  const isSingleAyah = !!ownProps.params.range && !ownProps.params.range.includes('-');
 
 
   return {
-    surah,
-    ayahs,
-    ayahIds,
+    chapter,
+    verses,
+    verseIds,
     isSingleAyah,
     isStarted: state.audioplayer.isStarted,
     isPlaying: state.audioplayer.isPlaying,
-    currentAyah: state.audioplayer.currentAyah,
+    currentVerse: state.audioplayer.currentVerse,
     isAuthenticated: state.auth.loaded,
-    currentWord: state.ayahs.currentWord,
-    isEndOfSurah: lastAyahInArray === surah.ayat,
-    surahs: state.surahs.entities,
+    currentWord: state.verses.currentWord,
+    isEndOfSurah: lastAyahInArray === chapter.versesCount,
+    chapters: state.chapters.entities,
     bookmarks: state.bookmarks.entities,
-    isLoading: state.ayahs.loading,
-    isLoaded: state.ayahs.loaded,
+    isLoading: state.verses.loading,
+    isLoaded: state.verses.loaded,
     lines: state.lines.lines,
     options: state.options
   };
@@ -450,7 +452,7 @@ function mapDispatchToProps(dispatch) {
   return {
     actions: {
       options: bindActionCreators(OptionsActions, dispatch),
-      ayah: bindActionCreators(AyahActions, dispatch),
+      verse: bindActionCreators(AyahActions, dispatch),
       audio: bindActionCreators(AudioActions, dispatch),
       bookmark: bindActionCreators(BookmarkActions, dispatch),
       media: bindActionCreators(MediaActions, dispatch),
diff --git a/src/helpers/buildFontFaces.js b/src/helpers/buildFontFaces.js
index 67f30d7b8..c7e42500c 100644
--- a/src/helpers/buildFontFaces.js
+++ b/src/helpers/buildFontFaces.js
@@ -14,11 +14,11 @@ export const fontFaceStyleLoaded = fontClassName => (
   .text-${fontClassName} {display: none;}`
 );
 
-export function createFontFacesArray(ayahs) {
+export function createFontFacesArray(verses) {
   const fontFaces = [];
   const fontFacesArray = [];
 
-  ayahs.forEach((ayah) => {
+  verses.forEach((ayah) => {
     const font = ayah.words[0].className;
 
     if (fontFaces.indexOf(font) === -1) {
diff --git a/src/helpers/buildSegments.js b/src/helpers/buildSegments.js
index 58b7e6a99..d04beb5f6 100644
--- a/src/helpers/buildSegments.js
+++ b/src/helpers/buildSegments.js
@@ -21,13 +21,13 @@ export const buildSegments = (segments) => {
   return { words, intervals };
 };
 
-export const extractSegments = (ayahs) => {
+export const extractSegments = (verses) => {
   const segments = {};
 
-  Object.values(ayahs).forEach((ayah) => {
-    if (ayah.audio) {
-      if (ayah.audio.segments) {
-        segments[ayah.ayahKey] = buildSegments(ayah.audio.segments);
+  Object.values(verses).forEach((verse) => {
+    if (verse.audio) {
+      if (verse.audio.segments) {
+        segments[verse.verseKey] = buildSegments(verse.audio.segments);
       }
     }
   });
diff --git a/src/helpers/index.js b/src/helpers/index.js
index d5c2d2955..5bdf452be 100644
--- a/src/helpers/index.js
+++ b/src/helpers/index.js
@@ -1,8 +1,8 @@
-export function isLoaded(globalState, surahId, from, to) {
+export function isLoaded(globalState, chapterId, from, to) {
   return (
-  globalState.ayahs.entities[surahId] &&
-  globalState.ayahs.entities[surahId][`${surahId}:${from}`] &&
-  globalState.ayahs.entities[surahId][`${surahId}:${to}`]
+  globalState.verses.entities[chapterId] &&
+  globalState.verses.entities[chapterId][`${chapterId}:${from}`] &&
+  globalState.verses.entities[chapterId][`${chapterId}:${to}`]
   );
 }
 export { default as debug } from './debug';
diff --git a/src/locale/ar.js b/src/locale/ar.js
index d17d3a260..7a7800367 100644
--- a/src/locale/ar.js
+++ b/src/locale/ar.js
@@ -7,7 +7,7 @@ export default {
     'local.navtiveName': 'العربية',
     'local.selectLabel': 'اللغة',
     'setting.title': 'خيارات',
-    'setting.surahs': 'السورة',
+    'setting.chapters': 'السورة',
     'setting.verses': 'الذهاب إلى الآية',
     'setting.reciters.title': 'القراء',
     'setting.translations.title': 'الترجمات',
@@ -43,7 +43,7 @@ export default {
     'surah.index.quickLinks': 'روابط سريعة',
     'surah.goToBeginning': 'ابتداء من سورة',
 
-    'player.currentAyah': 'آية',
+    'player.currentVerse': 'آية',
     'player.nextAyah': 'آية القادمة',
     'player.previousAyah': 'آية السابقة',
     'player.repeat.title': 'تكرار التبديل',
diff --git a/src/locale/en.js b/src/locale/en.js
index 5950db0a4..ef3d60c4b 100644
--- a/src/locale/en.js
+++ b/src/locale/en.js
@@ -7,7 +7,7 @@ export default {
     'local.navtiveName': 'English',
     'local.selectLabel': 'Language',
     'setting.title': 'Settings',
-    'setting.surahs': 'Surahs',
+    'setting.chapters': 'Surahs',
     'setting.verses': 'Go to verse',
     'setting.reciters.title': 'Reciters',
     'setting.translations.title': 'Translations',
@@ -43,7 +43,7 @@ export default {
     'surah.index.quickLinks': 'Quick links',
     'surah.goToBeginning': 'Beginning of Surah',
 
-    'player.currentAyah': 'Ayah',
+    'player.currentVerse': 'Ayah',
     'player.nextAyah': 'Next Ayah',
     'player.previousAyah': 'Previous Ayah',
     'player.repeat.title': 'TOGGLE REPEAT',
diff --git a/src/locale/id.js b/src/locale/id.js
index 82324863d..a5b13192e 100644
--- a/src/locale/id.js
+++ b/src/locale/id.js
@@ -7,7 +7,7 @@ export default {
     'local.navtiveName': 'Indonesia',
     'local.selectLabel': 'Bahasa',
     'setting.title': 'Pengaturan',
-    'setting.surahs': 'Surat',
+    'setting.chapters': 'Surat',
     'setting.verses': 'Pergi ke ayat',
     'setting.reciters.title': 'Qari\'',
     'setting.translations.title': 'Terjemahan',
@@ -43,7 +43,7 @@ export default {
     'surah.index.quickLinks': 'Tautan cepat',
     'surah.goToBeginning': 'Awal Surat',
 
-    'player.currentAyah': 'Ayat',
+    'player.currentVerse': 'Ayat',
     'player.nextAyah': 'Ayat Berikutnya',
     'player.previousAyah': 'Ayat Sebelumnya',
     'player.repeat.title': 'PENGULANGAN',
diff --git a/src/locale/ur.js b/src/locale/ur.js
index 543ef0f61..3c77c91c2 100644
--- a/src/locale/ur.js
+++ b/src/locale/ur.js
@@ -7,7 +7,7 @@ export default {
     'local.navtiveName': 'اردو',
     'local.selectLabel': 'زبان',
     'setting.title': 'اختیارات',
-    'setting.surahs': 'سورة',
+    'setting.chapters': 'سورة',
     'setting.verses': 'آیت منتخب کریں',
     'setting.reciters.title': 'قاری منتخب کریں',
     'setting.translations.title': 'ترجمے',
@@ -43,7 +43,7 @@ export default {
     'surah.index.quickLinks': 'فوری لنک',
     'surah.goToBeginning': 'سورہ کے شروع میں جائیں',
 
-    'player.currentAyah': 'آیت',
+    'player.currentVerse': 'آیت',
     'player.nextAyah': 'اگلی آیت',
     'player.previousAyah': 'پچھلی آیت',
     'player.repeat.title': ' دہرائیں',
diff --git a/src/redux/actions/audioplayer.js b/src/redux/actions/audioplayer.js
index 2bb9396ed..a244fc193 100644
--- a/src/redux/actions/audioplayer.js
+++ b/src/redux/actions/audioplayer.js
@@ -53,24 +53,24 @@ export function pause() {
   };
 }
 
-export function next(currentAyah) {
+export function next(currentVerse) {
   return {
     type: NEXT,
-    currentAyah
+    currentVerse
   };
 }
 
-export function setAyah(currentAyah) {
+export function setAyah(currentVerse) {
   return {
     type: SET_AYAH,
-    currentAyah
+    currentVerse
   };
 }
 
-export function previous(currentAyah) {
+export function previous(currentVerse) {
   return {
     type: PREVIOUS,
-    currentAyah
+    currentVerse
   };
 }
 
@@ -87,10 +87,10 @@ export function toggleScroll() {
   };
 }
 
-export function buildOnClient(surahId) {
+export function buildOnClient(chapterId) {
   return {
     type: BUILD_ON_CLIENT,
-    surahId
+    chapterId
   };
 }
 
diff --git a/src/redux/actions/bookmarks.js b/src/redux/actions/bookmarks.js
index 6f8bf7a5f..174087369 100644
--- a/src/redux/actions/bookmarks.js
+++ b/src/redux/actions/bookmarks.js
@@ -23,22 +23,22 @@ export function load() {
   };
 }
 
-export function addBookmark(ayahKey) {
+export function addBookmark(verseKey) {
   return {
     types: [ADD_BOOKMARK, ADD_BOOKMARK_SUCCESS, ADD_BOOKMARK_FAILURE],
     promise: client => client.post('/onequran/api/v1/bookmarks.json', {
       data: {
-        bookmark: { ayahKey }
+        bookmark: { verseKey }
       }
     }),
-    ayahKey
+    verseKey
   };
 }
 
-export function removeBookmark(ayahKey) {
+export function removeBookmark(verseKey) {
   return {
     types: [REMOVE_BOOKMARK, REMOVE_BOOKMARK_SUCCESS, REMOVE_BOOKMARK_FAILURE],
-    promise: client => client.del(`/onequran/api/v1/bookmarks/${ayahKey}.json`),
-    ayahKey
+    promise: client => client.del(`/onequran/api/v1/bookmarks/${verseKey}.json`),
+    verseKey
   };
 }
diff --git a/src/redux/actions/surahs.js b/src/redux/actions/chapters.js
similarity index 53%
rename from src/redux/actions/surahs.js
rename to src/redux/actions/chapters.js
index ccfbc2951..62079c90a 100644
--- a/src/redux/actions/surahs.js
+++ b/src/redux/actions/chapters.js
@@ -1,4 +1,4 @@
-import { surahsSchema } from 'redux/schemas';
+import { chaptersSchema } from 'redux/schemas';
 import {
   LOAD,
   LOAD_SUCCESS,
@@ -6,28 +6,28 @@ import {
   LOAD_INFO,
   LOAD_INFO_SUCCESS,
   LOAD_INFO_FAIL,
-  SET_CURRENT } from 'redux/constants/surahs.js';
+  SET_CURRENT } from 'redux/constants/chapters.js';
 
 
 export function loadAll() {
   return {
     types: [LOAD, LOAD_SUCCESS, LOAD_FAIL],
-    schema: [surahsSchema],
-    promise: client => client.get('/v2/surahs')
+    schema: { chapters: [chaptersSchema] },
+    promise: client => client.get('/api/v3/chapters')
   };
 }
 
 export function load(id) {
   return {
     types: [LOAD, LOAD_SUCCESS, LOAD_FAIL],
-    schema: [surahsSchema],
-    promise: client => client.get(`/v2/surahs/${id}`)
+    schema: { chapter: chaptersSchema },
+    promise: client => client.get(`/api/v3/chapters/${id}`)
   };
 }
 
 export const loadInfo = id => ({
   types: [LOAD_INFO, LOAD_INFO_SUCCESS, LOAD_INFO_FAIL],
-  promise: client => client.get(`/v2/surahs/${id}/info`),
+  promise: client => client.get(`/api/v3/chapters/${id}/info`),
   id
 });
 
@@ -37,9 +37,9 @@ export const setCurrent = id => ({
 });
 
 export function isSingleLoaded(globalState, id) {
-  return !!globalState.surahs.entities[id];
+  return !!globalState.chapters.entities[id];
 }
 
 export function isAllLoaded(globalState) {
-  return Object.keys(globalState.surahs.entities).length === 114;
+  return Object.keys(globalState.chapters.entities).length === 114;
 }
diff --git a/src/redux/actions/search.js b/src/redux/actions/search.js
index c9b80601e..2efdf3fd5 100644
--- a/src/redux/actions/search.js
+++ b/src/redux/actions/search.js
@@ -1,4 +1,4 @@
-import { ayahsSchema } from 'redux/schemas';
+import { versesSchema } from 'redux/schemas';
 
 import {
   SEARCH,
@@ -9,9 +9,9 @@ import {
 export function search(params) {
   return {
     types: [SEARCH, SEARCH_SUCCESS, SEARCH_FAIL],
-    schema: { results: [{ ayah: ayahsSchema }] },
+    schema: { results: [{ ayah: versesSchema }] },
     // TODO: We are doing this because of a weird obj.hasOwnProperty method missing on `params`
-    promise: client => client.get('/v2/search', { params: { q: params.q, p: params.p } }),
+    promise: client => client.get('/api/v3/search', { params: { q: params.q, p: params.p } }),
     params
   };
 }
diff --git a/src/redux/actions/spec.js b/src/redux/actions/spec.js
index 42c5553de..98e0f55fc 100644
--- a/src/redux/actions/spec.js
+++ b/src/redux/actions/spec.js
@@ -1,10 +1,10 @@
 import * as audioplayerConstant from 'redux/constants/audioplayer.js';
-import * as ayahsConstants from 'redux/constants/ayahs.js';
-import * as surahsConstants from 'redux/constants/surahs.js';
+import * as ayahsConstants from 'redux/constants/verses.js';
+import * as surahsConstants from 'redux/constants/chapters.js';
 
 import * as audioplayerActions from './audioplayer.js';
 import * as ayahsActions from './ayahs.js';
-import * as surahsActions from './surahs.js';
+import * as surahsActions from './chapters.js';
 
 describe('action tests', () => {
   it('audioplayer actions', () => {
@@ -25,7 +25,7 @@ describe('action tests', () => {
     expect(ayahsActions.load(1, 2, 4).types.length).to.equal(3);
     expect(ayahsActions.clearCurrent().type).to.equal(ayahsConstants.CLEAR_CURRENT);
     expect(ayahsActions.clearCurrentWord(1).type).to.equal(ayahsConstants.CLEAR_CURRENT_WORD);
-    expect(ayahsActions.setCurrentAyah(1).type).to.equal(ayahsConstants.SET_CURRENT_AYAH);
+    expect(ayahsActions.setcurrentVerse(1).type).to.equal(ayahsConstants.SET_CURRENT_VERSE);
     expect(ayahsActions.setCurrentWord(1).type).to.equal(ayahsConstants.SET_CURRENT_WORD);
   });
 
diff --git a/src/redux/actions/ayahs.js b/src/redux/actions/verses.js
similarity index 63%
rename from src/redux/actions/ayahs.js
rename to src/redux/actions/verses.js
index 42ea2dda7..83e9ce4e3 100644
--- a/src/redux/actions/ayahs.js
+++ b/src/redux/actions/verses.js
@@ -1,15 +1,15 @@
 import cookie from 'react-cookie';
-import { ayahsSchema } from 'redux/schemas';
+import { versesSchema } from 'redux/schemas';
 
 import {
   LOAD,
   LOAD_SUCCESS,
   LOAD_FAIL,
   CLEAR_CURRENT,
-  SET_CURRENT_AYAH,
+  SET_CURRENT_VERSE,
   SET_CURRENT_WORD,
   CLEAR_CURRENT_WORD
-  } from 'redux/constants/ayahs.js';
+} from 'redux/constants/verses.js';
 
 // For safe measure
 const defaultOptions = {
@@ -21,21 +21,21 @@ const defaultOptions = {
 export function load(id, from, to, options = defaultOptions) {
   const { audio, quran, content } = options;
 
-  cookie.save('lastVisit', JSON.stringify({ surahId: id, ayahId: from }));
+  cookie.save('lastVisit', JSON.stringify({ chapterId: id, verseId: from }));
 
   return {
     types: [LOAD, LOAD_SUCCESS, LOAD_FAIL],
-    schema: [ayahsSchema],
-    promise: client => client.get(`/v2/surahs/${id}/ayahs`, {
+    schema: { verses: [versesSchema] },
+    promise: client => client.get(`/api/v3/chapters/${id}/verses`, {
       params: {
         from,
         to,
-        audio,
+        recitation: audio,
         quran,
-        content
+        translations: content
       }
     }),
-    surahId: id
+    chapterId: id
   };
 }
 
@@ -52,9 +52,9 @@ export function clearCurrentWord() {
   };
 }
 
-export function setCurrentAyah(id) {
+export function setcurrentVerse(id) {
   return {
-    type: SET_CURRENT_AYAH,
+    type: SET_CURRENT_VERSE,
     id
   };
 }
diff --git a/src/redux/constants/ayahs.js b/src/redux/constants/ayahs.js
deleted file mode 100644
index 4b215a3a8..000000000
--- a/src/redux/constants/ayahs.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export const LOAD = '@@quran/ayahs/LOAD';
-export const LOAD_SUCCESS = '@@quran/ayahs/LOAD_SUCCESS';
-export const LOAD_FAIL = '@@quran/ayahs/LOAD_FAIL';
-export const CLEAR_CURRENT = '@@quran/ayahs/CLEAR_CURRENT';
-export const SET_CURRENT_AYAH = '@@quran/ayahs/SET_CURRENT_AYAH';
-export const SET_CURRENT_WORD = '@@quran/ayahs/SET_CURRENT_WORD';
-export const CLEAR_CURRENT_WORD = '@@quran/ayahs/CLEAR_CURRENT_WORD';
diff --git a/src/redux/constants/surahs.js b/src/redux/constants/chapters.js
similarity index 100%
rename from src/redux/constants/surahs.js
rename to src/redux/constants/chapters.js
diff --git a/src/redux/constants/verses.js b/src/redux/constants/verses.js
new file mode 100644
index 000000000..5edcb3100
--- /dev/null
+++ b/src/redux/constants/verses.js
@@ -0,0 +1,7 @@
+export const LOAD = '@@quran/verses/LOAD';
+export const LOAD_SUCCESS = '@@quran/verses/LOAD_SUCCESS';
+export const LOAD_FAIL = '@@quran/verses/LOAD_FAIL';
+export const CLEAR_CURRENT = '@@quran/verses/CLEAR_CURRENT';
+export const SET_CURRENT_VERSE = '@@quran/verses/SET_CURRENT_VERSE';
+export const SET_CURRENT_WORD = '@@quran/verses/SET_CURRENT_WORD';
+export const CLEAR_CURRENT_WORD = '@@quran/verses/CLEAR_CURRENT_WORD';
diff --git a/src/redux/modules/audioplayer.js b/src/redux/modules/audioplayer.js
index ff46088be..a2c3b98fe 100644
--- a/src/redux/modules/audioplayer.js
+++ b/src/redux/modules/audioplayer.js
@@ -20,11 +20,11 @@ import {
   } from 'redux/constants/audioplayer.js';
 
 import {
-  LOAD_SUCCESS as AYAHS_LOAD_SUCCESS,
-  LOAD as AYAHS_LOAD,
-  CLEAR_CURRENT as AYAHS_CLEAR_CURRENT,
-  SET_CURRENT_AYAH
-  } from './ayahs';
+  LOAD_SUCCESS as VERSES_LOAD_SUCCESS,
+  LOAD as VERSES_LOAD,
+  CLEAR_CURRENT as VERSES_CLEAR_CURRENT,
+  SET_CURRENT_VERSE
+} from './verses';
 
 export { NEXT, SET_AYAH };
 
@@ -32,7 +32,7 @@ const initialState = {
   files: {},
   userAgent: null,
   currentFile: null,
-  currentAyah: null,
+  currentVerse: null,
   currentWord: null,
   currentTime: 0,
   isPlaying: false,
@@ -51,12 +51,12 @@ export default function reducer(state = initialState, action = {}) {
   switch (action.type) {
     case BUILD_ON_CLIENT: {
       debug('reducer:audioplayer', 'BUILD_ON_CLIENT init');
-      const audioFromHash = buildAudioFromHash(state.files[action.surahId], state.userAgent);
+      const audioFromHash = buildAudioFromHash(state.files[action.chapterId], state.userAgent);
 
       debug('reducer:audioplayer', 'BUILD_ON_CLIENT return');
 
       const stateFiles = state.files;
-      const filesById = stateFiles[action.surahId];
+      const filesById = stateFiles[action.chapterId];
       const filesFromHash = audioFromHash.files;
 
       return {
@@ -64,16 +64,16 @@ export default function reducer(state = initialState, action = {}) {
         isLoadedOnClient: true,
         files: {
           ...stateFiles,
-          [action.surahId]: {
+          [action.chapterId]: {
             ...filesById,
             ...filesFromHash
           }
         },
         currentFile: Object.values(audioFromHash.files)[0],
-        currentAyah: Object.keys(audioFromHash.files)[0]
+        currentVerse: Object.keys(audioFromHash.files)[0]
       };
     }
-    case AYAHS_CLEAR_CURRENT: {
+    case VERSES_CLEAR_CURRENT: {
       const stateFilesCurrent = state.files;
 
       return {
@@ -84,33 +84,33 @@ export default function reducer(state = initialState, action = {}) {
         }
       };
     }
-    case AYAHS_LOAD: {
+    case VERSES_LOAD: {
       return {
         ...state,
         isLoading: false
       };
     }
-    case AYAHS_LOAD_SUCCESS: {
-      debug('reducer:audioplayer', 'AYAHS_LOAD_SUCCESS init');
+    case VERSES_LOAD_SUCCESS: {
+      debug('reducer:audioplayer', 'VERSES_LOAD_SUCCESS init');
 
-      const ayahs = action.result.entities.ayahs;
-      const audioFromHash = __CLIENT__ ? buildAudioFromHash(ayahs, state.userAgent) : ayahs;
+      const verses = action.result.entities.verses;
+      const audioFromHash = __CLIENT__ ? buildAudioFromHash(verses, state.userAgent) : verses;
       const files = Object.assign(
         {},
-        state.files[action.surahId],
+        state.files[action.chapterId],
         __CLIENT__ ? audioFromHash.files : audioFromHash
       );
 
-      const currentAyah = state.currentAyah ? state.currentAyah : Object.keys(files)[0];
+      const currentVerse = state.currentVerse ? state.currentVerse : Object.keys(files)[0];
 
       let currentFile;
       if (state.currentFile && state.currentFile === Object.values(files)[0]) {
         // If the same file is being used, for example in lazy loading, then keep same file
         currentFile = state.currentFile;
-      } else if (state.currentAyah || currentAyah) {
+      } else if (state.currentVerse || currentVerse) {
         // If the user changes the reciter, we want to maintain the file where
         // the user last left off
-        currentFile = files[state.currentAyah || currentAyah];
+        currentFile = files[state.currentVerse || currentVerse];
       } else {
         // Otherwise, just choose the first file
         currentFile = Object.values(files)[0];
@@ -119,20 +119,20 @@ export default function reducer(state = initialState, action = {}) {
       const stateFiles = state.files;
       const stateSegments = state.segments;
 
-      debug('reducer:audioplayer', 'AYAHS_LOAD_SUCCESS return');
+      debug('reducer:audioplayer', 'VERSES_LOAD_SUCCESS return');
       return {
         ...state,
-        currentAyah,
+        currentVerse,
         currentFile,
-        surahId: action.surahId,
+        chapterId: action.chapterId,
         isLoadedOnClient: __CLIENT__,
         files: {
           ...stateFiles,
-          [action.surahId]: files
+          [action.chapterId]: files
         },
         segments: {
           ...stateSegments,
-          [action.surahId]: extractSegments(action.result.entities.ayahs)
+          [action.chapterId]: extractSegments(action.result.entities.verses)
         }
       };
     }
@@ -174,35 +174,35 @@ export default function reducer(state = initialState, action = {}) {
       return state;
     }
     case NEXT: {
-      const [surahId, ayahNum] = action.currentAyah.split(':');
-      const nextId = `${surahId}:${parseInt(ayahNum, 10) + 1}`;
+      const [chapterId, ayahNum] = action.currentVerse.split(':');
+      const nextId = `${chapterId}:${parseInt(ayahNum, 10) + 1}`;
 
       return {
         ...state,
-        currentAyah: nextId,
-        currentFile: state.files[surahId][nextId],
+        currentVerse: nextId,
+        currentFile: state.files[chapterId][nextId],
         currentTime: 0
       };
     }
     case PREVIOUS: {
-      const [surahId, ayahNum] = action.currentAyah.split(':');
-      const nextId = `${surahId}:${parseInt(ayahNum, 10) - 1}`;
+      const [chapterId, ayahNum] = action.currentVerse.split(':');
+      const nextId = `${chapterId}:${parseInt(ayahNum, 10) - 1}`;
 
       return {
         ...state,
-        currentAyah: nextId,
-        currentFile: state.files[surahId][nextId],
+        currentVerse: nextId,
+        currentFile: state.files[chapterId][nextId],
         currentTime: 0
       };
     }
     case SET_AYAH: {
-      const [surahId, ayahNum] = action.currentAyah.split(':');
-      const currentAyah = `${surahId}:${parseInt(ayahNum, 10)}`;
-      const currentFile = state.files[surahId][currentAyah];
+      const [chapterId, ayahNum] = action.currentVerse.split(':');
+      const currentVerse = `${chapterId}:${parseInt(ayahNum, 10)}`;
+      const currentFile = state.files[chapterId][currentVerse];
 
       return {
         ...state,
-        currentAyah,
+        currentVerse,
         currentFile,
         currentTime: 0
       };
@@ -229,12 +229,12 @@ export default function reducer(state = initialState, action = {}) {
     case SET_CURRENT_WORD: {
       if (!action.word) return state;
       let currentTime = null;
-      const [surahId, ayahNum, word] = action.word.split(':');
-      const nextId = `${surahId}:${ayahNum}`;
-      if (!state.segments[surahId][nextId]) return state;
-      if (state.files[surahId][nextId] === state.currentFile) {
+      const [chapterId, ayahNum, word] = action.word.split(':');
+      const nextId = `${chapterId}:${ayahNum}`;
+      if (!state.segments[chapterId][nextId]) return state;
+      if (state.files[chapterId][nextId] === state.currentFile) {
         // When the files are the same, set the current time to that word
-        currentTime = state.segments[surahId][nextId].words[word].startTime;
+        currentTime = state.segments[chapterId][nextId].words[word].startTime;
         state.currentFile.currentTime = currentTime; // eslint-disable-line no-param-reassign
 
         return {
@@ -245,23 +245,23 @@ export default function reducer(state = initialState, action = {}) {
       }
 
       // When the files are not the same.
-      const currentFile = state.files[surahId][nextId];
-      const segment = buildSegments(state.segments[surahId][nextId]);
+      const currentFile = state.files[chapterId][nextId];
+      const segment = buildSegments(state.segments[chapterId][nextId]);
       currentTime = segment.words[word].startTime;
       currentFile.currentTime = currentTime;
       const stateSegments = state.segments;
-      const stateSegmentsId = state.segments[surahId];
+      const stateSegmentsId = state.segments[chapterId];
 
       return {
         ...state,
         currentWord: action.word,
-        currentAyah: nextId,
+        currentVerse: nextId,
         isPlaying: false,
         currentTime,
         currentFile,
         segments: {
           ...stateSegments,
-          [surahId]: {
+          [chapterId]: {
             ...stateSegmentsId,
             [nextId]: segment
           }
@@ -272,14 +272,14 @@ export default function reducer(state = initialState, action = {}) {
       if (!action.payload) return state;
 
       const { word, position } = action.payload;
-      const [surahId, ayahNum] = word.ayahKey.split(':');
-      const nextId = `${surahId}:${ayahNum}`;
-      const currentFile = state.files[surahId][nextId];
+      const [chapterId, ayahNum] = word.verseKey.split(':');
+      const nextId = `${chapterId}:${ayahNum}`;
+      const currentFile = state.files[chapterId][nextId];
 
-      if (!state.segments[surahId][nextId].words[position]) return state;
+      if (!state.segments[chapterId][nextId].words[position]) return state;
 
-      const currentTime = state.segments[surahId][nextId].words[position].startTime;
-      const endTime = state.segments[surahId][nextId].words[position].endTime;
+      const currentTime = state.segments[chapterId][nextId].words[position].startTime;
+      const endTime = state.segments[chapterId][nextId].words[position].endTime;
       currentFile.currentTime = currentTime;
 
       const int = setInterval(() => {
@@ -295,10 +295,10 @@ export default function reducer(state = initialState, action = {}) {
         currentWord: word
       };
     }
-    case SET_CURRENT_AYAH: {
+    case SET_CURRENT_VERSE: {
       return {
         ...state,
-        currentAyah: action.id
+        currentVerse: action.id
       };
     }
     default: {
diff --git a/src/redux/modules/bookmarks.js b/src/redux/modules/bookmarks.js
index 78be0e1a5..53e3e309a 100644
--- a/src/redux/modules/bookmarks.js
+++ b/src/redux/modules/bookmarks.js
@@ -30,7 +30,7 @@ export default function reducer(state = initialState, action = {}) {
         ...state,
         entities: {
           ...state.entities,
-          [action.ayahKey]: action.result
+          [action.verseKey]: action.result
         }
       };
     }
@@ -40,7 +40,7 @@ export default function reducer(state = initialState, action = {}) {
         ...state,
         entities: {
           ...state.entities,
-          [action.ayahKey]: null
+          [action.verseKey]: null
         }
       };
     }
diff --git a/src/redux/modules/surahs.js b/src/redux/modules/chapters.js
similarity index 86%
rename from src/redux/modules/surahs.js
rename to src/redux/modules/chapters.js
index 7acbcada2..17ae67e1e 100644
--- a/src/redux/modules/surahs.js
+++ b/src/redux/modules/chapters.js
@@ -4,7 +4,7 @@ import {
   LOAD_INFO,
   LOAD_INFO_SUCCESS,
   SET_CURRENT
-} from 'redux/constants/surahs.js';
+} from 'redux/constants/chapters.js';
 
 const initialState = {
   errored: false,
@@ -24,14 +24,14 @@ export default function reducer(state = initialState, action = {}) {
       };
     case LOAD_SUCCESS: {
       const entities = state.entities;
-      const { surahs } = action.result.entities;
+      const { chapters } = action.result.entities;
       return {
         ...state,
         loaded: true,
         errored: false,
         entities: {
           ...entities,
-          ...surahs
+          ...chapters
         }
       };
     }
@@ -49,7 +49,7 @@ export default function reducer(state = initialState, action = {}) {
           ...state.entities,
           [action.id]: {
             ...state.entities[action.id],
-            info: action.result
+            info: action.result.chapterInfo
           }
         }
       };
diff --git a/src/redux/modules/fontFaces.js b/src/redux/modules/fontFaces.js
index 194321808..07e59d857 100644
--- a/src/redux/modules/fontFaces.js
+++ b/src/redux/modules/fontFaces.js
@@ -1,4 +1,4 @@
-import { LOAD_SUCCESS } from 'redux/constants/ayahs.js';
+import { LOAD_SUCCESS } from 'redux/constants/verses.js';
 import { SEARCH_SUCCESS } from 'redux/constants/search.js';
 import LOAD from 'redux/constants/fontFace.js';
 
@@ -6,14 +6,14 @@ export default function reducer(state = {}, action = {}) {
   switch (action.type) {
     case LOAD_SUCCESS:
     case SEARCH_SUCCESS: {
-      const ayahs = action.result.entities.ayahs;
+      const verses = action.result.entities.verses;
       const classNames = {};
 
-      Object.keys(ayahs).forEach((ayahId) => {
-        const ayah = ayahs[ayahId];
+      Object.keys(verses).forEach((ayahId) => {
+        const verse = verses[ayahId];
 
-        if (!state[`p${ayah.pageNum}`]) {
-          classNames[`p${ayah.pageNum}`] = false;
+        if (!state[`p${verse.pageNumber}`]) {
+          classNames[`p${verse.pageNumber}`] = false;
         }
       });
 
diff --git a/src/redux/modules/lines.js b/src/redux/modules/lines.js
index 7f5c50177..fa9974627 100644
--- a/src/redux/modules/lines.js
+++ b/src/redux/modules/lines.js
@@ -3,9 +3,9 @@ import {
   LOAD as AYAHS_LOAD,
   LOAD_SUCCESS as AYAHS_LOAD_SUCCESS,
   LOAD_FAIL as AYAHS_LOAD_FAIL,
-  } from 'redux/constants/ayahs.js';
+  } from 'redux/constants/verses.js';
 
-import { SET_CURRENT as SURAHS_SET_CURRENT } from 'redux/constants/surahs.js';
+import { SET_CURRENT as SURAHS_SET_CURRENT } from 'redux/constants/chapters.js';
 
 const initialState = {
   lines: {}
@@ -25,18 +25,18 @@ export default function reducer(state = initialState, action = {}) {
         loading: true
       };
     case AYAHS_LOAD_SUCCESS:
-      const ayahs = action.result.entities.ayahs;
+      const ayahs = action.result.entities.verses;
       const stateLines = state.lines;
       const lines = { ...stateLines };
 
-      action.result.result.forEach((ayahId) => {
+      action.result.result.verses.forEach((ayahId) => {
         const ayah = ayahs[ayahId];
 
         ayah.words.forEach((word) => {
           if (lines[`${word.pageNum}-${word.lineNum}`]) {
             const isInArray = lines[`${word.pageNum}-${word.lineNum}`].find((item) => {
-              const itemChecksum = `${item.lineNum}${item.code}${item.ayahKey}${item.position}`;
-              const dataChecksum = `${word.lineNum}${word.code}${word.ayahKey}${item.position}`;
+              const itemChecksum = `${item.lineNum}${item.code}${item.verseKey}${item.position}`;
+              const dataChecksum = `${word.lineNum}${word.code}${word.verseKey}${item.position}`;
 
               return itemChecksum === dataChecksum;
             });
diff --git a/src/redux/modules/reducer.js b/src/redux/modules/reducer.js
index 8aaa4e473..6ebcf4625 100644
--- a/src/redux/modules/reducer.js
+++ b/src/redux/modules/reducer.js
@@ -2,8 +2,8 @@ import { combineReducers } from 'redux';
 import { routerReducer } from 'react-router-redux';
 import { reducer as reduxAsyncConnect } from 'redux-connect';
 
-import surahs from './surahs';
-import ayahs from './ayahs';
+import chapters from './chapters';
+import verses from './verses';
 import audioplayer from './audioplayer';
 import lines from './lines';
 import options from './options';
@@ -20,8 +20,8 @@ export default combineReducers({
   auth,
   bookmarks,
   media,
-  surahs,
-  ayahs,
+  chapters,
+  verses,
   audioplayer,
   fontFaces,
   lines,
diff --git a/src/redux/modules/searchResults.js b/src/redux/modules/searchResults.js
index 8f487c552..7451f8d51 100644
--- a/src/redux/modules/searchResults.js
+++ b/src/redux/modules/searchResults.js
@@ -34,7 +34,7 @@ export default function reducer(state = initialState, action = {}) {
         took: action.result.result.took,
         query: action.result.result.query,
         results: action.result.result.results,
-        entities: Object.assign({}, state.entities, action.result.entities.ayahs)
+        entities: Object.assign({}, state.entities, action.result.entities.verses)
       };
     case SEARCH_FAIL:
       return {
diff --git a/src/redux/modules/ayahs.js b/src/redux/modules/verses.js
similarity index 77%
rename from src/redux/modules/ayahs.js
rename to src/redux/modules/verses.js
index c02059179..f3b000683 100644
--- a/src/redux/modules/ayahs.js
+++ b/src/redux/modules/verses.js
@@ -3,16 +3,16 @@ import {
   LOAD_SUCCESS,
   LOAD_FAIL,
   CLEAR_CURRENT,
-  SET_CURRENT_AYAH,
+  SET_CURRENT_VERSE,
   SET_CURRENT_WORD,
   CLEAR_CURRENT_WORD
-  } from 'redux/constants/ayahs.js';
+} from 'redux/constants/verses.js';
 
 export {
   LOAD,
   LOAD_SUCCESS,
   CLEAR_CURRENT,
-  SET_CURRENT_AYAH,
+  SET_CURRENT_VERSE,
 };
 
 const initialState = {
@@ -27,7 +27,7 @@ const initialState = {
 
 export default function reducer(state = initialState, action = {}) {
   switch (action.type) {
-    case SET_CURRENT_AYAH: {
+    case SET_CURRENT_VERSE: {
       return {
         ...state,
         current: action.id,
@@ -35,15 +35,15 @@ export default function reducer(state = initialState, action = {}) {
       };
     }
     case SET_CURRENT_WORD: {
-      let currentAyah = state.current;
-      if (action.id && currentAyah) {
-        if (!(new RegExp(`^${currentAyah}:`)).test(action.id)) {
-          currentAyah = action.id.match(/^\d+:\d+/g)[0];
+      let currentVerse = state.current;
+      if (action.id && currentVerse) {
+        if (!(new RegExp(`^${currentVerse}:`)).test(action.id)) {
+          currentVerse = action.id.match(/^\d+:\d+/g)[0];
         }
       }
       return {
         ...state,
-        current: currentAyah,
+        current: currentVerse,
         currentWord: action.id
       };
     }
@@ -84,10 +84,10 @@ export default function reducer(state = initialState, action = {}) {
         errored: false,
         entities: {
           ...stateEntities,
-          [action.surahId]: Object.assign(
+          [action.chapterId]: Object.assign(
             {},
-            state.entities[action.surahId],
-            action.result.entities.ayahs
+            state.entities[action.chapterId],
+            action.result.entities.verses
           )
         },
         result: Object.assign({}, state.result, action.result.result)
diff --git a/src/redux/schemas.js b/src/redux/schemas.js
index a386b5696..031d4ea16 100644
--- a/src/redux/schemas.js
+++ b/src/redux/schemas.js
@@ -1,12 +1,12 @@
 import { schema } from 'normalizr';
 
-export const surahsSchema = new schema.Entity('surahs');
-export const ayahsSchema = new schema.Entity('ayahs', {}, { idAttribute: 'ayahKey' });
-export const bookmarksSchema = new schema.Entity('bookmarks', {}, { idAttribute: 'ayahKey' });
+export const chaptersSchema = new schema.Entity('chapters', {}, { idAttribute: 'id' });
+export const versesSchema = new schema.Entity('verses', {}, { idAttribute: 'id' });
+export const bookmarksSchema = new schema.Entity('bookmarks', {}, { idAttribute: 'verseKey' });
 
 const schemas = {
-  surahsSchema,
-  ayahsSchema,
+  chaptersSchema,
+  versesSchema,
   bookmarksSchema
 };
 
diff --git a/src/routes.js b/src/routes.js
index 49fb0e656..46ed76d1d 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -60,10 +60,10 @@ export default (store) => {
         <Route path="/profile" getComponent={(nextState, cb) => System.import('./containers/Profile').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
       </Route>
 
-      <Redirect from="/:surahId:(:range)" to="/:surahId(/:range)" />
+      <Redirect from="/:chapterId:(:range)" to="/:chapterId(/:range)" />
 
       <Route
-        path="/:surahId(/:range)"
+        path="/:chapterId(/:range)"
         getComponents={(nextState, cb) =>
           Promise.all([
             System.import('./containers/Surah'),
diff --git a/src/server/config/sitemap.js b/src/server/config/sitemap.js
index 234182950..0c58d7922 100644
--- a/src/server/config/sitemap.js
+++ b/src/server/config/sitemap.js
@@ -7,26 +7,26 @@ export default (server) => {
     const client = new ApiClient(req);
     const urls = [];
 
-    client.get('/api/v2/surahs').then((surahs) => {
-      surahs.forEach((surah) => {
-        Array(surah.ayat).fill().forEach((_, index) => {
+    client.get('/api/v3/chapters').then((response) => {
+      response.chapters.forEach((chapter) => {
+        Array(chapter.versesCount).fill().forEach((_, index) => {
           const ayahId = index + 1;
 
           urls.push({
-            url: `/${surah.id}/${ayahId}`,
+            url: `/${chapter.chapterNumber}/${ayahId}`,
             changefreq: 'weekly',
             priority: 1
           });
 
           urls.push({
-            url: `/${surah.id}/${ayahId}-${ayahId + 9}`,
+            url: `/${chapter.chapterNumber}/${ayahId}-${ayahId + 9}`,
             changefreq: 'weekly',
             priority: 1
           });
         });
 
         urls.push({
-          url: `/${surah.id}`,
+          url: `/${chapter.chapterNumber}`,
           changefreq: 'weekly',
           priority: 1
         });
diff --git a/src/styles/nightmode.scss b/src/styles/nightmode.scss
index d0f562ae7..b5da92a82 100644
--- a/src/styles/nightmode.scss
+++ b/src/styles/nightmode.scss
@@ -14,7 +14,7 @@
     background-color: #2d2d2d;
   }
 
-  .surah-info, .tooltip, .dropdown-menu, .popover-content{
+  .chapter-info, .tooltip, .dropdown-menu, .popover-content{
     color: #000;
   }
 
diff --git a/src/types/ayahType.js b/src/types/ayahType.js
deleted file mode 100644
index 52ae4d8a8..000000000
--- a/src/types/ayahType.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import { PropTypes } from 'react';
-import wordType from './wordType';
-
-export default PropTypes.shape({
-  ayahIndex: PropTypes.number.isRequired,
-  surahId: PropTypes.number.isRequired,
-  ayahNum: PropTypes.number.isRequired,
-  pageNum: PropTypes.number.isRequired,
-  juzNum: PropTypes.number.isRequired,
-  hizbNum: PropTypes.number.isRequired,
-  rubNum: PropTypes.number.isRequired,
-  text: PropTypes.string.isRequired,
-  ayahKey: PropTypes.string.isRequired,
-  sajdah: PropTypes.bool,
-  words: PropTypes.arrayOf(wordType).isRequired,
-  textTashkeel: PropTypes.string.isRequired,
-  content: PropTypes.array, // NOTE: In search, it is not required.
-  audio: PropTypes.object // NOTE: In search, it is not required.
-});
diff --git a/src/types/bookmarkType.js b/src/types/bookmarkType.js
index 5a9ceff51..b33c50434 100644
--- a/src/types/bookmarkType.js
+++ b/src/types/bookmarkType.js
@@ -2,7 +2,7 @@ import { PropTypes } from 'react';
 
 export default PropTypes.shape({
   id: PropTypes.string.isRequired,
-  ayahKey: PropTypes.string.isRequired,
+  verseKey: PropTypes.string.isRequired,
   createdAt: PropTypes.string.isRequired,
   updatedAt: PropTypes.string.isRequired,
 });
diff --git a/src/types/index.js b/src/types/index.js
index 5ab2cfd78..1b0d1e2fc 100644
--- a/src/types/index.js
+++ b/src/types/index.js
@@ -1,4 +1,4 @@
-export { default as ayahType } from './ayahType';
+export { default as verseType } from './verseType';
 export { default as surahType } from './surahType';
 export { default as userType } from './userType';
 export { default as optionsType } from './optionsType';
diff --git a/src/types/surahType.js b/src/types/surahType.js
index c4a42304c..121e48d21 100644
--- a/src/types/surahType.js
+++ b/src/types/surahType.js
@@ -1,21 +1,13 @@
 import { PropTypes } from 'react';
 
 export default PropTypes.shape({
-  surahId: PropTypes.number.isRequired,
-  ayat: PropTypes.number.isRequired,
+  id: PropTypes.number.isRequired,
+  versesCount: PropTypes.number.isRequired,
   bismillahPre: PropTypes.bool.isRequired,
   revelationOrder: PropTypes.number.isRequired,
   revelationPlace: PropTypes.string.isRequired,
-  page: PropTypes.array.isRequired,
-  name: PropTypes.shape({
-    complex: PropTypes.string.isRequired,
-    simple: PropTypes.string.isRequired,
-    english: PropTypes.string.isRequired,
-    arabic: PropTypes.string.isRequired,
-  }).isRequired,
-  revelation: PropTypes.shape({
-    order: PropTypes.number,
-    place: PropTypes.string
-  }).isRequired,
-  id: PropTypes.number.isRequired,
+  pages: PropTypes.arrayOf(PropTypes.number).isRequired,
+  nameComplex: PropTypes.string.isRequired,
+  nameSimple: PropTypes.string.isRequired,
+  nameArabic: PropTypes.string.isRequired,
 });
diff --git a/src/types/verseType.js b/src/types/verseType.js
new file mode 100644
index 000000000..f2ecc7203
--- /dev/null
+++ b/src/types/verseType.js
@@ -0,0 +1,19 @@
+import { PropTypes } from 'react';
+import wordType from './wordType';
+
+export default PropTypes.shape({
+  id: PropTypes.number.isRequired,
+  chapterId: PropTypes.number.isRequired,
+  pageNumber: PropTypes.number.isRequired,
+  juzNumber: PropTypes.number.isRequired,
+  hizbNumber: PropTypes.number.isRequired,
+  rubNumber: PropTypes.number.isRequired,
+  verseKey: PropTypes.string.isRequired,
+  sajdah: PropTypes.bool,
+  words: PropTypes.arrayOf(wordType).isRequired,
+  textTashkeel: PropTypes.string.isRequired,
+  textMadani: PropTypes.string.isRequired,
+  textSimple: PropTypes.string.isRequired,
+  content: PropTypes.array, // NOTE: In search, it is not required.
+  audio: PropTypes.object // NOTE: In search, it is not required.
+});
diff --git a/src/types/wordType.js b/src/types/wordType.js
index 1dfc3f4ac..af5285254 100644
--- a/src/types/wordType.js
+++ b/src/types/wordType.js
@@ -2,17 +2,21 @@ import { PropTypes } from 'react';
 
 export default PropTypes.shape({
   arabic: PropTypes.string,
-  ayahKey: PropTypes.string.isRequired,
-  charTypeId: PropTypes.number.isRequired,
+  verseKey: PropTypes.string.isRequired,
+  charType: PropTypes.string.isRequired,
   className: PropTypes.string.isRequired,
   code: PropTypes.string.isRequired,
-  codeDec: PropTypes.number.isRequired,
-  codeHex: PropTypes.string.isRequired,
-  lineNum: PropTypes.number.isRequired,
-  pageNum: PropTypes.number.isRequired,
+  lineNumber: PropTypes.number.isRequired,
+  pageNumber: PropTypes.number.isRequired,
   position: PropTypes.number.isRequired,
   resourceId: PropTypes.number.isRequired,
-  translation: PropTypes.string,
-  transliteration: PropTypes.string,
+  translation: PropTypes.shape({
+    languageName: PropTypes.string,
+    text: PropTypes.string
+  }),
+  transliteration: PropTypes.shape({
+    languageName: PropTypes.string,
+    text: PropTypes.string
+  }),
   wordId: PropTypes.number,
 });
diff --git a/src/utils/checkValidSurah.js b/src/utils/checkValidSurah.js
index 1e88257a2..28268220d 100644
--- a/src/utils/checkValidSurah.js
+++ b/src/utils/checkValidSurah.js
@@ -1,17 +1,18 @@
 export default function isValidSurah(nextState, replaceState) {
-  const surahId = parseInt(nextState.params.surahId, 10);
+  const chapterId = parseInt(nextState.params.chapterId, 10);
 
-  if (isNaN(surahId) || surahId > 114 || surahId < 1) {
+  if (isNaN(chapterId) || chapterId > 114 || chapterId < 1) {
     replaceState('/error/invalid-surah');
   }
 
   if (nextState.params.range) {
     if (nextState.params.range.includes('-')) {
       const [from, to] = nextState.params.range.split('-').map(num => parseInt(num, 10));
+
       if (from > to) {
-        replaceState(`/${surahId}/${to}-${from}`);
+        replaceState(`/${chapterId}/${to}-${from}`);
       } else if (from === to) {
-        replaceState(`/${surahId}/${from}`);
+        replaceState(`/${chapterId}/${from}`);
       }
       // TODO: Add check to make sure the range is within the ayah limit
     }
diff --git a/tests/fixtures/ayah.json b/tests/fixtures/ayah.json
index 3f7c1bc26..fd83ab92e 100644
--- a/tests/fixtures/ayah.json
+++ b/tests/fixtures/ayah.json
@@ -1,7 +1,7 @@
 {
-  "ayahKey": "2:1",
+  "verseKey": "2:1",
   "ayahIndex": 8,
-  "surahId": 2,
+  "chapterId": 2,
   "ayahNum": 1,
   "pageNum": 2,
   "juzNum": 1,
@@ -12,7 +12,7 @@
   "sajdah": null,
   "words": [
     {
-      "ayahKey": "2:1",
+      "verseKey": "2:1",
       "resourceId": 1,
       "position": 1,
       "wordId": 30,
@@ -20,7 +20,7 @@
       "lineNum": 3,
       "codeDec": 64337,
       "codeHex": "fb51",
-      "charTypeId": 1,
+      "charType": 1,
       "className": "p2",
       "code": "&#xfb51",
       "tokenId": 16542,
@@ -28,7 +28,7 @@
       "transliteration": "alif-lam-meem"
     },
     {
-      "ayahKey": "2:1",
+      "verseKey": "2:1",
       "resourceId": 1,
       "position": 2,
       "wordId": null,
@@ -36,7 +36,7 @@
       "lineNum": 3,
       "codeDec": 64338,
       "codeHex": "fb52",
-      "charTypeId": 2,
+      "charType": 2,
       "className": "p2",
       "code": "&#xfb52"
     }
diff --git a/tests/functional/pageobjects/HomePage.js b/tests/functional/pageobjects/HomePage.js
index f0d282122..6f1e7c376 100644
--- a/tests/functional/pageobjects/HomePage.js
+++ b/tests/functional/pageobjects/HomePage.js
@@ -26,8 +26,8 @@ export default class HomePage extends BasePage {
 
   clickOntheSurahByNumber(number) {
     const surahs = browser.elements('.row .col-xs-7 span');
-    const surahID = surahs.value[number].ELEMENT;
-    browser.elementIdClick(surahID);
+    const chapterId = surahs.value[number].ELEMENT;
+    browser.elementIdClick(chapterId);
     return browser.getUrl();
   }
 }