Merge pull request #4 from datatrans/code-hygiene

Code hygiene

.editorconfig

@@ -0,0 +1,10 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+max_line_length = 100

.eslintignore

@@ -0,0 +1,2 @@
+lib/
+example/

.eslintrc

@@ -1,5 +1,4 @@
 {
-  // I want to use babel-eslint for parsing!
   "parser": "babel-eslint",
   "parserOptions": {
     "ecmaVersion": 6,
@@ -10,9 +9,7 @@
     }
   },
   "env": {
-    // I write for browser
     "browser": true,
-    // in CommonJS
     "node": true,
     "es6":true
   },
@@ -22,7 +19,6 @@
     "eslint:recommended",
     "plugin:react/recommended"
   ],
-  // To give you an idea how to override rule options:
   "rules": {
     "no-unresovled":0,
     "quotes": [2, "single"],
@@ -34,24 +30,21 @@
     "indent": [1, 2],
     "linebreak-style": ["error", "unix"],
 
-    "semi": ["error", "never"], // never use semicolons
+    "semi": ["error", "never"],
 
-    // override default options for rules from base configurations
     "comma-dangle": [0, "always"],
     "no-cond-assign": ["error", "always"],
 
     "react/jsx-uses-react": 2,
     "react/jsx-uses-vars": 2,
     "react/react-in-jsx-scope": 2,
 
-    // disable rules from base configurations
     "no-console": 0,
     "no-dupe-args":2,
     "no-dupe-keys":2,
     "array-bracket-spacing": 2,
     "camelcase": 2,
     "comma-spacing": [0, {"before": false, "after": true}],
-    // "curly": [2, "multi"],
     "no-self-assign": 2,
     "no-extra-boolean-cast": 0,
     "flowtype/boolean-style": [
@@ -73,15 +66,6 @@
       2,
       "comma"
     ],
-    // "flowtype/require-parameter-type": 2,
-    // "flowtype/require-return-type": [
-    //   2,
-    //   "always",
-    //   {
-    //     "annotateUndefined": "never"
-    //   }
-    // ],
-    // "flowtype/require-valid-file-annotation": 2,
     "flowtype/semi": [
       2,
       "always"
@@ -110,4 +94,4 @@
     "flowtype/valid-syntax": 1
 
   }
-}
+}

circle.yml

@@ -0,0 +1,3 @@
+machine:
+  node:
+    version: 8.9

example/lib/app.html

@@ -9,7 +9,7 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <meta name="HandheldFriendly" content="True">
         <meta name="MobileOptimized" content="320">
-        <title>UPP Admin</title>
+        <title>Datatrans React Lightbox</title>
     </head>
 
 

example/src/App.js

@@ -1,8 +1,6 @@
-
-import React, {PropTypes, Component} from 'react'
+import React, { Component } from 'react'
 import LightBox from 'react-datatrans-light-box'
 
