feat: sync title attribute with board title, closes #584

felixmosh · Jun 16, 2023 · 00a122e · 00a122e
1 parent 614cd03
commit 00a122e
Show file tree

Hide file tree

Showing 11 changed files with 54 additions and 50 deletions.
diff --git a/package.json b/package.json
@@ -100,5 +100,6 @@
   "resolutions": {
     "@types/react": "^17.0.14",
     "@types/react-dom": "^17.0.14"
-  }
+  },
+  "dependencies": {}
 }
diff --git a/packages/api/src/handlers/entryPoint.ts b/packages/api/src/handlers/entryPoint.ts
@@ -1,5 +1,16 @@
-import { ViewHandlerReturnType } from '../../typings/app';
+import { UIConfig, ViewHandlerReturnType } from '../../typings/app';
 
-export function entryPoint(): ViewHandlerReturnType {
-  return { name: 'index.ejs' };
+export function entryPoint(params: {
+  basePath: string;
+  uiConfig: UIConfig;
+}): ViewHandlerReturnType {
+  const basePath = params.basePath.endsWith('/') ? params.basePath : `${params.basePath}/`;
+  const uiConfig = JSON.stringify(params.uiConfig)
+    .replace(/</g, '\\u003c')
+    .replace(/>/g, '\\u003e');
+
+  return {
+    name: 'index.ejs',
+    params: { basePath, uiConfig, title: params.uiConfig.boardTitle as string },
+  };
 }
diff --git a/packages/api/src/index.ts b/packages/api/src/index.ts
@@ -15,13 +15,17 @@ export function createBullBoard({
   options?: BoardOptions;
 }) {
   const { bullBoardQueues, setQueues, replaceQueues, addQueue, removeQueue } = getQueuesApi(queues);
-  const uiBasePath = options.uiBasePath || path.dirname(eval(`require.resolve('@bull-board/ui/package.json')`));
+  const uiBasePath =
+    options.uiBasePath || path.dirname(eval(`require.resolve('@bull-board/ui/package.json')`));
 
   serverAdapter
     .setQueues(bullBoardQueues)
     .setViewsPath(path.join(uiBasePath, 'dist'))
     .setStaticPath('/static', path.join(uiBasePath, 'dist/static'))
-    .setUIConfig(options.uiConfig)
+    .setUIConfig({
+      boardTitle: 'Bull Dashboard',
+      ...options.uiConfig,
+    })
     .setEntryRoute(appRoutes.entryPoint)
     .setErrorHandler(errorHandler)
     .setApiRoutes(appRoutes.api);

diff --git a/packages/api/typings/app.ts b/packages/api/typings/app.ts
@@ -117,6 +117,7 @@ export type ControllerHandlerReturnType = {
 
 export type ViewHandlerReturnType = {
   name: string;
+  params: Record<string, string>;
 };
 
 export type Promisify<T> = T | Promise<T>;
@@ -132,7 +133,7 @@ export interface AppViewRoute {
   method: HTTPMethod;
   route: string | string[];
 
-  handler(request?: BullBoardRequest): ViewHandlerReturnType;
+  handler(params: { basePath: string; uiConfig: UIConfig }): ViewHandlerReturnType;
 }
 
 export type AppRouteDefs = {

diff --git a/packages/express/src/ExpressAdapter.ts b/packages/express/src/ExpressAdapter.ts
@@ -86,18 +86,13 @@ export class ExpressAdapter implements IServerAdapter {
   }
 
   public setEntryRoute(routeDef: AppViewRoute): ExpressAdapter {
-    const { name } = routeDef.handler();
-
     const viewHandler = (_req: Request, res: Response) => {
-      const basePath = this.basePath.endsWith('/') ? this.basePath : `${this.basePath}/`;
-      const uiConfig = JSON.stringify(this.uiConfig)
-        .replace(/</g, '\\u003c')
-        .replace(/>/g, '\\u003e');
-
-      res.render(name, {
-        basePath,
-        uiConfig,
+      const { name, params } = routeDef.handler({
+        basePath: this.basePath,
+        uiConfig: this.uiConfig,
       });
+
+      res.render(name, params);
     };
 
     this.app[routeDef.method](routeDef.route, viewHandler);

diff --git a/packages/fastify/src/FastifyAdapter.ts b/packages/fastify/src/FastifyAdapter.ts
@@ -24,7 +24,9 @@ export class FastifyAdapter implements IServerAdapter {
   private errorHandler: ((error: Error) => ControllerHandlerReturnType) | undefined;
   private statics: { path: string; route: string } | undefined;
   private viewPath: string | undefined;
-  private entryRoute: { method: HTTPMethods; routes: string[]; filename: string } | undefined;
+  private entryRoute:
+    | { method: HTTPMethods; routes: string[]; handler: AppViewRoute['handler'] }
+    | undefined;
   private apiRoutes: Array<FastifyRouteDef> | undefined;
   private uiConfig: UIConfig = {};
 
@@ -68,12 +70,10 @@ export class FastifyAdapter implements IServerAdapter {
   }
 
   public setEntryRoute(routeDef: AppViewRoute): FastifyAdapter {
-    const { name } = routeDef.handler();
-
     this.entryRoute = {
       method: routeDef.method.toUpperCase() as HTTPMethods,
       routes: ([] as string[]).concat(routeDef.route),
-      filename: name,
+      handler: routeDef.handler,
     };
 
     return this;
@@ -117,18 +117,15 @@ export class FastifyAdapter implements IServerAdapter {
         prefix: this.statics.route,
       });
 
-      const { method, routes, filename } = this.entryRoute;
+      const { method, routes, handler } = this.entryRoute;
       routes.forEach((url) =>
         fastify.route({
           method,
           url,
           handler: (_req, reply) => {
-            const basePath = this.basePath.endsWith('/') ? this.basePath : `${this.basePath}/`;
-            const uiConfig = JSON.stringify(this.uiConfig)
-              .replace(/</g, '\\u003c')
-              .replace(/>/g, '\\u003e');
+            const { name, params } = handler({ basePath: this.basePath, uiConfig: this.uiConfig });
 
-            return reply.view(filename, { basePath, uiConfig });
+            return reply.view(name, params);
           },
         })
       );

diff --git a/packages/hapi/src/HapiAdapter.ts b/packages/hapi/src/HapiAdapter.ts
@@ -132,13 +132,12 @@ export class HapiAdapter implements IServerAdapter {
             path: toHapiPath(path),
             options,
             handler: (_request, h) => {
-              const { name } = handler();
-              const basePath = this.basePath.endsWith('/') ? this.basePath : `${this.basePath}/`;
-              const uiConfig = JSON.stringify(this.uiConfig)
-                .replace(/</g, '\\u003c')
-                .replace(/>/g, '\\u003e');
+              const { name, params } = handler({
+                basePath: this.basePath,
+                uiConfig: this.uiConfig,
+              });
 
-              return h.view(name, { basePath, uiConfig });
+              return h.view(name, params);
             },
           })
         );

diff --git a/packages/koa/src/KoaAdapter.ts b/packages/koa/src/KoaAdapter.ts
@@ -107,21 +107,21 @@ export class KoaAdapter implements IServerAdapter {
 
     app.use(
       views(this.viewPath, {
-        extension: path.extname(this.entryRoute.handler().name).substring(1),
+        extension: path
+          .extname(
+            this.entryRoute.handler({ basePath: this.basePath, uiConfig: this.uiConfig }).name
+          )
+          .substring(1),
       })
     );
 
     const { method, route, handler } = this.entryRoute;
     const viewRoutes = Array.isArray(route) ? route : [route];
     viewRoutes.forEach((path) => {
       router[method](path, async (ctx) => {
-        const { name } = handler();
-        const basePath = this.basePath.endsWith('/') ? this.basePath : `${this.basePath}/`;
-        const uiConfig = JSON.stringify(this.uiConfig)
-          .replace(/</g, '\\u003c')
-          .replace(/>/g, '\\u003e');
+        const { name, params } = handler({ basePath: this.basePath, uiConfig: this.uiConfig });
 
-        await (ctx as any).render(name, { basePath, uiConfig });
+        await (ctx as any).render(name, params);
       });
     });
 

diff --git a/packages/ui/src/index.ejs b/packages/ui/src/index.ejs
@@ -5,7 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
     <meta name="robots" content="noindex" />
     <base href="<%= basePath %>" />
-    <title>Bull Dashboard</title>
+    <title><%= title %></title>
     <link rel="alternate icon" type="image/png" href="static/favicon-32x32.png">
     <link rel="icon" type="image/svg+xml" id="fav-logo" href="static/images/logo.svg">
     <link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500&display=swap" rel="stylesheet">

diff --git a/packages/ui/webpack.config.js b/packages/ui/webpack.config.js
@@ -98,6 +98,7 @@ module.exports = {
       templateParameters: {
         basePath,
         uiConfig: '<%- uiConfig %>',
+        title: '<%= title %>',
       },
       inject: 'body',
     }),

diff --git a/yarn.lock b/yarn.lock
@@ -4952,15 +4952,10 @@ caniuse-api@^3.0.0:
     lodash.memoize "^4.1.2"
     lodash.uniq "^4.5.0"
 
-caniuse-lite@^1.0.0:
-  version "1.0.30001332"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001332.tgz#39476d3aa8d83ea76359c70302eafdd4a1d727dd"
-  integrity sha512-10T30NYOEQtN6C11YGg411yebhvpnC6Z102+B95eAsN0oB6KUs01ivE8u+G6FMIRtIrVlYXhL+LUwQ3/hXwDWw==
-
-caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001426:
-  version "1.0.30001436"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001436.tgz#22d7cbdbbbb60cdc4ca1030ccd6dea9f5de4848b"
-  integrity sha512-ZmWkKsnC2ifEPoWUvSAIGyOYwT+keAaaWPHiQ9DfMqS1t6tfuyFYoWR78TeZtznkEQ64+vGXH9cZrElwR2Mrxg==
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001426:
+  version "1.0.30001503"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001503.tgz"
+  integrity sha512-Sf9NiF+wZxPfzv8Z3iS0rXM1Do+iOy2Lxvib38glFX+08TCYYYGR5fRJXk4d77C4AYwhUjgYgMsMudbh2TqCKw==
 
 caseless@~0.12.0:
   version "0.12.0"