Update eslint. Add travis lint check

chrisvenczel · Mar 30, 2020 · 46b1dfc · 46b1dfc
1 parent 7847548
commit 46b1dfc
Show file tree

Hide file tree

Showing 23 changed files with 411 additions and 246 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -4,18 +4,27 @@
   ],
   "parser": "babel-eslint",
   "rules": {
-    "comma-dangle": [2, "always-multiline"],
+    "comma-dangle": [2, {
+      "arrays": "always-multiline",
+      "exports": "always-multiline",
+      "functions": "never",
+      "imports": "always-multiline",
+      "objects": "always-multiline"
+    }],
     "space-before-function-paren": [2, {
       "anonymous": "never",
       "named": "never",
       "asyncArrow": "always"
     }],
+    "react/jsx-handler-names": "off",
     "jsx-quotes": [2, "prefer-double"],
     "no-var": 2,
 
     "babel/no-invalid-this": 1,
     "babel/semi": [2, "never"],
-    "react/prop-types": 1
+    "react/prop-types": 1,
+    "semi": [2, "never"],
+    "lines-between-class-members": "off"
   },
   "extends": ["standard", "standard-react"],
   "env": {

diff --git a/.travis.yml b/.travis.yml
@@ -0,0 +1,14 @@
+language: node_js
+dist: bionic
+node_js: node
+cache: yarn
+
+branches:
+  only:
+    - master
+
+script:
+  - yarn lint
+
+notifications:
+  email: false
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "javascript.implicitProjectConfig.checkJs": true
+}
diff --git a/jsconfig.json b/jsconfig.json
@@ -1,5 +1,9 @@
 {
     "compilerOptions": {
-        "experimentalDecorators": true
-    }
+        "experimentalDecorators": true,
+        "checkJs": true,
+        "jsx": "react",
+        "downlevelIteration": true
+    },
+    "exclude": ["node_modules", "**/node_modules/*"]
 }
diff --git a/package.json b/package.json
@@ -10,7 +10,8 @@
     "build-css": "./node_modules/node-sass/bin/node-sass src/browser.sass dist/react-keyed-file-browser.css",
     "build": "npm run build-js; npm run build-css",
     "prepublish": "npm run build",
