diff --git a/packages/ui-default/backendlib/template.js b/packages/ui-default/backendlib/template.js
index 67515aac7..d9a686401 100644
--- a/packages/ui-default/backendlib/template.js
+++ b/packages/ui-default/backendlib/template.js
@@ -175,7 +175,7 @@ async function render(name, state) {
       perm: global.Hydro.model.builtin.PERM,
       PRIV: global.Hydro.model.builtin.PRIV,
       STATUS: global.Hydro.model.builtin.STATUS,
-      UiContext: state.handler.UiContext,
+      UiContext: state.handler?.UiContext || {},
     }, (err, res) => {
       if (err) reject(err);
       else resolve(res);
diff --git a/packages/ui-default/handler.ts b/packages/ui-default/handler.ts
index 8ee3d7ef7..958c814a8 100644
--- a/packages/ui-default/handler.ts
+++ b/packages/ui-default/handler.ts
@@ -6,16 +6,26 @@ import { ObjectID } from 'mongodb';
 import * as bus from 'hydrooj/src/service/bus';
 import { Route, Handler } from 'hydrooj/src/service/server';
 import { PERM, PRIV } from 'hydrooj/src/model/builtin';
+import * as system from 'hydrooj/src/model/system';
+import user from 'hydrooj/src/model/user';
+import * as contest from 'hydrooj/src/model/contest';
+import problem from 'hydrooj/src/model/problem';
+import * as setting from 'hydrooj/src/model/setting';
 import esbuild from 'esbuild';
 import { tmpdir } from 'os';
 import markdown from './backendlib/markdown';
 
-const {
-  system, user, setting, problem, contest,
-} = global.Hydro.model;
+declare module 'hydrooj/src/interface' {
+  interface UI {
+    esbuildPlugins?: esbuild.Plugin[]
+  }
+  interface SystemKeys {
+    'ui-default.nav_logo_dark': string;
+    'ui-default.nav_logo_dark_2x': string;
+  }
+}
 
-const pageFiles = Object.keys(global.Hydro.ui.manifest)
-  .filter((file) => file.endsWith('.page.js') || file.endsWith('.page.ts'));
+const pageFiles = Object.keys(global.Hydro.ui.manifest).filter(/\.page\.[jt]sx?$/.test);
 const build = esbuild.buildSync({
   format: 'iife',
   entryPoints: pageFiles.map((i) => join(global.Hydro.ui.manifest[i], i)),
@@ -26,6 +36,7 @@ const build = esbuild.buildSync({
   target: [
     'chrome60',
   ],
+  plugins: global.Hydro.ui.esbuildPlugins || [],
   minify: !process.env.DEV,
 });
 if (build.errors.length) console.error(build.errors);
diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json
index e4d3d0fa7..3cec7014b 100644
--- a/packages/ui-default/package.json
+++ b/packages/ui-default/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.38.3",
+  "version": "4.38.4",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
diff --git a/packages/ui-default/types.ts b/packages/ui-default/types.ts
index da16dcc3e..83c51cf22 100644
--- a/packages/ui-default/types.ts
+++ b/packages/ui-default/types.ts
@@ -1,7 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 declare let UserContext: any;
 declare let UiContext: any;
-declare let Hydro: any;
 // eslint-disable-next-line camelcase
 declare let node_modules: any;
 declare let LANGS: Record<string, import('@hydrooj/utils/lib/lang').LangConfig>;