core&ui: update renderer interface

packages/hydrooj/src/interface.ts

@@ -768,7 +768,6 @@ export interface Lib extends Record<string, any> {
     rank: typeof import('./lib/rank');
     rating: typeof import('./lib/rating');
     testdataConfig: typeof import('./lib/testdataConfig');
-    template?: any;
     problemSearch: ProblemSearch;
 }
 
@@ -788,6 +787,7 @@ export interface ModuleInterfaces {
         callback: (this: Handler, args: Record<string, any>) => Promise<OAuthUserResponse>;
     };
     hash: (password: string, salt: string, user: User) => boolean | string;
+    render: (name: string, state: any) => Promise<string>;
 }
 
 export interface HydroGlobal {

packages/hydrooj/src/service/layers/renderer.ts

@@ -14,7 +14,8 @@ export default (router, logger) => async (ctx: KoaContext, next) => {
             avatar: avatar(user?.avatar || '', 128),
             viewLang: ctx.translate('__id'),
         };
-        const engine = global.Hydro.lib.template?.render
+        const type = templateName.split('.')[1];
+        const engine = global.Hydro.module.render[type]
             || (() => JSON.stringify(args, serializer({
                 showDisplayName: user?.hasPerm(PERM.PERM_VIEW_DISPLAYNAME),
             })));

packages/ui-default/backendlib/template.ts

@@ -1,15 +1,16 @@
-const path = require('path');
+import { findFileSync } from '@hydrooj/utils/lib/utils';
-const { serialize, fs, yaml } = require('hydrooj');
+import {
-const nunjucks = require('nunjucks');
+  avatar, buildContent, Context,
-const jsesc = require('jsesc');
+  fs, PERM, PRIV,
+  serialize, STATUS, yaml,
+} from 'hydrooj';
+import jsesc from 'jsesc';
+import nunjucks from 'nunjucks';
+import path from 'path';
+import markdown from './markdown';
+import { ensureTag, xss } from './markdown-it-xss';
+import * as misc from './misc';
 const argv = require('cac')().parse();
-const { findFileSync } = require('@hydrooj/utils/lib/utils');
-const status = require('@hydrooj/utils/lib/status');
-const markdown = require('./markdown');
-const { xss, ensureTag } = require('./markdown-it-xss');
-const misc = require('./misc');
-
-const { buildContent, avatar } = global.Hydro.lib;
 
 let { template } = argv.options;
 if (template && typeof template !== 'string') template = findFileSync('@hydrooj/ui-default/templates');
@@ -71,8 +72,8 @@ class Nunjucks extends nunjucks.Environment {
     this.addFilter('dumpYaml', (self) => yaml.dump(self));
     this.addFilter('serialize', (self, ignoreFunction = true) => serialize(self, { ignoreFunction }));
     this.addFilter('assign', (self, data) => Object.assign(self, data));
-    this.addFilter('markdown', (self, html = false) => ensureTag(markdown.render(self, html)));
+    this.addFilter('markdown', (self) => ensureTag(markdown.render(self)));
-    this.addFilter('markdownInline', (self, html = false) => ensureTag(markdown.renderInline(self, html)));
+    this.addFilter('markdownInline', (self) => ensureTag(markdown.renderInline(self)));
     this.addFilter('ansi', (self) => misc.ansiToHtml(self));
     this.addFilter('base64_encode', (s) => Buffer.from(s).toString('base64'));
     this.addFilter('base64_decode', (s) => Buffer.from(s, 'base64').toString());
@@ -80,7 +81,7 @@ class Nunjucks extends nunjucks.Environment {
     this.addFilter('bitand', (self, val) => self & val);
     this.addFilter('toString', (self) => (typeof self === 'string' ? self : JSON.stringify(self, replacer)));
     this.addFilter('content', (content, language, html) => {
-      let s = '';
+      let s: any = '';
       try {
         s = JSON.parse(content);
       } catch {
@@ -97,7 +98,7 @@ class Nunjucks extends nunjucks.Environment {
       return ensureTag(html ? xss.process(s) : markdown.render(s));
     });
     this.addFilter('contentLang', (content) => {
-      let s = '';
+      let s: any = '';
       try {
         s = JSON.parse(content);
       } catch {
@@ -114,6 +115,7 @@ class Nunjucks extends nunjucks.Environment {
     });
   }
 }
+// @ts-ignore
 nunjucks.runtime.memberLookup = function memberLookup(obj, val) {
   if ((obj || {})._original) obj = obj._original;
   if (obj === undefined || obj === null) return undefined;
@@ -127,11 +129,6 @@ nunjucks.runtime.memberLookup = function memberLookup(obj, val) {
   return obj[val];
 };
 const env = new Nunjucks();
-env.addGlobal('static_url', (assetName) => {
-  // DEPRECATED
-  const cdnPrefix = process.env.DEV ? '/' : global.Hydro.model.system.get('server.cdn');
-  return `${cdnPrefix}${assetName}`;
-});
 // eslint-disable-next-line no-eval
 env.addGlobal('eval', eval);
 env.addGlobal('Date', Date);
@@ -145,7 +142,7 @@ env.addGlobal('typeof', (o) => typeof o);
 env.addGlobal('instanceof', (a, b) => a instanceof b);
 env.addGlobal('paginate', misc.paginate);
 env.addGlobal('size', misc.size);
-env.addGlobal('utils', { status });
+env.addGlobal('utils', { status: STATUS });
 env.addGlobal('avatarUrl', avatar);
 env.addGlobal('formatSeconds', misc.formatSeconds);
 env.addGlobal('lib', global.Hydro.lib);
@@ -165,27 +162,27 @@ env.addGlobal('set', (obj, key, val) => {
 env.addGlobal('findSubModule', (prefix) => Object.keys(global.Hydro.ui.template).filter((n) => n.startsWith(prefix)));
 env.addGlobal('templateExists', (name) => !!global.Hydro.ui.template[name]);
 
-async function render(name, state) {
+const render = (name: string, state: any) => new Promise<string>((resolve, reject) => {
-  return await new Promise((resolve, reject) => {
+  env.render(name, {
-    env.render(name, {
+    page_name: name.split('.')[0],
-      page_name: name.split('.')[0],
+    ...state,
-      ...state,
+    formatJudgeTexts: (texts) => texts.map((text) => {
-      formatJudgeTexts: (texts) => texts.map((text) => {
+      if (typeof text === 'string') return text;
-        if (typeof text === 'string') return text;
+      return state._(text.message).format(...text.params || []) + ((process.env.DEV && text.stack) ? `\n${text.stack}` : '');
-        return state._(text.message).format(...text.params || []) + ((process.env.DEV && text.stack) ? `\n${text.stack}` : '');
+    }).join('\n'),
-      }).join('\n'),
+    datetimeSpan: (arg0, arg1, arg2) => misc.datetimeSpan(arg0, arg1, arg2, state.handler.user?.timeZone),
-      datetimeSpan: (arg0, arg1, arg2) => misc.datetimeSpan(arg0, arg1, arg2, state.handler.user?.timeZone),
+    perm: PERM,
-      perm: global.Hydro.model.builtin.PERM,
+    PRIV,
-      PRIV: global.Hydro.model.builtin.PRIV,
+    STATUS,
-      STATUS: global.Hydro.model.builtin.STATUS,
+    UiContext: state.handler?.UiContext || {},
-      UiContext: state.handler?.UiContext || {},
+  }, (err, res) => {
-    }, (err, res) => {
+    if (err) reject(err);
-      if (err) reject(err);
+    else resolve(res);
-      else resolve(res);
-    });
   });
+});
+
+export async function apply(ctx: Context) {
+  ctx.provideModule('render', 'html', render);
+  ctx.provideModule('render', 'yaml', render);
+  ctx.provideModule('render', 'md', render);
 }
-
-module.exports = render;
-
-global.Hydro.lib.template = { render };

packages/ui-default/index.ts

@@ -145,7 +145,6 @@ export function apply(ctx: Context) {
   ctx.Route('markdown', '/markdown', MarkdownHandler);
   ctx.Route('config_schema', '/manage/config/schema.json', SystemConfigSchemaHandler, PRIV.PRIV_EDIT_SYSTEM);
   ctx.Route('media', '/media', RichMediaHandler);
-  ctx.plugin(require('./backendlib/builder'));
   ctx.on('handler/after/DiscussionRaw', async (that) => {
     if (that.args.render && that.response.type === 'text/markdown') {
       that.response.type = 'text/html';
@@ -164,4 +163,6 @@ export function apply(ctx: Context) {
       domains: SystemModel.get('ui-default.domains') || [],
     };
   });
+  ctx.plugin(require('./backendlib/template'));
+  ctx.plugin(require('./backendlib/builder'));
 }