Merge pull request #273 from devforth/AdminForth/711

feat: add possibility to pass function into the loginPromptHTML

Author: SerVitasik

adminforth/commands/createApp/templates/index.ts.hbs

@@ -15,6 +15,12 @@ export const admin = new AdminForth({
     rememberMeDays: 30,
     loginBackgroundImage: 'https://images.unsplash.com/photo-1534239697798-120952b76f2b?q=80&w=3389&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
     loginBackgroundPosition: '1/2',
+    loginPromptHTML: async () => { 
+      const adminforthUserExists = await admin.resource("users").count(Filters.EQ('email', 'adminforth')) > 0;
+      if (adminforthUserExists) {
+        return "Please use <b>adminforth</b> as username and <b>adminforth</b> as password"
+      }
+    },
   },
   customization: {
     brandName: "{{appName}}",

adminforth/modules/restApi.ts

@@ -13,7 +13,7 @@ import {
   IAdminForthAndOrFilter,
 } from "../types/Back.js";
 
-import { ADMINFORTH_VERSION, listify, md5hash } from './utils.js';
+import { ADMINFORTH_VERSION, listify, md5hash, getLoginPromptHTML } from './utils.js';
 
 import AdminForthAuth from "../auth.js";
 import { ActionCheckSource, AdminForthConfigMenuItem, AdminForthDataTypes, AdminForthFilterOperators, AdminForthResourceCommon, AdminForthResourcePages,
@@ -210,6 +210,8 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
         const resource = this.adminforth.config.resources.find((res) => res.resourceId === this.adminforth.config.auth.usersResourceId);
         const usernameColumn = resource.columns.find((col) => col.name === usernameField);
 
+        const loginPromptHTML = await getLoginPromptHTML(this.adminforth.config.auth.loginPromptHTML);
+
         return {
           brandName: this.adminforth.config.customization.brandName,
           usernameFieldName: usernameColumn.label,
@@ -218,7 +220,7 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
           removeBackgroundBlendMode: this.adminforth.config.auth.removeBackgroundBlendMode,
           title: this.adminforth.config.customization?.title,
           demoCredentials: this.adminforth.config.auth.demoCredentials,
-          loginPromptHTML: await tr(this.adminforth.config.auth.loginPromptHTML, 'system.loginPromptHTML'),
+          loginPromptHTML: await tr(loginPromptHTML, 'system.loginPromptHTML'),
           loginPageInjections: this.adminforth.config.customization.loginPageInjections,
           globalInjections: {
             everyPageBottom: this.adminforth.config.customization.globalInjections.everyPageBottom,
@@ -230,7 +232,6 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
       },
     });
 
-    
     server.endpoint({
       method: 'GET',
       path: '/get_base_config',
@@ -293,6 +294,9 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
         }
 
         const announcementBadge: AnnouncementBadgeResponse = this.adminforth.config.customization.announcementBadge?.(adminUser);
+        
+        const loginPromptHTML = await getLoginPromptHTML(this.adminforth.config.auth.loginPromptHTML);
+
 
         const publicPart = {
           brandName: this.adminforth.config.customization.brandName,
@@ -302,7 +306,7 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
           removeBackgroundBlendMode: this.adminforth.config.auth.removeBackgroundBlendMode,
           title: this.adminforth.config.customization?.title,
           demoCredentials: this.adminforth.config.auth.demoCredentials,
-          loginPromptHTML: await tr(this.adminforth.config.auth.loginPromptHTML, 'system.loginPromptHTML'),
+          loginPromptHTML: await tr(loginPromptHTML, 'system.loginPromptHTML'),
           loginPageInjections: this.adminforth.config.customization.loginPageInjections,
           rememberMeDays: this.adminforth.config.auth.rememberMeDays,
           singleTheme: this.adminforth.config.customization.singleTheme,

adminforth/modules/utils.ts

@@ -3,6 +3,7 @@ import { fileURLToPath } from 'url';
 import fs from 'fs';
 import Fuse from 'fuse.js';
 import crypto from 'crypto';
+import AdminForth, { AdminForthConfig } from '../index.js';
 // @ts-ignore-next-line
 
 
@@ -158,6 +159,15 @@ const csscolors = {
 }
 
 
+export async function getLoginPromptHTML(loginPrompt: string | Function) {
+  if(typeof loginPrompt === 'function') {
+    loginPrompt = await loginPrompt();
+    if (!loginPrompt) {
+      return null;
+    }
+  }
+  return loginPrompt;
+}
 
 export function guessLabelFromName(name) {
   if (name.includes('_')) {

adminforth/types/Back.ts

@@ -978,7 +978,7 @@ export interface AdminForthInputConfig {
       /**
        * Any prompt to show users on login. Supports HTML.
        */
-      loginPromptHTML?: string,
+      loginPromptHTML?: string | (() => string | void | undefined | Promise<string | void | undefined>) | undefined 
 
       /**
        * Remember me days for "Remember Me" checkbox on login page.

adminforth/types/Common.ts

@@ -1060,7 +1060,7 @@ export interface AdminForthConfigForFrontend {
   removeBackgroundBlendMode: boolean,
   title?: string,
   demoCredentials?: string,
-  loginPromptHTML?: string,
+  loginPromptHTML?: string | (() => string | Promise<string> | void | Promise<void> | Promise<undefined>) | undefined 
   loginPageInjections: {
     underInputs: Array<AdminForthComponentDeclaration>,
     panelHeader: Array<AdminForthComponentDeclaration>,

dev-demo/index.ts

@@ -78,7 +78,12 @@ export const admin = new AdminForth({
     loginBackgroundImage: 'https://images.unsplash.com/photo-1534239697798-120952b76f2b?q=80&w=3389&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
     loginBackgroundPosition: '1/2', // over, 3/4, 2/5, 3/5 (tailwind grid)
     demoCredentials: "adminforth:adminforth",  // never use it for production
-    loginPromptHTML: "Use email <b>adminforth</b> and password <b>adminforth</b> to login",
+    loginPromptHTML: async () => { 
+      const adminforthUserExists = await admin.resource("users").count(Filters.EQ('email', 'adminforth')) > 0;
+      if (adminforthUserExists) {
+        return "Please use <b>adminforth</b> as username and <b>adminforth</b> as password"
+      }
+    },
     // loginBackgroundImage: '@@/pho.jpg',
     rememberMeDays: 30,
     beforeLoginConfirmation: [async ({adminUser, adminforth, extra}) => {
@@ -202,7 +207,7 @@ export const admin = new AdminForth({
     },
     {
       id: 'ch',
-      url: 'clickhouse://demo:demo@localhost:8125/demo',
+      url: 'clickhouse://demo:demo@localhost:8124/demo',
     },
     {
       id: 'mysql',