Fix eslint-config, add github action, fix lint issues

editor-js · Apr 22, 2020 · 1c6f546 · 1c6f546
1 parent 574a85f
commit 1c6f546
Show file tree

Hide file tree

Showing 10 changed files with 2,037 additions and 2,190 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -3,6 +3,8 @@
     "codex"
   ],
   "globals": {
-    "fetch": true
+    "fetch": true,
+    "ImageConfig": true,
+    "ImageToolData": true
   }
 }
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
@@ -0,0 +1,4 @@
+# These are supported funding model platforms
+
+github: neSpecc
+open_collective: editorjs
diff --git a/.github/workflows/eslint.yml b/.github/workflows/eslint.yml
@@ -0,0 +1,24 @@
+name: ESLint CodeX
+
+on: [pull_request]
+
+jobs:
+  lint:
+    name: ESlint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+
+      - name: Cache node modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: ${{ runner.os }}-node-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.OS }}-build-${{ env.cache-name }}-
+            ${{ runner.OS }}-build-
+            ${{ runner.OS }}-
+
+      - run: yarn install
+
+      - run: yarn lint
diff --git a/dist/bundle.js b/dist/bundle.js
diff --git a/package.json b/package.json
@@ -14,7 +14,10 @@
   "main": "./dist/bundle.js",
   "scripts": {
     "build": "webpack --mode production",
-    "build:dev": "webpack --mode development --watch"
+    "build:dev": "webpack --mode development --watch",
+    "lint": "eslint src/ --ext .js",
+    "lint:errors": "eslint src/ --ext .js --quiet",
+    "lint:fix": "eslint src/ --ext .js --fix"
   },
   "author": {
     "name": "CodeX",
@@ -27,16 +30,16 @@
     "@babel/runtime": "^7.2.0",
     "@codexteam/ajax": "^4.1.0",
     "babel-loader": "^8.0.5",
-    "css-loader": "^1.0.0",
-    "eslint": "^5.9.0",
-    "eslint-config-codex": "github:codex-team/eslint-config",
-    "eslint-loader": "^2.1.1",
+    "css-loader": "^3.5.2",
+    "eslint": "^6.8.0",
+    "eslint-config-codex": "^1.3.2",
+    "eslint-loader": "^4.0.0",
     "formidable": "^1.2.1",
     "postcss-loader": "^3.0.0",
     "postcss-nested": "^4.1.0",
     "postcss-nested-ancestors": "^2.0.0",
     "request": "^2.88.0",
-    "style-loader": "^0.21.0",
+    "style-loader": "^1.1.4",
     "svg-inline-loader": "^0.8.0",
     "webpack": "^4.29.5",
     "webpack-cli": "^3.2.3"

diff --git a/src/index.js b/src/index.js
@@ -1,6 +1,7 @@
 /**
  * Image Tool for the Editor.js
- * @author CodeX <[email protected]>
+ *
+ * @author CodeX <[email protected]>
  * @license MIT
  * @see {@link https://github.com/editor-js/image}
  *
@@ -79,19 +80,20 @@ export default class ImageTool {
    * icon - Tool icon's SVG
    * title - title to show in toolbox
    *
-   * @return {{icon: string, title: string}}
+   * @returns {{icon: string, title: string}}
    */
   static get toolbox() {
     return {
       icon: ToolboxIcon,
-      title: 'Image'
+      title: 'Image',
     };
   }
 
   /**
-   * @param {ImageToolData} data - previously saved data
-   * @param {ImageConfig} config - user config for Tool
-   * @param {object} api - Editor.js API
+   * @param {object} tool - tool properties got from editor.js
+   * @param {ImageToolData} tool.data - previously saved data
+   * @param {ImageConfig} tool.config - user config for Tool
+   * @param {object} tool.api - Editor.js API
    */
   constructor({ data, config, api }) {
     this.api = api;
@@ -107,7 +109,7 @@ export default class ImageTool {
       types: config.types || 'image/*',
       captionPlaceholder: config.captionPlaceholder || 'Caption',
       buttonContent: config.buttonContent || '',
-      uploader: config.uploader || undefined
+      uploader: config.uploader || undefined,
     };
 
     /**
@@ -116,7 +118,7 @@ export default class ImageTool {
     this.uploader = new Uploader({
       config: this.config,
       onUpload: (response) => this.onUpload(response),
-      onError: (error) => this.uploadingFailed(error)
+      onError: (error) => this.uploadingFailed(error),
     });
 
     /**
@@ -129,17 +131,17 @@ export default class ImageTool {
         this.uploader.uploadSelectedFile({
           onPreview: (src) => {
             this.ui.showPreloader(src);
-          }
+          },
         });
-      }
+      },
     });
 
     /**
      * Module for working with tunes
      */
     this.tunes = new Tunes({
       api,
-      onChange: (tuneName) => this.tuneToggled(tuneName)
+      onChange: (tuneName) => this.tuneToggled(tuneName),
     });
 
     /**
@@ -151,19 +153,21 @@ export default class ImageTool {
 
   /**
    * Renders Block content
+   *
    * @public
    *
-   * @return {HTMLDivElement}
+   * @returns {HTMLDivElement}
    */
   render() {
     return this.ui.render(this.data);
   }
 
   /**
    * Return Block data
+   *
    * @public
    *
-   * @return {ImageToolData}
+   * @returns {ImageToolData}
    */
   save() {
     const caption = this.ui.nodes.caption;
@@ -175,9 +179,10 @@ export default class ImageTool {
 
   /**
    * Makes buttons with tunes: add background, add border, stretch image
+   *
    * @public
    *
-   * @return {Element}
+   * @returns {Element}
    */
   renderSettings() {
     return this.tunes.render(this.data);
@@ -186,6 +191,7 @@ export default class ImageTool {
   /**
    * Fires after clicks on the Toolbox Image Icon
    * Initiates click on the Select File button
+   *
    * @public
    */
   appendCallback() {
@@ -196,6 +202,7 @@ export default class ImageTool {
    * Specify paste substitutes
    *
    * @see {@link https://github.com/codex-team/editor.js/blob/master/docs/tools.md#paste-handling}
+   * @returns {{tags: string[], patterns: object<string, RegExp>, files: {extensions: string[], mimeTypes: string[]}}}
    */
   static get pasteConfig() {
     return {
@@ -208,27 +215,30 @@ export default class ImageTool {
        * Paste URL of image into the Editor
        */
       patterns: {
-        image: /https?:\/\/\S+\.(gif|jpe?g|tiff|png)$/i
+        image: /https?:\/\/\S+\.(gif|jpe?g|tiff|png)$/i,
       },
 
       /**
        * Drag n drop file from into the Editor
        */
       files: {
-        mimeTypes: [ 'image/*' ]
-      }
+        mimeTypes: [ 'image/*' ],
+      },
     };
   }
 
   /**
    * Specify paste handlers
-   * @public
    *
+   * @public
    * @see {@link https://github.com/codex-team/editor.js/blob/master/docs/tools.md#paste-handling}
+   * @param {CustomEvent} event - editor.js custom paste event
+   *                              {@link https://github.com/codex-team/editor.js/blob/master/types/tools/paste-events.d.ts}
+   * @returns {void}
    */
   async onPaste(event) {
     switch (event.type) {
-      case 'tag':
+      case 'tag': {
         const image = event.detail.data;
 
         /** Images from PDF */
@@ -242,18 +252,19 @@ export default class ImageTool {
 
         this.uploadUrl(image.src);
         break;
-
-      case 'pattern':
+      }
+      case 'pattern': {
         const url = event.detail.data;
 
         this.uploadUrl(url);
         break;
-
-      case 'file':
+      }
+      case 'file': {
         const file = event.detail.file;
 
         this.uploadFile(file);
         break;
+      }
     }
   }
 
@@ -264,9 +275,10 @@ export default class ImageTool {
 
   /**
    * Stores all Tool's data
+   *
    * @private
    *
-   * @param {ImageToolData} data
+   * @param {ImageToolData} data - data in Image Tool format
    */
   set data(data) {
     this.image = data.file;
@@ -283,16 +295,18 @@ export default class ImageTool {
 
   /**
    * Return Tool data
+   *
    * @private
    *
-   * @return {ImageToolData} data
+   * @returns {ImageToolData}
    */
   get data() {
     return this._data;
   }
 
   /**
    * Set new image file
+   *
    * @private
    *
    * @param {object} file - uploaded file data
@@ -307,9 +321,11 @@ export default class ImageTool {
 
   /**
    * File uploading callback
+   *
    * @private
    *
-   * @param {UploadResponseFormat} response
+   * @param {UploadResponseFormat} response - uploading server response
+   * @returns {void}
    */
   onUpload(response) {
     if (response.success && response.file) {
@@ -321,25 +337,28 @@ export default class ImageTool {
 
   /**
    * Handle uploader errors
-   * @private
    *
-   * @param {string} errorText
+   * @private
+   * @param {string} errorText - uploading error text
+   * @returns {void}
    */
   uploadingFailed(errorText) {
     console.log('Image Tool: uploading failed because of', errorText);
 
     this.api.notifier.show({
       message: 'Can not upload an image, try another',
-      style: 'error'
+      style: 'error',
     });
     this.ui.hidePreloader();
   }
 
   /**
    * Callback fired when Block Tune is activated
+   *
    * @private
    *
    * @param {string} tuneName - tune that has been clicked
+   * @returns {void}
    */
   tuneToggled(tuneName) {
     // inverse tune state
@@ -348,8 +367,10 @@ export default class ImageTool {
 
   /**
    * Set one tune
+   *
    * @param {string} tuneName - {@link Tunes.tunes}
    * @param {boolean} value - tune state
+   * @returns {void}
    */
   setTune(tuneName, value) {
     this._data[tuneName] = value;
@@ -364,29 +385,32 @@ export default class ImageTool {
         const blockId = this.api.blocks.getCurrentBlockIndex();
 
         this.api.blocks.stretchBlock(blockId, value);
-      }).catch(err => {
-        console.error(err);
-      });
+      })
+        .catch(err => {
+          console.error(err);
+        });
     }
   }
 
   /**
    * Show preloader and upload image file
    *
-   * @param {File} file
+   * @param {File} file - file that is currently uploading (from paste)
+   * @returns {void}
    */
   uploadFile(file) {
     this.uploader.uploadByFile(file, {
       onPreview: (src) => {
         this.ui.showPreloader(src);
-      }
+      },
     });
   }
 
   /**
    * Show preloader and upload image by target url
    *
-   * @param {string} url
+   * @param {string} url - url pasted
+   * @returns {void}
    */
   uploadUrl(url) {
     this.ui.showPreloader(url);