quran · mmahalwy · Jan 22, 2017 · Jan 21, 2017 · Jan 22, 2017 · Jan 22, 2017
diff --git a/.babelrc b/.babelrc
@@ -2,7 +2,6 @@
   "presets": ["react", "es2015", "stage-0"],
   "plugins": [
     "transform-runtime",
-    "add-module-exports",
     "transform-decorators-legacy",
     "transform-react-display-name",
     ["system-import-transformer", {"modules": "common"}]

diff --git a/bin/server.js b/bin/server.js
@@ -34,5 +34,5 @@ if (__DEVELOPMENT__) {
 global.webpack_isomorphic_tools = new webpackIsomorphicTools(require('../webpack/isomorphic-tools-configuration'))
 .development(process.env.NODE_ENV === 'development')
 .server(rootDir, function() {
-  require('../src/server.js')();
+  require('../src/server.js').default();
 });
diff --git a/src/components/GlobalNav/Surah/index.js b/src/components/GlobalNav/Surah/index.js
@@ -1,10 +1,12 @@
 import React, { PropTypes } from 'react';
 import { connect } from 'react-redux';
+import Link from 'react-router/lib/Link';
 import NavDropdown from 'react-bootstrap/lib/NavDropdown';
 
 import { surahType, optionsType } from 'types';
 import * as OptionsActions from 'redux/actions/options.js';
 
+import SearchInput from 'components/SearchInput';
 import SurahsDropdown from 'components/SurahsDropdown';
 import ReadingModeToggle from 'components/ReadingModeToggle';
 import NightModeToggle from 'components/NightModeToggle';
@@ -39,7 +41,15 @@ const GlobalNavSurah = ({ surah, surahs, setOption, options, ...props }) => (
           onToggle={setOption}
         />
         <NightModeToggle />
-      </NavDropdown>
+      </NavDropdown>,
+      <div className="navbar-form navbar-left hidden-xs hidden-sm">
+        <SearchInput className="search-input" />
+      </div>,
+      <li className="visible-xs-inline-block visible-sm-inline-block">
+        <Link to="/search">
+          <i className="ss-icon ss-search" style={{ verticalAlign: 'sub' }} />
+        </Link>
+      </li>
     ]}
     rightControls={[
       <FontSizeDropdown

diff --git a/src/containers/Search/index.js b/src/containers/Search/index.js
@@ -33,6 +33,10 @@ class Search extends Component {
     results: PropTypes.array, // eslint-disable-line
     ayahs: PropTypes.objectOf(ayahType),
     push: PropTypes.func.isRequired,
+    location: PropTypes.shape({
+      q: PropTypes.string,
+      p: PropTypes.string
+    }),
     options: optionsType
   };
 
@@ -117,7 +121,15 @@ class Search extends Component {
   }
 
   renderBody() {
-    const { isErrored, isLoading, results, options, ayahs } = this.props;
+    const { location, isErrored, isLoading, results, options, ayahs } = this.props;
+
+    if (!location.q) {
+      return (
+        <h3 className="text-center" style={{ padding: '15%' }}>
+          <LocaleFormattedMessage id="search.nothing" defaultMessage="No search query." />
+        </h3>
+      );
+    }
 
     if (isErrored) {
       return (

diff --git a/src/containers/Surah/Header/index.js b/src/containers/Surah/Header/index.js
@@ -9,9 +9,6 @@ import surahType from 'types/surahType';
 
 const Header = Navbar.Header;
 
-// const ornamentLeft = require('../../../../static/images/ornament-left.png');
-// const ornamentRight = require('../../../../static/images/ornament-right.png');
-
 const styles = require('./style.scss');
 
 const SurahHeader = ({ surah, handleToggleSidebar }) => {

diff --git a/src/locale/ar.js b/src/locale/ar.js
@@ -32,6 +32,7 @@ export default {
     'search.placeholder': 'بحث',
     'search.resultHeading': '{from}-{to} OF <span> {total} </span> SEARCH RESULTS FOR: <span>{query}</span>', // eslint-disable-line max-len
     'search.error': 'آسف، كان هناك خطأ مع بحثك.',
+    'search.nothing': 'لا استعلام البحث',
     'search.noResult': 'لا توجد نتائج.ا',
 
     'surah.next': 'تالية سورة',

diff --git a/src/locale/en.js b/src/locale/en.js
@@ -18,7 +18,7 @@ export default {
     'setting.fontSize.arabic': 'Arabic',
     'setting.reading': 'Reading',
     'setting.tooltip': 'Tooltip content',
-    'setting.tooltip.title': 'TOOLTIP DISPLAY',
+    'setting.tooltip.title': 'Tooltip display',
     'setting.tooltip.translation': 'Translation',
     'setting.tooltip.transliteration': 'Transliteration',
     'setting.nightMode': 'Night Mode',
@@ -32,6 +32,7 @@ export default {
     'search.placeholder': 'Search "Noah"',
     'search.resultHeading': '{from}-{to} OF <span> {total} </span> SEARCH RESULTS FOR: <span>{query}</span>', // eslint-disable-line max-len
     'search.error': 'Sorry, there was an error with your search.',
+    'search.nothing': 'No search query.',
     'search.noResult': 'No results found.',
 
     'surah.next': 'NEXT',

diff --git a/src/locale/ur.js b/src/locale/ur.js
@@ -32,6 +32,7 @@ export default {
     'search.placeholder': 'تلاش کر یں',
     'search.resultHeading': '{from}-{to} OF <span> {total} </span> SEARCH RESULTS FOR: <span>{query}</span>', // eslint-disable-line max-len
     'search.error': 'معذرت، آپ کی تلاش کے ساتھ ایک خرابی پیش آگئی.',
+    'search.nothing': 'تلاش کے لئے کچھ لکھئے',
     'search.noResult': 'کوئی نتیجہ نہیں ملا',
 
     'surah.next': 'اگلی سورت',

diff --git a/src/redux/create.js b/src/redux/create.js
@@ -11,7 +11,7 @@ export default function createStore(history, client, data) {
   let finalCreateStore;
   if (__DEVELOPMENT__ && __CLIENT__ && __DEVTOOLS__) {
     const { persistState } = require('redux-devtools');
-    const DevTools = require('../containers/DevTools');
+    const DevTools = require('../containers/DevTools').default;
 
     finalCreateStore = compose(
       applyMiddleware(...middleware),

diff --git a/src/routes.js b/src/routes.js
@@ -1,4 +1,4 @@
-/* eslint-disable max-len */
+/* eslint-disable max-len, no-console */
 import React from 'react';
 import IndexRoute from 'react-router/lib/IndexRoute';
 import Route from 'react-router/lib/Route';
@@ -39,25 +39,25 @@ export default (store) => {
   return (
     <Route path="/" component={App} onEnter={shouldAuth}>
       <IndexRoute components={Home} />
-      <Route path="/donations" getComponent={(nextState, cb) => System.import('./containers/Donations').then(module => cb(null, module))} />
-      <Route path="/contributions" getComponent={(nextState, cb) => System.import('./containers/Donations').then(module => cb(null, module))} />
+      <Route path="/donations" getComponent={(nextState, cb) => System.import('./containers/Donations').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
+      <Route path="/contributions" getComponent={(nextState, cb) => System.import('./containers/Donations').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/about" getComponent={(nextState, cb) => System.import('./containers/About').then(module => cb(null, module))} />
+      <Route path="/about" getComponent={(nextState, cb) => System.import('./containers/About').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/contact" getComponent={(nextState, cb) => System.import('./containers/Contact').then(module => cb(null, module))} />
-      <Route path="/contactus" getComponent={(nextState, cb) => System.import('./containers/Contact').then(module => cb(null, module))} />
+      <Route path="/contact" getComponent={(nextState, cb) => System.import('./containers/Contact').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
+      <Route path="/contactus" getComponent={(nextState, cb) => System.import('./containers/Contact').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/mobile" getComponent={(nextState, cb) => System.import('./containers/MobileLanding').then(module => cb(null, module))} />
-      <Route path="/apps" getComponent={(nextState, cb) => System.import('./containers/MobileLanding').then(module => cb(null, module))} />
+      <Route path="/mobile" getComponent={(nextState, cb) => System.import('./containers/MobileLanding').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
+      <Route path="/apps" getComponent={(nextState, cb) => System.import('./containers/MobileLanding').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/error/:errorKey" getComponent={(nextState, cb) => System.import('./containers/Error').then(module => cb(null, module))} />
+      <Route path="/error/:errorKey" getComponent={(nextState, cb) => System.import('./containers/Error').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/search" getComponent={(nextState, cb) => System.import('./containers/Search').then(module => cb(null, module))} />
+      <Route path="/search" getComponent={(nextState, cb) => System.import('./containers/Search').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
-      <Route path="/login" getComponent={(nextState, cb) => System.import('./containers/Login').then(module => cb(null, module))} />
+      <Route path="/login" getComponent={(nextState, cb) => System.import('./containers/Login').then(module => cb(null, module.default)).catch(err => console.trace(err))} />
 
       <Route onEnter={requireLogin}>
-        <Route path="/profile" getComponent={(nextState, cb) => System.import('./containers/Profile').then(module => cb(null, module))} />
+        <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)" />
@@ -70,9 +70,9 @@ export default (store) => {
             System.import('./components/GlobalNav/Surah'),
             System.import('./components/GlobalSidebar/Surah'),
           ])
-          .then((module, GlobalNavSurah, GlobalSidebarSurah) => cb(
+          .then(modules => cb(
             null,
-            { main: module, nav: GlobalNavSurah, sidebar: GlobalSidebarSurah }
+            { main: modules[0].default, nav: modules[1].default, sidebar: modules[2].default }
           ))
           .catch(err => console.trace(err))
         }

diff --git a/src/styles/partials/_search-input.scss b/src/styles/partials/_search-input.scss
@@ -1,6 +1,7 @@
 .right-inner-addon.search-input{
   padding: 0px;
   margin-bottom: 0px;
+  width: 50vw;
 
   input{
     padding: 10px 15px;
@@ -23,7 +24,7 @@
   }
   i.ss-icon{
     font-size: 90%;
-    padding: 15px;
+    padding: 12px;
     height: 100%;
     text-align: center;
     border: 0;