Merge branch 'master' into divehi_font

Author: naveed-ahmad

CONTRIBUTING.md .github/CONTRIBUTING.mdCONTRIBUTING.md renamed to .github/CONTRIBUTING.md

@@ -0,0 +1,12 @@
+### Title of change
+_why the change and what has changed_
+
+### Checklist
+
+- [ ] Unit tests written
+- [ ] Manually tested
+- [ ] New dependencies were added with `yarn`
+- [ ] Prettier & ESLint were run
+
+### Screenshot
+_insert screenshot if needed_

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,29 @@
+import React from 'react';
+import { configure, addDecorator } from '@storybook/react';
+import { withInfo } from '@storybook/addon-info';
+
+import { ThemeProvider } from 'styled-components';
+import { IntlProvider } from 'react-intl';
+
+import getLocalMessages from '../src/helpers/setLocal';
+import theme from '../src/theme';
+
+global.__CLIENT__ = true;
+
+addDecorator((story, context) => withInfo('common info')(story)(context));
+
+addDecorator(story =>
+  <ThemeProvider theme={theme}>
+    <IntlProvider locale="en" messages={getLocalMessages()}>
+      {story()}
+    </IntlProvider>
+  </ThemeProvider>
+);
+
+const req = require.context('../src/components', true, /\.stories\.js$/);
+
+function loadStories() {
+  req.keys().forEach(filename => req(filename));
+}
+
+configure(loadStories, module);

.storybook/config.js

@@ -0,0 +1 @@
+<link rel="stylesheet" href="https://assets-1f14.kxcdn.com/main-415d4fa2919ce5d6e18b.css">

.storybook/preview-head.html

@@ -0,0 +1,22 @@
+// you can use this file to add your custom webpack plugins, loaders and anything you like.
+// This is just the basic way to add additional webpack configurations.
+// For more information refer the docs: https://storybook.js.org/configurations/custom-webpack-config
+
+// IMPORTANT
+// When you add this file, we won't add the default configurations which is similar
+// to "React Create App". This only has babel loader to load JavaScript.
+
+module.exports = {
+  resolve: {
+    extensions: ['.js'],
+    modules: ['src', 'node_modules']
+  },
+  plugins: [
+    // your custom plugins
+  ],
+  module: {
+    rules: [
+      // add your custom rules.
+    ]
+  }
+};

.storybook/webpack.config.js

@@ -2,10 +2,10 @@ FROM node:6.3
 
 ENV NODE_ENV production
 ENV API_URL http://api.quran.com:3000
-ENV SENTRY_KEY_CLIENT https://44c105328ae544ae9928f9eb74b40061@app.getsentry.com/80639
-ENV SENTRY_KEY_SERVER https://44c105328ae544ae9928f9eb74b40061:41ca814d33124e04ab450104c3938cb1@app.getsentry.com/80639
-# It's okay because it's only the APP ID
-ENV FACEBOOK_APP_ID 1557596491207315
+ENV SENTRY_KEY_CLIENT https://app.getsentry.com
+ENV SENTRY_KEY_SERVER https://app.getsentry.com
+
+ENV FACEBOOK_APP_ID appid
 ENV ONE_QURAN_URL https://one.quran.com
 ENV PORT 8000
 ENV NODE_PATH "./src"

Dockerfile

