Upgrade packages (#149)

* update babel, postcss and webpack

* update editor packages

* update linter packages

.dockerignore

@@ -1,4 +1,7 @@
 .db
+.testdb
+.codexdocsrc
+
 node_modules
 docker
 test

.eslintrc

@@ -1,13 +1,9 @@
 {
   "extends": [
-    "codex/ts",
+    "codex/ts"
-    "eslint:recommended",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended"
   ],
   "plugins": [
-    "chai-friendly",
+    "chai-friendly"
-    "@typescript-eslint"
   ],
   "env": {
     "mocha": true

.postcssrc

@@ -6,8 +6,8 @@ plugins:
     postcss-media-minmax: {}
     postcss-custom-selectors: {}
     postcss-nested-ancestors: {}
-    postcss-nesting: {}
     postcss-nested: {}
+    postcss-nesting: {}
     postcss-color-mod-function: {}
     postcss-color-hex-alpha: {}
     postcss-font-family-system-ui: {}

docker-compose.yml

@@ -5,7 +5,7 @@ services:
       dockerfile: docker/Dockerfile.prod
       context: .
     ports:
-      - 5000:3000
+      - "5005:3000"
     volumes:
       - ./.codexdocsrc:/usr/src/app/.codexdocsrc:ro
       - ./config/production.json:/usr/src/app/config/production.json:ro

docker/Dockerfile.prod

@@ -11,4 +11,4 @@ COPY . .
 
 RUN yarn compile
 
-CMD ["yarn", "start"]
+CMD ["yarn", "start:ts"]

package.json

@@ -13,9 +13,9 @@
     "start:dev": "cross-env NODE_ENV=development nodemon --config nodemon.json ./src/bin/server.ts",
     "test": "cross-env NODE_ENV=testing mocha --recursive ./dist/test --exit",
     "test:ts": "cross-env NODE_ENV=testing ts-mocha ./src/test/*.ts ./src/test/**/*.ts --exit",
-    "lint": "eslint --fix --cache --ext .ts ./src/backend",
+    "lint": "eslint --fix --ext .ts ./src/backend",
-    "build": "webpack ./src/frontend/js/app.js --o='./public/dist/[name].bundle.js' --output-library=Docs --output-public-path=/dist/ -p --mode=production",
+    "build": "webpack --mode=production",
-    "build:dev": "webpack ./src/frontend/js/app.js --o='./public/dist/[name].bundle.js' --output-library=Docs --output-public-path=/dist/ -p --mode=development --watch",
+    "build:dev": "webpack --mode=development --watch",
     "precommit": "yarn lint && yarn test:ts",
     "generatePassword:ts": "ts-node ./src/generatePassword.ts",
     "generatePassword": "node ./dist/generatePassword.js",
@@ -23,7 +23,7 @@
     "compile": "npx tsc"
   },
   "dependencies": {
-    "@editorjs/embed": "^2.5.0",
+    "@editorjs/embed": "^2.5.1",
     "bcrypt": "^5.0.1",
     "commander": "^8.1.0",
     "config": "^3.3.6",
@@ -46,23 +46,22 @@
     "open-graph-scraper": "^4.9.0",
     "ts-node": "^10.1.0",
     "twig": "^1.15.4",
-    "typescript-eslint": "^0.0.1-alpha.0",
     "uuid4": "^2.0.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.0.0",
+    "@babel/core": "^7.17.5",
     "@babel/plugin-syntax-dynamic-import": "^7.0.0",
-    "@babel/polyfill": "^7.2.5",
+    "@babel/polyfill": "^7.12.1",
-    "@babel/preset-env": "^7.1.0",
+    "@babel/preset-env": "^7.16.11",
     "@codexteam/misprints": "^1.0.0",
     "@editorjs/checklist": "^1.3.0",
     "@editorjs/code": "^2.7.0",
     "@editorjs/delimiter": "^1.2.0",
-    "@editorjs/editorjs": "^2.23.0-rc.1",
+    "@editorjs/editorjs": "^2.23.2",
     "@editorjs/header": "^2.6.2",
     "@editorjs/image": "^2.6.2",
     "@editorjs/inline-code": "^1.3.1",
-    "@editorjs/link": "^2.3.1",
+    "@editorjs/link": "^2.4.0",
     "@editorjs/list": "^1.6.2",
     "@editorjs/marker": "^1.2.2",
     "@editorjs/raw": "^2.3.0",
@@ -75,7 +74,6 @@
     "@types/cookie-parser": "^1.4.2",
     "@types/csurf": "^1.11.2",
     "@types/debug": "^4.1.7",
-    "@types/eslint": "^7.28.0",
     "@types/express": "^4.17.13",
     "@types/file-type": "^10.9.1",
     "@types/jsonwebtoken": "^8.5.4",
@@ -91,48 +89,46 @@
     "@types/rimraf": "^3.0.1",
     "@types/sinon": "^10.0.2",
     "@types/twig": "^1.12.6",
-    "@typescript-eslint/eslint-plugin": "^4.28.5",
+    "autoprefixer": "^10.4.2",
-    "@typescript-eslint/parser": "^4.28.5",
-    "autoprefixer": "^9.1.3",
     "babel": "^6.23.0",
     "babel-eslint": "^10.0.1",
-    "babel-loader": "^8.0.2",
+    "babel-loader": "^8.2.3",
     "chai": "^4.1.2",
     "chai-http": "^4.0.0",
-    "css-loader": "^1.0.0",
+    "css-loader": "^6.7.0",
-    "cssnano": "^4.1.0",
+    "cssnano": "^5.1.0",
     "eslint": "^7.31.0",
-    "eslint-config-codex": "^1.6.2",
+    "eslint-config-codex": "^1.6.4",
-    "eslint-plugin-chai-friendly": "^0.4.1",
+    "eslint-plugin-chai-friendly": "^0.7.2",
-    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-import": "^2.25.4",
-    "eslint-plugin-node": "^8.0.1",
+    "eslint-plugin-node": "^11.1.0",
     "highlight.js": "^11.1.0",
     "husky": "^1.1.2",
-    "mini-css-extract-plugin": "^0.4.3",
+    "mini-css-extract-plugin": "^2.6.0",
     "mocha": "^5.2.0",
     "mocha-sinon": "^2.1.2",
     "module-dispatcher": "^2.0.0",
     "normalize.css": "^8.0.1",
     "nyc": "^13.1.0",
-    "postcss": "^7.0.2",
+    "postcss": "^8.4.7",
-    "postcss-apply": "^0.11.0",
+    "postcss-apply": "^0.12.0",
-    "postcss-color-hex-alpha": "^5.0.2",
+    "postcss-color-hex-alpha": "^8.0.3",
     "postcss-color-mod-function": "^3.0.3",
-    "postcss-custom-media": "^7.0.7",
+    "postcss-custom-media": "^8.0.0",
-    "postcss-custom-properties": "^8.0.8",
+    "postcss-custom-properties": "^12.1.4",
-    "postcss-custom-selectors": "^5.1.2",
+    "postcss-custom-selectors": "^6.0.0",
-    "postcss-font-family-system-ui": "^4.1.0",
+    "postcss-font-family-system-ui": "^5.0.0",
-    "postcss-loader": "^3.0.0",
+    "postcss-loader": "^6.2.1",
-    "postcss-media-minmax": "^4.0.0",
+    "postcss-media-minmax": "^5.0.0",
-    "postcss-nested": "^4.1.0",
+    "postcss-nested": "^5.0.6",
     "postcss-nested-ancestors": "^2.0.0",
-    "postcss-nesting": "^7.0.0",
+    "postcss-nesting": "^10.1.3",
     "postcss-smart-import": "^0.7.6",
     "rimraf": "^3.0.2",
     "sinon": "^11.1.2",
     "ts-mocha": "^8.0.0",
     "typescript": "^4.3.5",
-    "webpack": "^4.17.1",
+    "webpack": "^5.70.0",
-    "webpack-cli": "^3.1.0"
+    "webpack-cli": "^4.9.2"
   }
 }

public/dist/code-styling.css

@@ -1,3 +1,6 @@
+/*!*********************************************************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/highlight.js/styles/github.css ***!
+  \*********************************************************************************************************************************************************************/
 /*!
   Theme: GitHub
   Description: Light theme as seen on github.com
@@ -7,5 +10,8 @@
 
   Outdated base version: https://github.com/primer/github-syntax-light
   Current colors taken from GitHub's CSS
-*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#005cc5}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-code,.hljs-comment,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}
+*/.hljs{background:#fff;color:#24292e}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#005cc5}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-code,.hljs-comment,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{background-color:#f0fff4;color:#22863a}.hljs-deletion{background-color:#ffeef0;color:#b31d28}
-.diff{display:inline-block;width:100%}.diff span{color:inherit!important}.diff--added{color:#277030;background-color:#e2fce7}.diff--added:before{content:"+";opacity:.4}.diff--removed{color:#ae363c;background-color:#ffe6e6}.diff--removed:before{content:"-";opacity:.4}
+/*!*******************************************************************************************************************************************************!*\
+  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js!./src/frontend/styles/diff.pcss ***!
+  \*******************************************************************************************************************************************************/
+.diff{display:inline-block;width:100%}.diff span{color:inherit!important}.diff--added{background-color:#e2fce7;color:#277030}.diff--added:before{content:"+";opacity:.4}.diff--removed{background-color:#ffe6e6;color:#ae363c}.diff--removed:before{content:"-";opacity:.4}

public/dist/editor.bundle.js.LICENSE.txt

@@ -0,0 +1,68 @@
+/*! For license information please see editor.js.LICENSE.txt */
+
+/**
+ * CodeTool for Editor.js
+ *
+ * @author CodeX (team@ifmo.su)
+ * @copyright CodeX 2018
+ * @license MIT
+ * @version 2.0.0
+ */
+
+/**
+ * Delimiter Block for the Editor.js.
+ *
+ * @author CodeX (team@ifmo.su)
+ * @copyright CodeX 2018
+ * @license The MIT License (MIT)
+ * @version 2.0.0
+ */
+
+/**
+ * Header block for the Editor.js.
+ *
+ * @author CodeX (team@ifmo.su)
+ * @copyright CodeX 2018
+ * @license MIT
+ * @version 2.0.0
+ */
+
+/**
+ * Image Tool for the Editor.js
+ *
+ * @author CodeX <team@codex.so>
+ * @license MIT
+ * @see {@link https://github.com/editor-js/image}
+ *
+ * To developers.
+ * To simplify Tool structure, we split it to 4 parts:
+ *  1) index.js — main Tool's interface, public API and methods for working with data
+ *  2) uploader.js — module that has methods for sending files via AJAX: from device, by URL or File pasting
+ *  3) ui.js — module for UI manipulations: render, showing preloader, etc
+ *  4) tunes.js — working with Block Tunes: render buttons, handle clicks
+ *
+ * For debug purposes there is a testing server
+ * that can save uploaded files and return a Response {@link UploadResponseFormat}
+ *
+ *       $ node dev/server.js
+ *
+ * It will expose 8008 port, so you can pass http://localhost:8008 with the Tools config:
+ *
+ * image: {
+ *   class: ImageTool,
+ *   config: {
+ *     endpoints: {
+ *       byFile: 'http://localhost:8008/uploadFile',
+ *       byUrl: 'http://localhost:8008/fetchUrl',
+ *     }
+ *   },
+ * },
+ */
+
+/**
+ * Raw HTML Tool for CodeX Editor
+ *
+ * @author CodeX (team@codex.so)
+ * @copyright CodeX 2018
+ * @license The MIT License (MIT)
+ */

public/dist/main.bundle.js.LICENSE.txt

@@ -0,0 +1,8 @@
+/*!
+ * CodeX Module Dispatcher — Initialize frontend Modules from the DOM without inline scripts
+ * 
+ * @copyright CodeX Team <team@ifmo.su>
+ * @license MIT https://github.com/codex-team/dispatcher/LICENSE
+ * @author @polinashneider https://github.com/polinashneider
+ * @version 2.0.0
+ */

src/backend/exceptions/httpException.ts

@@ -5,17 +5,17 @@
  * @property {string} message - detail about the exception
  */
 class HttpException extends Error {
-    public status: number;
+  public status: number;
-    public message: string;
+  public message: string;
-    /**
+  /**
-     * @param status - status of the exception
+   * @param status - status of the exception
-     * @param message - message about the exception
+   * @param message - message about the exception
-     */
+   */
-    constructor(status: number, message: string) {
+  constructor(status: number, message: string) {
-      super(message);
+    super(message);
-      this.status = status;
+    this.status = status;
-      this.message = message;
+    this.message = message;
-    }
+  }
 }
 
 export default HttpException;

src/frontend/js/app.js

@@ -1,9 +1,10 @@
 // No inspection for unused var `css` because it's used for css bundle
 // eslint-disable-next-line no-unused-vars
-import css from '../styles/main.pcss';
+import '../styles/main.pcss';
 
 /**
  * Module Dispatcher
+ *
  * @see {@link https://github.com/codex-team/moduleDispatcher}
  * @author CodeX
  */
@@ -21,7 +22,7 @@ import Extensions from './modules/extensions';
  */
 class Docs {
   /**
-   * @constructor
+   * @class
    */
   constructor() {
     this.writing = new Writing();
@@ -40,7 +41,7 @@ class Docs {
    */
   docReady() {
     this.moduleDispatcher = new ModuleDispatcher({
-      Library: window.Docs
+      Library: this,
     });
   }
 }

src/frontend/js/classes/codeStyler.js

@@ -3,8 +3,8 @@ import javascript from 'highlight.js/lib/languages/javascript';
 import xml from 'highlight.js/lib/languages/xml';
 import json from 'highlight.js/lib/languages/json';
 import css from 'highlight.js/lib/languages/css';
-import style from 'highlight.js/styles/github.css'; // eslint-disable-line no-unused-vars
+import 'highlight.js/styles/github.css';
-import diffStyles from '../../styles/diff.pcss'; // eslint-disable-line no-unused-vars
+import '../../styles/diff.pcss';
 
 /**
  * @class CodeStyles

webpack.config.js

@@ -1,4 +1,5 @@
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const path = require('path');
 
 /**
  * Options for the Babel
@@ -11,20 +12,23 @@ const babelLoader = {
       [
         '@babel/preset-env',
         {
-          'useBuiltIns': 'usage'
+          'useBuiltIns': 'usage',
-        }
+        },
-      ]
+      ],
     ],
     plugins: [
-      '@babel/plugin-syntax-dynamic-import'
+      '@babel/plugin-syntax-dynamic-import',
-    ]
+    ],
-  }
+  },
 };
 
-module.exports = (env) => {
+module.exports = () => {
   return {
+    entry: './src/frontend/js/app.js',
     output: {
-      libraryExport: 'default' // uses to export .default field of app.js exported class instance
+      filename: '[name].bundle.js',
+      path: path.resolve(__dirname, './public/dist'),
+      libraryExport: 'default', // uses to export .default field of app.js exported class instance
     },
     module: {
       rules: [
@@ -36,41 +40,36 @@ module.exports = (env) => {
               options: {
                 // you can specify a publicPath here
                 // by default it use publicPath in webpackOptions.output
-                publicPath: '../'
+                publicPath: '../',
-              }
+              },
             },
             {
               loader: 'css-loader',
               options: {
-                importLoaders: 1
+                importLoaders: 1,
-              }
+              },
             },
             {
               loader: 'postcss-loader',
-              options: {
+            },
-                config: {
+          ],
-                  path: './src/frontend/'
-                }
-              }
-            }
-          ]
         }, {
           test: /\.js$/,
           exclude: /(node_modules|bower_components)/,
           use: [
-            babelLoader
+            babelLoader,
-          ]
+          ],
-        }
+        },
-      ]
+      ],
     },
     plugins: [
       new MiniCssExtractPlugin({
         // Options similar to the same options in webpackOptions.output
-        filename: '[name].css'
+        filename: '[name].css',
-      })
+      }),
     ],
     optimization: {
-      splitChunks: false
+      splitChunks: false,
-    }
+    },
   };
 };