ui: optimize resource load

packages/ui-default/modules.js

@@ -1,6 +1,8 @@
 import $ from 'jquery';
 import _ from 'lodash';
 import React from 'react';
+import ReactDOM from 'react-dom';
+import * as redux from 'react-redux';
 
 import './utils/delay';
 import './utils/emulateAnchorClick';
@@ -24,6 +26,15 @@ import './components/notification';
 import './components/nprogress';
 import './components/monaco/loader';
 
-window.node_modules = { _, $, React };
+const modules = {
+  _, $, React, redux, ReactDOM,
+};
+export default async function load(name) {
+  if (modules[name]) return modules[name];
+  if (name === 'echarts') return import('echarts');
+  if (name === 'moment') return import('moment');
+  throw new Error(`Module ${name} not found`);
+}
+window.node_modules = { ...modules, load };
 window.$ = $;
 window.jQuery = $;

packages/ui-default/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.38.25",
+  "version": "4.38.26",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
@@ -10,7 +10,7 @@
     "lint": "eslint"
   },
   "devDependencies": {
-    "@blueprintjs/core": "^4.6.0",
+    "@blueprintjs/core": "^4.7.0",
     "@fontsource/dm-mono": "^4.5.8",
     "@fontsource/fira-code": "^4.5.10",
     "@fontsource/inconsolata": "^4.5.6",
@@ -75,7 +75,7 @@
     "prism-themes": "^1.9.0",
     "prismjs": "^1.28.0",
     "prop-types": "^15.8.1",
-    "qrcode": "^1.5.0",
+    "qrcode": "^1.5.1",
     "queue-microtask": "^1.2.3",
     "raw-loader": "^4.0.2",
     "react": "^18.2.0",

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

@@ -1,10 +1,10 @@
 import { NamedPage } from 'vj/misc/Page';
-import Calendar from 'vj/components/calendar';
 import i18n from 'vj/utils/i18n';
 import { parse as parseMongoId } from 'vj/utils/mongoId';
 
-const page = new NamedPage('homework_main', () => {
+const page = new NamedPage('homework_main', async () => {
   // Homework Calendar
+  const { default: Calendar } = await import('vj/components/calendar');
   if (UiContext.docs) {
     const events = UiContext.docs.map((doc) => ({
       beginAt: doc.beginAt,