ui: remove babel

packages/ui-default/.eslintrc.js

@@ -3,8 +3,8 @@ const path = require('path');
 
 module.exports = {
   root: true,
-  parser: '@babel/eslint-parser',
+  parser: '@typescript-eslint/parser',
-  plugins: ['babel', 'react'],
+  plugins: ['@typescript-eslint', 'react'],
   env: {
     browser: true,
     es6: true,
@@ -14,15 +14,14 @@ module.exports = {
   extends: ['airbnb'],
   parserOptions: {
     sourceType: 'module',
-    ecmaVersion: 7,
+    ecmaVersion: 2020,
     ecmaFeatures: {
       impliedStrict: true,
       experimentalObjectRestSpread: true,
       jsx: true,
+      defaultParams: true,
       legacyDecorators: true,
-    },
+      allowImportExportEverywhere: true,
-    babelOptions: {
-      configFile: `${__dirname}/babel.config.js`,
     },
   },
   settings: {
@@ -48,21 +47,25 @@ module.exports = {
     window: true,
   },
   rules: {
+    '@typescript-eslint/dot-notation': 'off',
+    '@typescript-eslint/no-implied-eval': 'off',
+    '@typescript-eslint/no-throw-literal': 'off',
+    '@typescript-eslint/return-await': 'off',
+
     // FIXME A bug with eslint-parser
     'template-curly-spacing': 'off',
-    indent: 'off',
 
     'comma-dangle': [
       'error',
       'always-multiline',
     ],
-    // indent: [
+    indent: [
-    //   'error',
+      'error',
-    //   2,
+      2,
-    //   {
+      {
-    //     SwitchCase: 0,
+        SwitchCase: 0,
-    //   },
+      },
-    // ],
+    ],
     'max-len': ['error', 150],
     quotes: 'warn',
     'class-methods-use-this': 'off',

packages/ui-default/babel.config.js

@@ -1,46 +0,0 @@
-module.exports = {
-  plugins: [
-    'lodash',
-    '@babel/plugin-transform-runtime',
-    '@babel/plugin-syntax-dynamic-import',
-    '@babel/plugin-syntax-import-meta',
-    '@babel/plugin-proposal-json-strings',
-    ['@babel/plugin-proposal-class-properties', { loose: true }],
-    '@babel/plugin-proposal-function-sent',
-    '@babel/plugin-proposal-export-namespace-from',
-    '@babel/plugin-proposal-numeric-separator',
-    '@babel/plugin-proposal-throw-expressions',
-    [
-      'prismjs',
-      {
-        languages: [
-          'clike',
-          'c',
-          'cpp',
-          'pascal',
-          'java',
-          'python',
-          'java',
-          'python',
-          'php',
-          'rust',
-          'haskell',
-          'javascript',
-          'go',
-          'ruby',
-          'csharp',
-          'julia',
-        ],
-        plugins: [
-          'toolbar',
-          'line-numbers',
-        ],
-        css: true,
-      },
-    ],
-  ],
-  presets: [
-    ['@babel/preset-env', { loose: true, modules: false }],
-    '@babel/preset-react',
-  ],
-};

packages/ui-default/build/index.js

@@ -1,7 +1,34 @@
-require('@babel/register')({
+const esbuild = require('esbuild');
-    plugins: ['@babel/plugin-transform-runtime'],
+const fs = require('fs');
-    presets: [['@babel/preset-env', { loose: true }]],
+
+let transformTimeUsage = 0;
+let transformCount = 0;
+let displayTimeout;
+function transform(filename) {
+    const start = new Date();
+    const result = esbuild.buildSync({
+        entryPoints: [filename],
+        sourcemap: 'inline',
+        platform: 'node',
+        format: 'cjs',
+        target: 'node12',
+        jsx: 'transform',
+        write: false,
     });
+    if (result.warnings.length) console.warn(result.warnings);
+    transformTimeUsage += new Date().getTime() - start.getTime();
+    transformCount++;
+    if (displayTimeout) clearTimeout(displayTimeout);
+    displayTimeout = setTimeout(() => console.log(`Transformed ${transformCount} files. (${transformTimeUsage}ms)`), 1000);
+    return result.outputFiles[0].text;
+}
+require.extensions['.js'] = function loader(module, filename) {
+    if (!filename.includes('node_modules')) {
+        return module._compile(transform(filename), filename);
+    }
+    const content = fs.readFileSync(filename, 'utf-8');
+    return module._compile(content, filename);
+};
 const main = require('./main.js');
 
 if (!module.parent) main();

packages/ui-default/components/calendar/index.js

@@ -279,7 +279,7 @@ export default class Calendar {
           for (; vIndex < vIndexMax; ++vIndex) {
             if (_.every(_
               .range(beginDay, endDay + 1)
-              .map((day) => !dayBitmap[day][vIndex]) // eslint-disable-line no-loop-func
+              .map((day) => !dayBitmap[day][vIndex]), // eslint-disable-line no-loop-func
             )) { // eslint-disable-line function-paren-newline
               break;
             }

packages/ui-default/components/dialog/DomDialog.js

@@ -42,7 +42,7 @@ export default class DomDialog extends DOMAttachedObject {
       {
         duration: 100,
         easing: 'easeOutCubic',
-      }
+      },
     );
 
     const $dgContent = this.$dom.find('.dialog__content');

packages/ui-default/components/tab/Tab.js

@@ -66,7 +66,7 @@ export default class Tab extends DOMAttachedObject {
         {
           duration: TAB_TRANSITION_DURATION,
           easing: 'linear',
-        }
+        },
       );
     $newTab
       .transition(
@@ -74,7 +74,7 @@ export default class Tab extends DOMAttachedObject {
         {
           duration: TAB_TRANSITION_DURATION,
           easing: 'linear',
-        }
+        },
       );
     await this.$content
       .transition({

packages/ui-default/components/zipDownloader/index.js

@@ -86,7 +86,7 @@ export async function downloadProblemSet(pids, name = 'Export') {
       });
       let { links } = await request.post(
         `/d/${UiContext.domainId}/p/${pid}/files`,
-        { operation: 'get_links', files: (pdoc.data || []).map((i) => i.name), type: 'testdata' }
+        { operation: 'get_links', files: (pdoc.data || []).map((i) => i.name), type: 'testdata' },
       );
       for (const filename of Object.keys(links)) {
         targets.push({ filename: `${pid}/testdata/${filename}`, url: links[filename] });

packages/ui-default/entry.js

@@ -16,6 +16,6 @@ console.log(
  / __  / /_/ / /_/ / /  / /_/ /
 /_/ /_/\\__, /\\__,_/_/   \\____/ 
       /____/                   
-`
+`,
 );
 import('./hydro');

packages/ui-default/package.json

@@ -1,28 +1,15 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.16.4",
+  "version": "4.17.0",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
   "repository": "https://github.com/hydro-dev/Hydro.git",
   "preferUnplugged": true,
+  "scripts": {
+    "lint": "eslint ."
+  },
   "devDependencies": {
-    "@babel/cli": "^7.14.8",
-    "@babel/core": "^7.15.0",
-    "@babel/eslint-parser": "7.15.0",
-    "@babel/plugin-proposal-class-properties": "^7.14.5",
-    "@babel/plugin-proposal-export-namespace-from": "^7.14.5",
-    "@babel/plugin-proposal-function-sent": "^7.14.5",
-    "@babel/plugin-proposal-json-strings": "^7.14.5",
-    "@babel/plugin-proposal-numeric-separator": "^7.14.5",
-    "@babel/plugin-proposal-throw-expressions": "^7.14.5",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-syntax-import-meta": "^7.10.4",
-    "@babel/plugin-transform-runtime": "^7.15.0",
-    "@babel/preset-env": "^7.15.0",
-    "@babel/preset-react": "^7.14.5",
-    "@babel/register": "^7.14.5",
-    "@babel/runtime-corejs3": "^7.14.9",
     "@blockly/block-extension-tooltip": "^1.0.15",
     "@blueprintjs/core": "^3.47.0",
     "@blueprintjs/icons": "^3.27.0",
@@ -33,22 +20,20 @@
     "@undefined-moe/monaco-yaml": "^2.5.0",
     "ansi_up": "^5.0.1",
     "autoprefixer": "^9.8.6",
-    "babel-loader": "^8.2.2",
-    "babel-plugin-lodash": "^3.3.4",
-    "babel-plugin-prismjs": "^2.1.0",
     "blockly": "^6.20210701.0",
     "chalk": "^4.1.2",
     "classnames": "^2.3.1",
+    "clean-webpack-plugin": "^4.0.0-alpha.0",
     "clipboard": "^2.0.8",
     "copy-webpack-plugin": "^6.4.1",
     "css-loader": "^4.3.0",
     "diff-dom": "^4.2.2",
     "echarts": "^5.1.2",
     "emojify.js": "^1.1.0",
+    "esbuild-loader": "^2.14.0",
     "eslint": "^7.32.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-import-resolver-webpack": "^0.13.1",
-    "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.24.0",
@@ -111,9 +96,7 @@
     "webpackbar": "^5.0.0-3"
   },
   "dependencies": {
-    "clean-webpack-plugin": "^4.0.0-alpha.0",
     "esbuild": "^0.12.18",
-    "esbuild-loader": "^2.14.0",
     "js-yaml": "^4.1.0",
     "jsesc": "^3.0.2",
     "katex": "^0.13.13",

packages/ui-default/pages/problem_submit.page.js

@@ -7,7 +7,7 @@ function setOptions($el, options) {
   });
 }
 
-const page = new NamedPage(['problem_submit', 'contest_detail_problem_submit', 'homework_detail_problem_submit'], async (name) => {
+const page = new NamedPage(['problem_submit', 'contest_detail_problem_submit', 'homework_detail_problem_submit'], async () => {
   $(document).on('click', '[name="problem-sidebar__show-category"]', (ev) => {
     $(ev.currentTarget).hide();
     $('[name="problem-sidebar__categories"]').show();

packages/ui-default/tool/checkTranslation.js

@@ -1,106 +0,0 @@
-/* eslint-disable no-restricted-syntax */
-/* eslint-disable no-unused-vars */
-/* eslint-disable import/no-extraneous-dependencies */
-/* eslint-disable no-eval */
-const fs = require('fs');
-const path = require('path');
-const yaml = require('js-yaml');
-
-const name = process.argv[2];
-
-const IGNORE_CHECK = ['en'];
-const IGNORE_MISSING = [
-  '?', 'AC', 'ID', 'MD5', 'URL',
-];
-const RE_TEMPLATE = /_\(['"]([\s\S])*?['"]\)/gmi;
-const RE_UI = /i18n\(['"]([\s\S])*?['"](,.*?)?\)/gmi;
-const TEMPLATE_ROOT = path.resolve(__dirname, '..', 'templates');
-const LOCALE_ROOT = path.resolve(__dirname, '..', 'locales');
-const texts = {};
-const result = {};
-const locales = fs.readdirSync(LOCALE_ROOT);
-let currentFile = '';
-
-function _(str, format) {
-  if (!texts[str]) texts[str] = [currentFile];
-  else texts[str].push(currentFile);
-}
-const i18n = _; // lgtm [js/unused-local-variable]
-const Setting = _; // lgtm [js/unused-local-variable]
-
-function scanTemplate(folder, relative = 'templates') {
-  const files = fs.readdirSync(folder);
-  for (const file of files) {
-    const p = path.join(folder, file);
-    if (fs.statSync(p).isDirectory()) {
-      scanTemplate(p, path.join(relative, file));
-    } else {
-      currentFile = path.join(relative, file);
-      const f = fs.readFileSync(p).toString();
-      f.replace(RE_TEMPLATE, (substr) => {
-        try {
-          // eslint-disable-next-line no-eval
-          eval(substr);
-        } catch (e) {
-          console.error('Cannot parse: ', substr, ' in file ', p);
-        }
-      });
-    }
-  }
-}
-function scanUi(folder, relative = '') {
-  const files = fs.readdirSync(folder);
-  for (const file of files) {
-    const p = path.join(folder, file);
-    if (fs.statSync(p).isDirectory()) {
-      scanUi(p, path.join(relative, file));
-    } else {
-      currentFile = path.join(relative, file);
-      const f = fs.readFileSync(p).toString();
-      f.replace(RE_UI, (substr) => {
-        try {
-          eval(substr);
-        } catch (e) {
-          if (e.message.endsWith('is not defined')) {
-            global[e.message.split(' ')[0]] = () => { };
-            try {
-              eval(substr);
-            } catch (err) {
-              console.error('Cannot parse: ', substr, ' in file ', p);
-            }
-          } else console.error('Cannot parse: ', substr, ' in file ', p);
-        }
-      });
-    }
-  }
-}
-scanTemplate(TEMPLATE_ROOT);
-scanUi(path.join(process.cwd(), 'components'));
-scanUi(path.join(process.cwd(), 'pages'));
-scanUi(path.join(process.cwd(), 'misc'));
-if (!name) {
-  for (const locale of locales) {
-    if (!IGNORE_CHECK.includes(locale.split('.')[0])) {
-      const p = path.join(LOCALE_ROOT, locale);
-      const f = fs.readFileSync(p).toString();
-      const l = yaml.safeLoad(f);
-      for (const str in texts) {
-        if (!l[str]) {
-          if (result[str]) result[str].locale.push(locale);
-          else result[str] = { source: texts[str], locale: [locale] };
-        }
-      }
-    }
-  }
-} else {
-  const p = path.join(LOCALE_ROOT, name);
-  const f = fs.readFileSync(p).toString();
-  const l = yaml.safeLoad(f);
-  for (const str in texts) {
-    if (!l[str]) result[str] = texts[str];
-  }
-}
-for (const str of IGNORE_MISSING) delete result[str];
-console.log(`${Object.keys(result).length} translations missing.`);
-fs.writeFileSync(path.join(__dirname, '..', '__result.json'), JSON.stringify(result, null, 2));
-console.log(`Result wrote to ${path.resolve(__dirname, '..', '__result.json')}`);

packages/ui-default/utils/request.js

@@ -1,5 +1,4 @@
 import i18n from './i18n';
-import substitute from './substitute';
 
 const request = {
   /**
@@ -24,7 +23,7 @@ const request = {
           } else if (typeof jqXHR.responseJSON === 'object' && jqXHR.responseJSON.error) {
             const { error } = jqXHR.responseJSON;
             if (error.params) {
-              const message = substitute(error.message, ...error.params);
+              const message = i18n(error.message, ...error.params);
               const err = new Error(message);
               err.rawMessage = error.message;
               err.params = error.params;