-    "storybook": "start-storybook -p 9001"
+    "storybook": "start-storybook -p 9001",
+    "lint": "eslint src"
   },
   "repository": {
     "type": "git",
@@ -51,25 +52,27 @@
     "@sambego/storybook-state": "^1.3.6",
     "@storybook/react": "^5.3.14",
     "babel-cli": "^6.6.4",
-    "babel-eslint": "^9.0.0",
+    "babel-eslint": "^10.1.0",
     "babel-loader": "^8.0.5",
     "css-loader": "^3.4.2",
-    "eslint": "^5.5.0",
-    "eslint-config-standard": "^12.0.0",
-    "eslint-config-standard-jsx": "^6.0.2",
-    "eslint-config-standard-react": "^7.0.2",
-    "eslint-plugin-babel": "^5.1.0",
-    "eslint-plugin-import": "^2.14.0",
-    "eslint-plugin-node": "^7.0.1",
-    "eslint-plugin-promise": "^4.0.0",
-    "eslint-plugin-react": "^7.11.1",
-    "eslint-plugin-standard": "^4.0.0",
+    "dotenv": "^8.2.0",
+    "eslint": "^6.8.0",
+    "eslint-config-standard": "^14.1.1",
+    "eslint-config-standard-jsx": "^8.1.0",
+    "eslint-config-standard-react": "^9.2.0",
+    "eslint-plugin-babel": "^5.3.0",
+    "eslint-plugin-import": "^2.20.2",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^4.2.1",
+    "eslint-plugin-react": "^7.19.0",
+    "eslint-plugin-standard": "^4.0.1",
     "font-awesome": "^4.7.0",
     "node-sass": "^4.13.1",
     "react": "^16.13.0",
     "react-dom": "^16.13.0",
     "sass-loader": "^8.0.2",
     "style-loader": "^1.1.3",
+    "typescript": "^3.8.3",
     "webpack": "^4.29.1",
     "webpack-cli": "^3.2.3",
     "webpack-node-externals": "^1.5.4"

diff --git a/src/actions/default.js b/src/actions/default.js
@@ -28,12 +28,13 @@ const Actions = (props) => {
 
   } = props
 
+  /** @type any */
   let actions = []
 
   if (selectedItems.length) {
     // Something is selected. Build custom actions depending on what it is.
-    let selectedItemsAction = selectedItems.filter(item => item.action)
-    if (selectedItemsAction.length === selectedItems.length && [... new Set(selectedItemsAction)].length === 1) {
+    const selectedItemsAction = selectedItems.filter(item => item.action)
+    if (selectedItemsAction.length === selectedItems.length && [...new Set(selectedItemsAction)].length === 1) {
       // Selected item has an active action against it. Disable all other actions.
       let actionText
       switch (selectedItemsAction[0].action) {
@@ -72,7 +73,7 @@ const Actions = (props) => {
         )
       }
 
-      let itemsWithoutKeyDerived = selectedItems.find(item => !item.keyDerived)
+      const itemsWithoutKeyDerived = selectedItems.find(item => !item.keyDerived)
       if (!itemsWithoutKeyDerived && !isFolder && canRenameFile && selectedItems.length === 1) {
         actions.push(
           <li key="action-rename">

diff --git a/src/base-file.js b/src/base-file.js
@@ -1,3 +1,4 @@
+// @ts-nocheck
 import PropTypes from 'prop-types'
 import React from 'react'
 import { moveFilesAndFolders } from './utils'
@@ -135,7 +136,7 @@ class BaseFile extends React.Component {
     if (!this.props.browserProps.deleteFile) {
       return
     }
-    console.log(this.props);
+
     this.props.browserProps.deleteFile(this.props.browserProps.actionTargets)
   }
 

diff --git a/src/base-folder.js b/src/base-folder.js
@@ -1,3 +1,4 @@
+// @ts-nocheck
 import PropTypes from 'prop-types'
 import React from 'react'
 import { moveFilesAndFolders } from './utils'

diff --git a/src/browser.js b/src/browser.js
@@ -12,8 +12,7 @@ import { DefaultFilter } from './filters'
 import { TableHeader } from './headers'
 import { TableFile } from './files'
 import { TableFolder } from './folders'
-import { DefaultConfirmDeletion } from './confirmations'
-import { MultipleConfirmDeletion } from './confirmations'
+import { DefaultConfirmDeletion, MultipleConfirmDeletion } from './confirmations'
 
 // default processors
 import { GroupByFolder } from './groupers'
@@ -314,7 +313,7 @@ class RawFileBrowser extends React.Component {
 
     let newSelection = [key]
     if (ctrlKey || shiftKey) {
-      let indexOfKey = this.state.selection.indexOf(key);
+      const indexOfKey = this.state.selection.indexOf(key)
       if (indexOfKey !== -1) {
         newSelection = [...this.state.selection.slice(0, indexOfKey), ...this.state.selection.slice(indexOfKey + 1)]
       } else {
@@ -512,7 +511,7 @@ class RawFileBrowser extends React.Component {
       )
     }
 
-    let actions = (
+    const actions = (
       <ActionRenderer
         browserProps={browserProps}
 
@@ -644,7 +643,7 @@ class RawFileBrowser extends React.Component {
       })
       files = newFiles
     }
-    let selectedItems = []
+    const selectedItems = []
     const findSelected = (item) => {
       if (selection.includes(item.key)) {
         selectedItems.push(item)
@@ -659,38 +658,45 @@ class RawFileBrowser extends React.Component {
     }
 
     let header
+    /** @type any */
     let contents = this.renderFiles(files, 0)
     switch (this.props.renderStyle) {
       case 'table':
         if (!contents.length) {
           if (this.state.nameFilter) {
-            contents = (<tr>
-              <td colSpan="100">
-                No files matching "{this.state.nameFilter}".
-              </td>
-            </tr>)
+            contents = (
+              <tr>
+                <td colSpan={100}>
+                  No files matching "{this.state.nameFilter}".
+                </td>
+              </tr>
+            )
           } else {
-            contents = (<tr>
-              <td colSpan="100">
-                {this.props.noFilesMessage}
-              </td>
-            </tr>)
+            contents = (
+              <tr>
+                <td colSpan={100}>
+                  {this.props.noFilesMessage}
+                </td>
+              </tr>
+            )
           }
         } else {
           if (this.state.nameFilter) {
             const numFiles = contents.length
             contents = contents.slice(0, this.state.searchResultsShown)
             if (numFiles > contents.length) {
-              contents.push(<tr key="show-more">
-                <td colSpan="100">
-                  <a
-                    onClick={this.handleShowMoreClick}
-                    href="#"
-                  >
-                    Show more results
-                  </a>
-                </td>
-              </tr>)
+              contents.push(
+                <tr key="show-more">
+                  <td colSpan={100}>
+                    <a
+                      onClick={this.handleShowMoreClick}
+                      href="#"
+                    >
+                      Show more results
+                    </a>
+                  </td>
+                </tr>
+              )
             }
           }
         }
@@ -729,12 +735,14 @@ class RawFileBrowser extends React.Component {
             const numFiles = contents.length
             contents = contents.slice(0, this.state.searchResultsShown)
             if (numFiles > contents.length) {
-              more = (<a
-                onClick={this.handleShowMoreClick}
-                href="#"
-              >
-                Show more results
-              </a>)
+              more = (
+                <a
+                  onClick={this.handleShowMoreClick}
+                  href="#"
+                >
+                  Show more results
+                </a>
+              )
             }
           }
           contents = (
@@ -770,9 +778,10 @@ class RawFileBrowser extends React.Component {
         {this.props.actions}
         <div className="rendered-file-browser" ref={el => { this.browserRef = el }}>
           {this.props.showActionBar && this.renderActionBar(selectedItems)}
-          {this.state.activeAction === "delete" && this.state.selection.length > 1 && <ConfirmMultipleDeletionRenderer
-            handleDeleteSubmit={this.handleMultipleDeleteSubmit}
-          />}
+          {this.state.activeAction === 'delete' && this.state.selection.length > 1 &&
+            <ConfirmMultipleDeletionRenderer
+              handleDeleteSubmit={this.handleMultipleDeleteSubmit}
+            />}
           <div className="files">
             {renderedFiles}
           </div>

diff --git a/src/confirmations/index.js b/src/confirmations/index.js
@@ -3,5 +3,5 @@ import MultipleConfirmDeletion from './multiple'
 
 export {
   DefaultConfirmDeletion,
-  MultipleConfirmDeletion
+  MultipleConfirmDeletion,
 }
diff --git a/src/constants.js b/src/constants.js
@@ -46,7 +46,7 @@ const FILETYPE_EXTENSIONS = {
   ],
 }
 
-let extensionMapping = {}
+const extensionMapping = {}
 
 for (const [type, extensions] of Object.entries(FILETYPE_EXTENSIONS)) {
   for (const extension of extensions) {

diff --git a/src/files/list-thumbnail.js b/src/files/list-thumbnail.js
@@ -25,9 +25,12 @@ class RawListThumbnailFile extends BaseFile {
     let icon
     if (thumbnailUrl) {
       icon = (
-        <div className="image" style={{
-          backgroundImage: 'url(' + thumbnailUrl + ')',
-        }} />
+        <div
+          className="image"
+          style={{
+            backgroundImage: 'url(' + thumbnailUrl + ')',
+          }}
+        />
       )
     } else {
       icon = browserProps.icons[this.getFileType()] || browserProps.icons.File
@@ -128,7 +131,7 @@ class RawListThumbnailFile extends BaseFile {
 @DropTarget(
   ['file', 'folder', NativeTypes.FILE],
   BaseFileConnectors.targetSource,
-  BaseFileConnectors.targetCollect,
+  BaseFileConnectors.targetCollect
 )
 class ListThumbnailFile extends RawListThumbnailFile {}
 

diff --git a/src/files/table.js b/src/files/table.js
@@ -68,7 +68,7 @@ class RawTableFile extends BaseFile {
       draggable = connectDragPreview(draggable)
     }
 
-    let row = (
+    const row = (
       <tr
         className={ClassNames('file', {
           pending: action,
@@ -99,7 +99,7 @@ class RawTableFile extends BaseFile {
 @DropTarget(
   ['file', 'folder', NativeTypes.FILE],
   BaseFileConnectors.targetSource,
-  BaseFileConnectors.targetCollect,
+  BaseFileConnectors.targetCollect
 )
 class TableFile extends RawTableFile {}
 

diff --git a/src/filters/default.js b/src/filters/default.js
@@ -15,7 +15,6 @@ class Filter extends React.Component {
   render() {
     return (
       <input
-        ref="filter"
         ref={el => { this.filterRef = el }}
         type="search"
         placeholder="Filter files"

diff --git a/src/folders/list-thumbnail.js b/src/folders/list-thumbnail.js
@@ -126,7 +126,7 @@ class RawListThumbnailFolder extends BaseFolder {
 @DropTarget(
   ['file', 'folder', NativeTypes.FILE],
   BaseFileConnectors.targetSource,
-  BaseFileConnectors.targetCollect,
+  BaseFileConnectors.targetCollect
 )
 class ListThumbnailFolder extends RawListThumbnailFolder {}
 

diff --git a/src/folders/table.js b/src/folders/table.js
@@ -95,7 +95,7 @@ class RawTableFolder extends BaseFolder {
 @DropTarget(
   ['file', 'folder', NativeTypes.FILE],
   BaseFileConnectors.targetSource,
-  BaseFileConnectors.targetCollect,
+  BaseFileConnectors.targetCollect
 )
 class TableFolder extends RawTableFolder {}
 

diff --git a/src/groupers/by-folder.js b/src/groupers/by-folder.js
@@ -12,7 +12,7 @@ export default function(files, root) {
     const folders = file.relativeKey.split('/')
     folders.map((folder, folderIndex) => {
       if (folderIndex === folders.length - 1 && isFolder(file)) {
-        for (let key in file) {
+        for (const key in file) {
           currentFolder[key] = file[key]
         }
       }
@@ -42,7 +42,7 @@ export default function(files, root) {
       prefix += '/'
     }
     let files = []
-    for (let folder in level.children) {
+    for (const folder in level.children) {
       files.push({
         ...level.children[folder],
         contents: undefined,

diff --git a/src/groupers/utils.js b/src/groupers/utils.js
@@ -1,3 +1,4 @@
+// @ts-nocheck
 import Moment from 'moment'
 
 function relativeTimeWindows() {