bug fixes

packages/ui-default/build/config/webpack.ts

@@ -89,6 +89,7 @@ export default function (env: { watch?: boolean, production?: boolean, measure?:
     output: {
       path: root('public'),
       publicPath: '/', // overwrite in entry.js
+      workerPublicPath: '/',
       hashFunction: 'sha1',
       hashDigest: 'hex',
       hashDigestLength: 10,

packages/ui-default/build/main.ts

@@ -49,7 +49,10 @@ async function runWebpack({
         return;
       }
       if (argv.options.detail) console.log(stats.toString());
-      if (!watch && (!stats || stats.hasErrors())) process.exitCode = 1;
+      if (!watch && (!stats || stats.hasErrors())) {
+        if (!argv.options.detail) console.log(stats.toString());
+        process.exitCode = 1;
+      }
       resolve(stats);
     }
     if (watch) compiler.watch({}, compilerCallback);

packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx

@@ -24,9 +24,8 @@ const Component = React.forwardRef<any, any>((props, ref) => {
   );
 });
 
-export default class CustomSelectAutoComplete<Multi extends boolean> extends AutoComplete {
+export default class CustomSelectAutoComplete<Multi extends boolean> extends AutoComplete<CustomSelectOptions> {
   static DOMAttachKey = 'ucwCustomSelectAutoCompleteInstance';
-  options: CustomSelectOptions & AutoCompleteOptions;
 
   constructor($dom, options: CustomSelectOptions & AutoCompleteOptions<Multi>) {
     super($dom, {

packages/ui-default/components/autocomplete/FileSelectAutoComplete.tsx

@@ -27,9 +27,8 @@ const Component = React.forwardRef<any, any>((props, ref) => {
   );
 });
 
-export default class FileSelectAutoComplete<Multi extends boolean> extends AutoComplete {
+export default class FileSelectAutoComplete<Multi extends boolean> extends AutoComplete<FileSelectOptions> {
   static DOMAttachKey = 'ucwFileSelectAutoCompleteInstance';
-  options: FileSelectOptions & AutoCompleteOptions;
 
   constructor($dom, options: FileSelectOptions & AutoCompleteOptions<Multi>) {
     super($dom, {

packages/ui-default/components/autocomplete/index.tsx

@@ -8,6 +8,7 @@ export interface AutoCompleteOptions<Multi extends boolean = boolean> {
   defaultItems?: string;
   width?: string;
   height?: string;
+  classes?: string;
   listStyle?: any;
   allowEmptyQuery?: boolean;
   freeSolo?: boolean;
@@ -18,17 +19,17 @@ export interface AutoCompleteOptions<Multi extends boolean = boolean> {
   text?: () => string;
 }
 
-export default class AutoComplete extends DOMAttachedObject {
+export default class AutoComplete<Options extends Record<string, any> = {}> extends DOMAttachedObject {
   static DOMAttachKey = 'ucwAutoCompleteInstance';
   ref = null;
   container = document.createElement('div');
-  options: AutoCompleteOptions;
+  options: AutoCompleteOptions & Options;
   component = ReactDOM.createRoot(this.container);
   changeListener = [
     (val) => this.$dom.val(val),
   ];
 
-  constructor($dom, options = {}) {
+  constructor($dom, options = {} as Options) {
     super($dom);
     this.options = {
       items: async () => [],

packages/ui-default/components/message/index.page.ts

@@ -1,5 +1,4 @@
 import { nanoid } from 'nanoid';
-import ReconnectingWebsocket from 'reconnecting-websocket';
 import { InfoDialog } from 'vj/components/dialog';
 import VjNotification from 'vj/components/notification/index';
 import {
@@ -7,6 +6,7 @@ import {
 } from 'vj/constant/message';
 import { AutoloadPage } from 'vj/misc/Page';
 import { i18n, tpl } from 'vj/utils';
+import Sock from '../socket';
 
 let previous: VjNotification;
 const onmessage = (msg) => {
@@ -128,12 +128,8 @@ const messagePage = new AutoloadPage('messagePage', (pagename) => {
     isMaster = true;
     localStorage.setItem('page.master', selfId);
     const masterChannel = new BroadcastChannel('hydro-messages');
-    const sock = new ReconnectingWebsocket(endpoint);
-    sock.onopen = () => console.log('Connected');
-    sock.onerror = console.error;
-    sock.onclose = (...args) => console.log('Closed', ...args);
+    const sock = new Sock(endpoint);
     sock.onmessage = async (message) => {
-      if (process.env.NODE_ENV !== 'production') console.log('onmessage: ', message);
       const payload = JSON.parse(message.data);
       masterChannel.postMessage({ type: 'message', payload });
     };

packages/ui-default/entry.js

@@ -31,7 +31,7 @@ window.UserContext = JSON.parse(window.UserContext);
 if (process.env.NODE_ENV === 'production' && !UiContext.sentry_disable) {
   window.captureException = (e) => Sentry.captureException(e);
   Sentry.init({
-    dsn: UiContext.sentry_dsn || 'https://04d1d77b095231d55e1202bdc912ff16@sentry.hydro.ac/3',
+    dsn: UiContext.sentry_dsn || 'https://2f95d53751e08c74c1af1c4b93ccaff7@sentry.hydro.ac/2',
     release: process.env.VERSION,
     integrations: [
       Sentry.browserTracingIntegration(),

packages/ui-default/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.51.0",
+  "version": "4.51.1",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "index.ts",
@@ -51,6 +51,7 @@
     "clean-webpack-plugin": "^4.0.0",
     "clipboard": "^2.0.11",
     "copy-webpack-plugin": "^12.0.2",
+    "core-js": "^3.37.1",
     "css-loader": "^6.11.0",
     "diff": "^5.2.0",
     "diff-dom": "^5.1.3",
@@ -90,7 +91,6 @@
     "prop-types": "^15.8.1",
     "qface": "^1.4.1",
     "qrcode": "^1.5.3",
-    "queue-microtask": "^1.2.3",
     "react": "^18.3.1",
     "react-colorful": "^5.6.1",
     "react-dnd": "^16.0.1",

packages/ui-default/polyfill.ts

@@ -1,9 +1,8 @@
 import 'matchmedia-polyfill';
+import 'core-js/stable';
 
 import browserUpdate from 'browser-update';
-import queueMicrotask from 'queue-microtask';
 
-window.queueMicrotask = queueMicrotask;
 browserUpdate({
   required: {
     e: -10, f: -10, o: -3, s: -1, c: -10,

packages/ui-default/templates/layout/html5.html

@@ -47,7 +47,7 @@
       var _htmlNode = document.documentElement;
       _htmlNode.className = _htmlNode.className.replace(' nojs', ' hasjs');
       try {
-        import('data:text/javascript,');Object.fromEntries([]);window.matchMedia('all').addEventListener('change',()=>{});
+        import('data:text/javascript,');Object.fromEntries([]);window.matchMedia('all').addEventListener('change',()=>{});Array.prototype.at(0);
       } catch(e) {
         const s = document.createElement('script');
         s.async = false;

packages/ui-default/utils/base.ts

@@ -34,8 +34,8 @@ export function secureRandomString(digit = 32, dict = defaultDict) {
 
 type Substitution = string | number | { templateRaw: true, html: string };
 
-export function tpl(node: React.ReactNode, reactive?: boolean);
-export function tpl(pieces: TemplateStringsArray, ...substitutions: Substitution[]);
+export function tpl<T extends boolean>(node: React.ReactNode, reactive?: T): T extends true ? React.ReactElement : string;
+export function tpl(pieces: TemplateStringsArray, ...substitutions: Substitution[]): string;
 export function tpl(pieces: TemplateStringsArray | React.ReactNode, ...substitutions: Substitution[] | boolean[]) {
   if (React.isValidElement(pieces)) {
     if (substitutions[0]) {
@@ -49,7 +49,7 @@ export function tpl(pieces: TemplateStringsArray | React.ReactNode, ...substitut
   for (let i = 0; i < substitutions.length; ++i) {
     const subst = substitutions[i];
     let substHtml: string;
-    if (typeof subst === 'object' && subst.templateRaw) {
+    if (subst && typeof subst === 'object' && subst.templateRaw) {
       substHtml = subst.html;
     } else substHtml = _.escape(String(subst));
     result += substHtml + pieces[i + 1];