Use new ES features

.babelrc

@@ -4,5 +4,9 @@
       "targets": { "electron": "1.8" }
     }],
     "react"
+  ],
+  "plugins": [
+    "transform-class-properties",
+    ["transform-object-rest-spread", { "useBuiltIns": true }]
   ]
 }

package-lock.json

@@ -516,6 +516,12 @@
       "integrity": "sha1-ytnK0RkbWtY0vzCuCHI5HgZHvpU=",
       "dev": true
     },
+    "babel-plugin-syntax-class-properties": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz",
+      "integrity": "sha1-1+sjt5oxf4VDlixQW4J8fWysJ94=",
+      "dev": true
+    },
     "babel-plugin-syntax-exponentiation-operator": {
       "version": "6.13.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
@@ -534,6 +540,12 @@
       "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=",
       "dev": true
     },
+    "babel-plugin-syntax-object-rest-spread": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+      "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=",
+      "dev": true
+    },
     "babel-plugin-syntax-trailing-function-commas": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
@@ -551,6 +563,18 @@
         "babel-runtime": "6.26.0"
       }
     },
+    "babel-plugin-transform-class-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz",
+      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw=",
+      "dev": true,
+      "requires": {
+        "babel-helper-function-name": "6.24.1",
+        "babel-plugin-syntax-class-properties": "6.13.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
+    },
     "babel-plugin-transform-es2015-arrow-functions": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
@@ -806,6 +830,16 @@
         "babel-runtime": "6.26.0"
       }
     },
+    "babel-plugin-transform-object-rest-spread": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.26.0.tgz",
+      "integrity": "sha1-DzZpLVD+9rfi1LOsFHgTepY7ewY=",
+      "dev": true,
+      "requires": {
+        "babel-plugin-syntax-object-rest-spread": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
+    },
     "babel-plugin-transform-react-display-name": {
       "version": "6.25.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz",

package.json

@@ -37,6 +37,8 @@
   "license": "MIT",
   "devDependencies": {
     "babel-cli": "^6.18.0",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-preset-react": "^6.16.0",
     "electron-packager": "^8.1.0",

src/renderer.jsx

@@ -340,7 +340,7 @@ class App extends React.Component {
   renderCutTimeInput(type) {
     const cutTimeKey = type === 'start' ? 'cutStartTime' : 'cutEndTime';
     const cutTimeManualKey = type === 'start' ? 'cutStartTimeManual' : 'cutEndTimeManual';
-    const cutTimeInputStyle = Object.assign({}, { width: '8em', textAlign: type === 'start' ? 'right' : 'left' });
+    const cutTimeInputStyle = { width: '8em', textAlign: type === 'start' ? 'right' : 'left' };
 
     const isCutTimeManualSet = () => this.state[cutTimeManualKey] !== undefined;
 
@@ -362,7 +362,7 @@ class App extends React.Component {
 
 
     return (<input
-      style={Object.assign({}, cutTimeInputStyle, { color: isCutTimeManualSet() ? '#dc1d1d' : undefined })}
+      style={{ ...cutTimeInputStyle, color: isCutTimeManualSet() ? '#dc1d1d' : undefined }}
       type="text"
       onChange={e => handleCutTimeInput(e.target.value)}
       value={isCutTimeManualSet()
@@ -434,7 +434,7 @@ class App extends React.Component {
           <div style={{ position: 'relative' }}>
             {this.renderCutTimeInput('start')}
             <i
-              style={Object.assign({}, jumpCutButtonStyle, { left: 0 })}
+              style={{ ...jumpCutButtonStyle, left: 0 }}
               className="fa fa-step-backward"
               title="Jump to cut start"
               aria-hidden="true"
@@ -461,7 +461,7 @@ class App extends React.Component {
           <div style={{ position: 'relative' }}>
             {this.renderCutTimeInput('end')}
             <i
-              style={Object.assign({}, jumpCutButtonStyle, { right: 0 })}
+              style={{ ...jumpCutButtonStyle, right: 0 }}
               className="fa fa-step-forward"
               title="Jump to cut end"
               aria-hidden="true"