@@ -5,23 +5,31 @@
   "repository": "https://github.com/quran/quran.com-frontend",
   "scripts": {
     "test": "npm run test:dev:unit",
-    "test:ci:unit": "karma start --browsers PhantomJS --single-run",
+    "test:ci:unit": "jest src",
     "pretest:ci:unit": "npm run test:ci:lint",
-    "test:dev:unit": "karma start",
+    "test:dev:unit": "jest src",
+    "jest": "jest",
     "test:ci:lint": "./node_modules/eslint/bin/eslint.js ./src",
     "test:dev:lint": "./node_modules/eslint/bin/eslint.js ./src",
     "test:stylelint": "stylelint './src/**/*.scss' --config ./webpack/.stylelintrc",
-    "dev-old": "env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node ./webpack/webpack-dev-server.js & env NODE_PATH='./src' PORT=8000 node ./bin/server.js",
-    "dev": "env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node --expose-gc ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config ./webpack/dev.config.js --progress  & env NODE_PATH='./src' PORT=8000 node --expose-gc ./bin/server.js",
+    "dev": "cross-env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node --expose-gc ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config ./webpack/dev.config.js --progress  & env NODE_PATH='./src' PORT=8000 node --expose-gc ./bin/server.js",
     "build": "npm run build:client & npm run build:server",
     "build:server": "babel ./src -d ./dist -D",
     "build:client": "webpack --config ./webpack/prod.config.js",
     "validate": "npm ls",
-    "analyze:build": "env NODE_ENV=production webpack --json --config ./webpack/prod.config.js  > bundle-stats.json",
+    "analyze:build": "cross-env NODE_ENV=production webpack --json --config ./webpack/prod.config.js  > bundle-stats.json",
     "analyze:json": "webpack-bundle-size-analyzer bundle-stats.json",
     "lint:fix": "npm run test:dev:lint -- --fix",
     "prettier": "prettier --single-quote --write",
-    "precommit": "lint-staged"
+    "precommit": "lint-staged",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook"
+  },
+  "jest": {
+    "moduleDirectories": [
+      "node_modules",
+      "src"
+    ]
   },
   "pre-commit": [
     "test:stylelint",
@@ -79,6 +87,7 @@
     "cookie-parser": "1.4.3",
     "copy-to-clipboard": "3.0.5",
     "cors": "2.7.1",
+    "cross-env": "^5.1.1",
     "css-loader": "0.26.1",
     "cssnano": "3.10.0",
     "debug": "2.2.0",
@@ -95,16 +104,20 @@
     "html-webpack-plugin": "1.7.0",
     "http-proxy": "1.14.0",
     "humps": "2.0.0",
+    "i": "0.3.6",
     "image-webpack-loader": "3.1.0",
     "imports-loader": "0.6.5",
     "json-loader": "0.5.4",
+    "loadable-components": "^0.3.0",
     "morgan": "1.7.0",
     "node-sass": "4.1.1",
     "normalizr": "3.0.2",
+    "polished": "^1.8.0",
     "postcss-loader": "0.9.1",
     "precss": "1.4.0",
     "pretty-error": "2.0.0",
     "promise": "7.1.1",
+    "prop-types": "^15.6.0",
     "proxy-middleware": "0.14.0",
     "qs": "6.2.1",
     "quran-components": "^0.0.80",
@@ -124,8 +137,9 @@
     "react-metrics": "1.2.1",
     "react-paginate": "4.1.0",
     "react-redux": "5.0.1",
-    "react-router": "3.0.0",
-    "react-router-bootstrap": "0.20.1",
+    "react-router": "^4",
+    "react-router-bootstrap": "^0.24.4",
+    "react-router-dom": "^4.2.2",
     "react-router-redux": "4.0.7",
     "react-router-scroll": "0.2.1",
     "react-scroll": "1.2.0",
@@ -153,7 +167,12 @@
     "winston": "1.1.2"
   },
   "devDependencies": {
+    "@storybook/addon-actions": "^3.2.13",
+    "@storybook/addon-info": "^3.2.13",
+    "@storybook/addon-links": "^3.2.13",
+    "@storybook/react": "^3.2.13",
     "babel-eslint": "7.1.1",
+    "babel-jest": "^21.2.0",
     "babel-plugin-react-transform": "2.0.2",
     "babel-preset-react-hmre": "1.1.1",
     "chai": "3.0.0",
@@ -167,19 +186,8 @@
     "eslint-plugin-jsx-a11y": "2.2.3",
     "eslint-plugin-mocha": "4.8.0",
     "eslint-plugin-react": "6.8.0",
+    "jest": "^21.2.1",
     "jscs": "2.1.1",
-    "karma": "1.3.0",
-    "karma-chai": "0.1.0",
-    "karma-chai-sinon": "0.1.5",
-    "karma-chrome-launcher": "0.2.0",
-    "karma-intl-shim": "1.0.3",
-    "karma-junit-reporter": "0.3.4",
-    "karma-mocha": "0.2.0",
-    "karma-phantomjs-launcher": "~1.0.2",
-    "karma-script-launcher": "~0.1.0",
-    "karma-sinon": "1.0.4",
-    "karma-sourcemap-loader": "0.3.7",
-    "karma-webpack": "1.8.0",
     "lint-staged": "^3.4.0",
     "mocha": "2.2.5",
     "nodemon": "1.7.1",