-
 const config = {
   merchantId: '1100004624',
   refno: '11000asdfasdf4624',
@@ -97,11 +95,8 @@ class LightBoxHocApproachBase extends Component {
 
 }
 
-
 LightBoxHocApproachBase.propTypes = {
   lightBox: LightBox.Hoc.propType,
-
 }
 
 const LightBoxHocApproach = LightBox.Hoc(LightBoxHocApproachBase)
-

example/src/app.html

@@ -9,7 +9,7 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <meta name="HandheldFriendly" content="True">
         <meta name="MobileOptimized" content="320">
-        <title>UPP Admin</title>
+        <title>Datatrans React Lightbox</title>
     </head>
 
 

example/webpack.config.js

@@ -1,32 +1,21 @@
 const path = require('path')
-const webpack = require('webpack')
 
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 
 module.exports = {
   module: {
-    loaders: [{
-      test: /\.js$/, // Transform all .js files required somewhere with Babel
-      loader: 'babel-loader',
-      // include: ['../../shared'],
-      // exclude: [/node_modules/],
-      // query: env.babelQuery,
-    }]
+    loaders: [
+      {
+        test: /\.js$/,
+        loader: 'babel-loader'
+      }
+    ]
 
   },
   entry: {
     main: ['./src/index.js'],
-
   },
   plugins: [
-    // new webpack.optimize.UglifyJsPlugin({
-    //   compress: {
-    //     warnings: false, // ...but do not show warnings in the console (there is a lot of them)
-    //   },
-    //   comments: false,
-    // }),
-    // new webpack.HotModuleReplacementPlugin(), // Tell webpack we want hot reloading
-    // new webpack.NoErrorsPlugin(),
     new HtmlWebpackPlugin({
       inject: true,
       chunks:['app'],
@@ -38,9 +27,5 @@ module.exports = {
   output: {
     path: path.resolve(__dirname, 'lib'),
     filename: '[name].js'
-  },
-
-  // resolve: {
-  //   modules:[path.resolve(__dirname, '../../shared'), 'node_modules']
-  // }
+  }
 }

example/yarn.lock

@@ -2400,9 +2400,7 @@ rc@^1.1.7:
     strip-json-comments "~2.0.1"
 
 react-datatrans-light-box@../:
-  version "1.0.2"
-  dependencies:
-    prop-types "^15.6.0"
+  version "1.0.4"
 
 react-dom@^16.2.0:
   version "16.2.0"

package.json

@@ -17,9 +17,10 @@
   "author": "Datatrans AG",
   "license": "MIT",
   "scripts": {
-    "test": "npm run build",
+    "test": "npm run lint && npm run build",
     "build": "NODE_ENV=production webpack --color --progress",
-    "watch": "NODE_ENV=production webpack --color --progress --watch"
+    "watch": "NODE_ENV=production webpack --color --progress --watch",
+    "lint": "eslint ."
   },
   "peerDependencies": {
     "react": "^15.0.0 || ^16.0.0-0"
@@ -40,16 +41,14 @@
     "babel-preset-latest": "^6.24.0",
     "babel-preset-react": "^6.23.0",
     "babel-preset-stage-0": "^6.22.0",
-    "compression-webpack-plugin": "^0.3.2",
     "eslint": "^3.11.1",
     "eslint-import-resolver-webpack": "^0.8.0",
     "eslint-loader": "^1.5.0",
     "eslint-plugin-flowtype": "^2.29.1",
     "eslint-plugin-import": "^2.2.0",
     "eslint-plugin-jsx-a11y": "^3.0.1",
     "eslint-plugin-react": "^6.8.0",
+    "prop-types": "^15.6.0",
     "webpack": "^2.3.2"
-  },
-  "dependencies": {
   }
 }

src/LightBox.js

@@ -1,5 +1,5 @@
 import React, {Component} from 'react'
-// import PropTypes from 'prop-types'
+import PropTypes from 'prop-types'
 import PaymentPageFrame from './PaymentPageFrame'
 import {
   filterProps, toUrlParams, parseUrl,
@@ -49,14 +49,14 @@ export default class LightBox extends Component {
     this.props.onCancelled()
   }
 
-  componentDidMount() {    
+  componentDidMount() {
     const addListener = window.addEventListener || window.attachEvent
-    addListener('message', this.onMessage)   
+    addListener('message', this.onMessage)
   }
 
-  componentWillUnmount() {    
+  componentWillUnmount() {
     const removeListener = window.removeEventListener || window.detachEvent
-    removeListener('message', this.onMessage)    
+    removeListener('message', this.onMessage)
     releaseLock()
   }
 
@@ -72,22 +72,21 @@ export default class LightBox extends Component {
 
 }
 
+LightBox.propTypes = {
+  merchantId: PropTypes.string.isRequired,
+  refno: PropTypes.string.isRequired,
+  amount: PropTypes.string.isRequired,
+  currency: PropTypes.string.isRequired,
+  sign: PropTypes.string.isRequired,
 
-// LightBox.propTypes = {
-//   merchantId: PropTypes.string.isRequired,
-//   refno: PropTypes.string.isRequired,
-//   amount: PropTypes.string.isRequired,
-//   currency: PropTypes.string.isRequired,
-//   sign: PropTypes.string.isRequired,
+  production: PropTypes.bool,
+  showsPaymentPage: PropTypes.bool.isRequired,
 
-//   production: PropTypes.bool,
-//   showsPaymentPage: PropTypes.bool.isRequired,
+  onCancelled: PropTypes.func.isRequired,
+  onLoaded: PropTypes.func.isRequired,
+  onError: PropTypes.func.isRequired,
 
-//   onCancelled: PropTypes.func.isRequired,
-//   onLoaded: PropTypes.func.isRequired,
-//   onError: PropTypes.func.isRequired,
-
-// }
+}
 
 LightBox.defaultProps = {
   onCancelled() {},
@@ -97,4 +96,4 @@ LightBox.defaultProps = {
   theme: 'DT2015',
   version: '1.0.2',
   showsPaymentPage: true,
-}
+}

src/LightBoxHoc.js

@@ -1,5 +1,5 @@
 import React, {Component} from 'react'
-// import PropTypes from 'prop-types'
+import PropTypes from 'prop-types'
 import LightBox from './LightBox'
 import {filterProps} from './utils'
 
@@ -105,19 +105,17 @@ const LightBoxHoc = Wrapee => class Wrapper extends Component {
   }
 }
 
-// LightBoxHoc.propType = PropTypes.shape({
-
-
-//   //LightBox state
-//   visible: PropTypes.bool.isRequired,
-//   loaded: PropTypes.bool.isRequired,
-//   cancelled: PropTypes.bool.isRequired,
-//   error: PropTypes.any,
-
-//   //Methods
-//   load: PropTypes.func.isRequired,
-//   show: PropTypes.func.isRequired,
-//   on: PropTypes.func.isRequired,
-// })
+LightBoxHoc.propType = PropTypes.shape({
+  //LightBox state
+  visible: PropTypes.bool.isRequired,
+  loaded: PropTypes.bool.isRequired,
+  cancelled: PropTypes.bool.isRequired,
+  error: PropTypes.any,
+
+  //Methods
+  load: PropTypes.func.isRequired,
+  show: PropTypes.func.isRequired,
+  on: PropTypes.func.isRequired,
+})
 
 export default LightBoxHoc

src/PaymentPage.js

@@ -1,5 +1,5 @@
 import React from 'react'
-// import PropTypes from 'prop-types'
+import PropTypes from 'prop-types'
 import styles from './styles'
 
 const PaymentPage = props => {
@@ -14,9 +14,8 @@ const PaymentPage = props => {
   />
 }
 
-
-// PaymentPage.propTypes = {
-//   url: PropTypes.string.isRequired,
-// }
+PaymentPage.propTypes = {
+  url: PropTypes.string.isRequired,
+}
 
 export default PaymentPage

src/PaymentPageFrame.js

@@ -1,5 +1,5 @@
 import React from 'react'
-// import PropTypes from 'prop-types'
+import PropTypes from 'prop-types'
 import PaymentPage from './PaymentPage'
 import styles from './styles'
 
@@ -8,18 +8,18 @@ const display = 'block'
 const PaymentPageFrame = props =>  {
 
   const style = props.showsPaymentPage
-  ? {...styles.pageFrame, display}
-  : styles.pageFrame
+    ? {...styles.pageFrame, display}
+    : styles.pageFrame
 
 
   return <div style={style}>
     <PaymentPage url={props.url} />
   </div>
 }
 
-// PaymentPageFrame.propTypes = {
-//   url: PropTypes.string.isRequired,
-//   showsPaymentPage: PropTypes.bool.isRequired,
-// }
+PaymentPageFrame.propTypes = {
+  url: PropTypes.string.isRequired,
+  showsPaymentPage: PropTypes.bool.isRequired,
+}
 
 export default PaymentPageFrame

src/index.js

@@ -1,10 +1,7 @@
-import LightBox from './LightBox.js'
+import LightBox from './LightBox'
 import LightBoxHoc from './LightBoxHoc'
 
 LightBox.Hoc = LightBoxHoc
 
 export {LightBoxHoc, LightBoxHoc as withLightBox}
 export default LightBox
-
-
-