webspresso 0.0.88 → 0.0.90

package/core/orm/repository.js

@@ -28,6 +28,7 @@ const { getJsonColumns, serializeJsonFields, deserializeJsonFields } = require('
 function createRepository(model, knex, initialContext, cacheLayer = null) {
   const scopeContext = initialContext || createScopeContext();
   const jsonColumns = getJsonColumns(model);
+  const hasJson = jsonColumns.size > 0;
 
   /**
    * Get base query builder
@@ -47,12 +48,15 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
    */
   async function findById(id, options = {}, emitEvents = true) {
     const { with: withs = [], select } = options;
-    const ctx = createEventContext(model.name, 'find');
-    const query = { [model.primaryKey]: id };
+    const shouldEmit = emitEvents && (
+      ModelEvents.hasListeners(model.name, Hooks.BEFORE_FIND) ||
+      ModelEvents.hasListeners(model.name, Hooks.AFTER_FIND)
+    );
+    const ctx = shouldEmit ? createEventContext(model.name, 'find') : null;
 
     async function loadFromDb() {
-      if (emitEvents) {
-        await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, query, ctx);
+      if (shouldEmit) {
+        await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, { [model.primaryKey]: id }, ctx);
         if (ctx.isCancelled) {
           throw new HookCancellationError(ctx.cancelReason, model.name, Hooks.BEFORE_FIND);
         }
@@ -70,13 +74,15 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
         return null;
       }
 
-      deserializeJsonFields(record, jsonColumns);
+      if (hasJson) {
+        deserializeJsonFields(record, jsonColumns);
+      }
 
       if (withs.length > 0) {
         await loadRelations([record], ensureArray(withs), model, knex, scopeContext);
       }
 
-      if (emitEvents) {
+      if (shouldEmit) {
         ModelEvents.emit(model.name, Hooks.AFTER_FIND, record, ctx);
       }
 
@@ -113,7 +119,11 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
    */
   async function findOne(conditions, options = {}) {
     const { with: withs = [], select } = options;
-    const ctx = createEventContext(model.name, 'find');
+    const shouldEmit = (
+      ModelEvents.hasListeners(model.name, Hooks.BEFORE_FIND) ||
+      ModelEvents.hasListeners(model.name, Hooks.AFTER_FIND)
+    );
+    const ctx = shouldEmit ? createEventContext(model.name, 'find') : null;
 
     const condKeys = Object.keys(conditions);
     const isPkOnly =
@@ -122,9 +132,11 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
       condKeys[0] === model.primaryKey;
 
     async function loadFromDb() {
-      await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, conditions, ctx);
-      if (ctx.isCancelled) {
-        throw new HookCancellationError(ctx.cancelReason, model.name, Hooks.BEFORE_FIND);
+      if (shouldEmit) {
+        await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, conditions, ctx);
+        if (ctx.isCancelled) {
+          throw new HookCancellationError(ctx.cancelReason, model.name, Hooks.BEFORE_FIND);
+        }
       }
 
       let qb = baseQuery();
@@ -143,13 +155,17 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
         return null;
       }
 
-      deserializeJsonFields(record, jsonColumns);
+      if (hasJson) {
+        deserializeJsonFields(record, jsonColumns);
+      }
 
       if (withs.length > 0) {
         await loadRelations([record], ensureArray(withs), model, knex, scopeContext);
       }
 
-      ModelEvents.emit(model.name, Hooks.AFTER_FIND, record, ctx);
+      if (shouldEmit) {
+        ModelEvents.emit(model.name, Hooks.AFTER_FIND, record, ctx);
+      }
 
       return record;
     }
@@ -183,12 +199,18 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
    */
   async function findAll(options = {}) {
     const { with: withs = [], select } = options;
-    const ctx = createEventContext(model.name, 'find');
+    const shouldEmit = (
+      ModelEvents.hasListeners(model.name, Hooks.BEFORE_FIND) ||
+      ModelEvents.hasListeners(model.name, Hooks.AFTER_FIND)
+    );
+    const ctx = shouldEmit ? createEventContext(model.name, 'find') : null;
 
     async function loadFromDb() {
-      await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, {}, ctx);
-      if (ctx.isCancelled) {
-        throw new HookCancellationError(ctx.cancelReason, model.name, Hooks.BEFORE_FIND);
+      if (shouldEmit) {
+        await ModelEvents.emitAsync(model.name, Hooks.BEFORE_FIND, {}, ctx);
+        if (ctx.isCancelled) {
+          throw new HookCancellationError(ctx.cancelReason, model.name, Hooks.BEFORE_FIND);
+        }
       }
 
       let qb = baseQuery();
@@ -199,16 +221,22 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
 
       const records = await qb;
 
-      for (const record of records) {
-        deserializeJsonFields(record, jsonColumns);
+      if (hasJson) {
+        const len = records.length;
+        for (let i = 0; i < len; i++) {
+          deserializeJsonFields(records[i], jsonColumns);
+        }
       }
 
       if (withs.length > 0 && records.length > 0) {
         await loadRelations(records, ensureArray(withs), model, knex, scopeContext);
       }
 
-      for (const record of records) {
-        ModelEvents.emit(model.name, Hooks.AFTER_FIND, record, ctx);
+      if (shouldEmit) {
+        const len = records.length;
+        for (let i = 0; i < len; i++) {
+          ModelEvents.emit(model.name, Hooks.AFTER_FIND, records[i], ctx);
+        }
       }
 
       return records;
@@ -261,7 +289,9 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
     let insertData = applyInsertModifiers(validated, scopeContext, model);
 
     // Serialize JSON fields
-    insertData = serializeJsonFields(insertData, jsonColumns);
+    if (hasJson) {
+      insertData = serializeJsonFields(insertData, jsonColumns);
+    }
 
     // Insert and return the record
     const [id] = await knex(model.table).insert(insertData).returning(model.primaryKey);
@@ -341,7 +371,9 @@ function createRepository(model, knex, initialContext, cacheLayer = null) {
     delete updateData[model.primaryKey];
 
     // Serialize JSON fields
-    updateData = serializeJsonFields(updateData, jsonColumns);
+    if (hasJson) {
+      updateData = serializeJsonFields(updateData, jsonColumns);
+    }
 
     // Update the record
     const updated = await baseQuery()

package/core/orm/schema-helpers.js

@@ -5,6 +5,9 @@
  */
 
 const METADATA_MARKER = '__wdb__';
+const metaWeakMap = new WeakMap();
+const metaStringCache = new Map();
+const schemaColumnsWeakMap = new WeakMap();
 
 /**
  * Encode column metadata into a JSON string for Zod .describe()
@@ -22,14 +25,25 @@ function encodeColumnMeta(meta) {
  */
 function decodeColumnMeta(description) {
   if (!description) return null;
+  const cached = metaStringCache.get(description);
+  if (cached !== undefined) return cached;
+
   try {
     const parsed = JSON.parse(description);
     if (parsed && parsed[METADATA_MARKER]) {
-      return parsed.meta;
+      const meta = parsed.meta;
+      if (metaStringCache.size < 500) {
+        metaStringCache.set(description, meta);
+      }
+      return meta;
     }
   } catch {
     // Not our metadata, ignore
   }
+
+  if (metaStringCache.size < 500) {
+    metaStringCache.set(description, null);
+  }
   return null;
 }
 
@@ -39,7 +53,7 @@ function decodeColumnMeta(description) {
  * @returns {boolean}
  */
 function hasColumnMeta(schema) {
-  return decodeColumnMeta(schema.description) !== null;
+  return getColumnMeta(schema) !== null;
 }
 
 /**
@@ -48,6 +62,10 @@ function hasColumnMeta(schema) {
  * @returns {import('./types').ColumnMeta|null}
  */
 function getColumnMeta(schema) {
+  if (!schema) return null;
+  const direct = metaWeakMap.get(schema);
+  if (direct !== undefined) return direct;
+  if (schema._wdbMeta) return schema._wdbMeta;
   return decodeColumnMeta(schema.description);
 }
 
@@ -253,6 +271,7 @@ class SchemaBuilder {
 
     // Apply metadata to schema
     this._schema = this._schema.describe(encodeColumnMeta(finalMeta));
+    metaWeakMap.set(this._schema, finalMeta);
     this._finalized = true;
     return this._schema;
   }
@@ -770,6 +789,15 @@ function createSchemaHelpers(z) {
  * @returns {Map<string, import('./types').ColumnMeta>}
  */
 function extractColumnsFromSchema(schema) {
+  if (!schema || typeof schema !== 'object' || !schema.shape) {
+    return new Map();
+  }
+
+  const cached = schemaColumnsWeakMap.get(schema);
+  if (cached !== undefined) {
+    return cached;
+  }
+
   const columns = new Map();
   const shape = schema.shape;
 
@@ -806,6 +834,7 @@ function extractColumnsFromSchema(schema) {
     }
   }
 
+  schemaColumnsWeakMap.set(schema, columns);
   return columns;
 }
 

package/core/orm/scopes.js

@@ -185,11 +185,12 @@ function applyUpdateModifiers(data, model) {
  * Create default scope context
  * @returns {import('./types').ScopeContext}
  */
-function createScopeContext() {
+function createScopeContext(overrides = {}) {
   return {
     tenantId: undefined,
     withTrashed: false,
     onlyTrashed: false,
+    ...overrides,
   };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webspresso",
-  "version": "0.0.88",
+  "version": "0.0.90",
   "description": "Minimal, production-ready SSR framework for Node.js with file-based routing, Nunjucks templating, built-in i18n, and CLI tooling",
   "main": "index.js",
   "types": "index.d.ts",

package/plugins/admin-panel/app.js

@@ -171,6 +171,16 @@ var routes = {
       return ProfilePage;
     }
   },
+  '/admins': {
+    onmatch: async () => {
+      const isAuth = await checkAuth();
+      if (!isAuth) {
+        redirectToLogin();
+        return;
+      }
+      return AdminUsersPage;
+    }
+  },
   '/users/sessions': {
     onmatch: async () => {
       if (!(await guardUserManagementRoutes())) return;

package/plugins/admin-panel/client/parts/03-pagination-intro.js

@@ -16,52 +16,59 @@ const Pagination = {
       pages.push(i);
     }
     
-    return m('.flex.items-center.justify-between.px-4.py-3.bg-white dark:bg-slate-800.border-t', [
-      m('.text-sm.text-gray-700', [
+    return m('.flex.flex-col.sm:flex-row.items-center.justify-between.gap-3.px-4.py-3.bg-white.dark:bg-slate-800.border-t.border-gray-200.dark:border-slate-700', [
+      m('.text-xs.sm:text-sm.text-gray-600.dark:text-slate-400.text-center.sm:text-left', [
         'Showing ',
-        m('span.font-medium', ((page - 1) * perPage) + 1),
+        m('span.font-semibold.text-gray-900.dark:text-slate-200', ((page - 1) * perPage) + 1),
         ' to ',
-        m('span.font-medium', Math.min(page * perPage, total)),
+        m('span.font-semibold.text-gray-900.dark:text-slate-200', Math.min(page * perPage, total)),
         ' of ',
-        m('span.font-medium', total),
+        m('span.font-semibold.text-gray-900.dark:text-slate-200', total),
         ' results',
       ]),
-      m('nav.flex.items-center.space-x-1', [
+      m('nav.flex.items-center.gap-1', [
         // Previous button
-        m('button.px-3.py-1.rounded.border.text-sm', {
+        m('button.px-3.py-1.5.rounded-lg.border.border-gray-200.dark:border-slate-600.text-xs.sm:text-sm.font-medium.transition-colors', {
           disabled: page <= 1,
-          class: page <= 1 ? 'text-gray-300 cursor-not-allowed' : 'text-gray-700 hover:bg-gray-100 dark:hover:bg-slate-700 dark:hover:bg-slate-700',
+          class: page <= 1 
+            ? 'text-gray-300 dark:text-slate-600 cursor-not-allowed bg-gray-50 dark:bg-slate-900/50' 
+            : 'text-gray-700 dark:text-slate-200 hover:bg-gray-100 dark:hover:bg-slate-700 bg-white dark:bg-slate-800',
           onclick: () => page > 1 && onPageChange(page - 1),
         }, '← Prev'),
+
+        // Mobile page indicator
+        m('span.sm:hidden.px-2.text-xs.font-medium.text-gray-600.dark:text-slate-400', `${page} / ${totalPages}`),
         
-        // Page numbers
+        // Page numbers (desktop only)
         start > 1 ? [
-          m('button.px-3.py-1.rounded.text-sm.text-gray-700 dark:text-slate-300.hover:bg-gray-100 dark:hover:bg-slate-700 dark:hover:bg-slate-700', {
+          m('button.hidden.sm:inline-flex.px-3.py-1.5.rounded-lg.text-xs.sm:text-sm.font-medium.text-gray-700.dark:text-slate-300.hover:bg-gray-100.dark:hover:bg-slate-700.transition-colors', {
             onclick: () => onPageChange(1),
           }, '1'),
-          start > 2 ? m('span.px-2.text-gray-400', '...') : null,
+          start > 2 ? m('span.hidden.sm:inline-flex.px-1.text-gray-400.dark:text-slate-500', '...') : null,
         ] : null,
         
         ...pages.map(p => 
-          m('button.px-3.py-1.rounded.text-sm', {
+          m('button.hidden.sm:inline-flex.px-3.py-1.5.rounded-lg.text-xs.sm:text-sm.font-medium.transition-colors', {
             class: p === page 
-              ? 'bg-blue-600 text-white' 
-              : 'text-gray-700 hover:bg-gray-100 dark:hover:bg-slate-700 dark:hover:bg-slate-700',
+              ? 'bg-blue-600 dark:bg-blue-500 text-white shadow-sm' 
+              : 'text-gray-700 dark:text-slate-300 hover:bg-gray-100 dark:hover:bg-slate-700',
             onclick: () => onPageChange(p),
           }, p)
         ),
         
         end < totalPages ? [
-          end < totalPages - 1 ? m('span.px-2.text-gray-400', '...') : null,
-          m('button.px-3.py-1.rounded.text-sm.text-gray-700 dark:text-slate-300.hover:bg-gray-100 dark:hover:bg-slate-700 dark:hover:bg-slate-700', {
+          end < totalPages - 1 ? m('span.hidden.sm:inline-flex.px-1.text-gray-400.dark:text-slate-500', '...') : null,
+          m('button.hidden.sm:inline-flex.px-3.py-1.5.rounded-lg.text-xs.sm:text-sm.font-medium.text-gray-700.dark:text-slate-300.hover:bg-gray-100.dark:hover:bg-slate-700.transition-colors', {
             onclick: () => onPageChange(totalPages),
           }, totalPages),
         ] : null,
         
         // Next button
-        m('button.px-3.py-1.rounded.border.text-sm', {
+        m('button.px-3.py-1.5.rounded-lg.border.border-gray-200.dark:border-slate-600.text-xs.sm:text-sm.font-medium.transition-colors', {
           disabled: page >= totalPages,
-          class: page >= totalPages ? 'text-gray-300 cursor-not-allowed' : 'text-gray-700 hover:bg-gray-100 dark:hover:bg-slate-700 dark:hover:bg-slate-700',
+          class: page >= totalPages 
+            ? 'text-gray-300 dark:text-slate-600 cursor-not-allowed bg-gray-50 dark:bg-slate-900/50' 
+            : 'text-gray-700 dark:text-slate-200 hover:bg-gray-100 dark:hover:bg-slate-700 bg-white dark:bg-slate-800',
           onclick: () => page < totalPages && onPageChange(page + 1),
         }, 'Next →'),
       ]),

package/plugins/admin-panel/client/parts/08-record-list.js

@@ -61,7 +61,7 @@ const RecordList = {
     
     return m(Layout, { breadcrumbs }, [
       // Header
-      m('.flex.items-center.justify-between.mb-4', [
+      m('.flex.flex-col.sm:flex-row.sm:items-center.sm:justify-between.gap-3.mb-4', [
         m('.flex.items-center.gap-3', [
           m('h2.text-2xl.font-bold', modelMeta?.label || modelName),
           m(RefreshIconButton, {
@@ -76,16 +76,16 @@ const RecordList = {
               });
             },
           }),
-          modelMeta?.softDelete ? m('.flex.rounded-lg.border.border-gray-200 dark:border-slate-600.p-0.5', [
+          modelMeta?.softDelete ? m('.flex.rounded-lg.border.border-gray-200.dark:border-slate-600.p-0.5', [
             m('button.px-3.py-1.5.text-sm.font-medium.rounded-md.transition-colors', {
-              class: !state.trashedView ? 'bg-indigo-600.text-white' : 'text-gray-600.hover:text-gray-900 dark:hover:text-slate-100 dark:hover:text-slate-100',
+              class: !state.trashedView ? 'bg-indigo-600.text-white' : 'text-gray-600.hover:text-gray-900.dark:hover:text-slate-100',
               onclick: () => {
                 state.trashedView = false;
                 loadRecords(modelName, 1);
               },
             }, 'Active'),
             m('button.px-3.py-1.5.text-sm.font-medium.rounded-md.transition-colors', {
-              class: state.trashedView ? 'bg-indigo-600.text-white' : 'text-gray-600.hover:text-gray-900 dark:hover:text-slate-100 dark:hover:text-slate-100',
+              class: state.trashedView ? 'bg-indigo-600.text-white' : 'text-gray-600.hover:text-gray-900.dark:hover:text-slate-100',
               onclick: () => {
                 state.trashedView = true;
                 loadRecords(modelName, 1);
@@ -232,29 +232,29 @@ const RecordList = {
             ])
           : m('.bg-white dark:bg-slate-800.rounded-lg.shadow-sm.border.border-gray-200 dark:border-slate-600.overflow-hidden', [
             // Bulk Actions Toolbar (shown when items selected)
-            (state.selectedRecords && state.selectedRecords.size > 0) || state.selectAllMode ? m('.bg-indigo-50.border-b.border-indigo-100.px-4.py-3.flex.items-center.justify-between', [
-              m('.flex.items-center.gap-3', [
-                m('span.text-sm.text-indigo-700.font-medium', 
+            (state.selectedRecords && state.selectedRecords.size > 0) || state.selectAllMode ? m('.bg-indigo-50.dark:bg-indigo-950/40.border-b.border-indigo-100.dark:border-indigo-900/50.px-4.py-3.flex.flex-col.sm:flex-row.sm:items-center.sm:justify-between.gap-3', [
+              m('.flex.flex-wrap.items-center.gap-2', [
+                m('span.text-sm.text-indigo-700.dark:text-indigo-300.font-medium', 
                   state.selectAllMode 
                     ? 'All ' + state.pagination.total + ' records selected'
                     : state.selectedRecords.size + ' record' + (state.selectedRecords.size > 1 ? 's' : '') + ' selected'
                 ),
                 // Show "Select all X records" option when current page is fully selected
-                !state.selectAllMode && state.selectedRecords.size === state.records.length && state.pagination.total > state.records.length && m('button.text-sm.text-indigo-600.hover:text-indigo-800.underline.font-medium', {
+                !state.selectAllMode && state.selectedRecords.size === state.records.length && state.pagination.total > state.records.length && m('button.text-sm.text-indigo-600.dark:text-indigo-400.hover:text-indigo-800.underline.font-medium', {
                   onclick: () => {
                     state.selectAllMode = true;
                     m.redraw();
                   },
                 }, 'Select all ' + state.pagination.total + ' records'),
                 // Show "Select only this page" when in selectAllMode
-                state.selectAllMode && m('button.text-sm.text-indigo-600.hover:text-indigo-800.underline', {
+                state.selectAllMode && m('button.text-sm.text-indigo-600.dark:text-indigo-400.hover:text-indigo-800.underline', {
                   onclick: () => {
                     state.selectAllMode = false;
                     m.redraw();
                   },
                 }, 'Select only this page (' + state.selectedRecords.size + ')'),
               ]),
-              m('.flex.items-center.gap-2', [
+              m('.flex.flex-wrap.items-center.gap-1.5', [
                 state.trashedView && modelMeta?.softDelete
                   ? m('button.inline-flex.items-center.gap-1.px-3.py-1.5.text-sm.font-medium.text-green-600.bg-white dark:bg-slate-800.border.border-green-200.rounded.hover:bg-green-50.transition-colors', {
                       disabled: state.bulkActionInProgress,

package/plugins/admin-panel/index.js

@@ -16,6 +16,7 @@ const { registerDefaultBulkActions, generateBulkActionsComponent } = require('./
 const { registerDefaultPages, createCustomPageApiHandlers, generateCustomPageComponent } = require('./modules/custom-pages');
 const { registerModelMenuItems, registerSystemMenuItems, generateMenuComponent } = require('./modules/menu');
 const { generateProfileComponent } = require('./modules/profile');
+const { registerAdminUsersManagement, createAdminUsersApiHandlers, generateAdminUsersComponent } = require('./modules/admin-users');
 const { registerModule, registerPageDir } = require('./core/admin-module');
 
 
@@ -44,11 +45,14 @@ function adminPanelPlugin(options = {}) {
     db,
     auth,
     userManagement: userMgmtConfig,
+    adminUsers: adminUsersOption = true,
     configure,
     uploadUrl: uploadUrlOption,
     richTextSanitize = true,
   } = options;
 
+  const adminUsersConfig = typeof adminUsersOption === 'object' ? adminUsersOption : { enabled: adminUsersOption !== false };
+
   // Validate required options
   if (!db) {
     throw new Error('Admin panel plugin requires a database instance. Pass `db` in options.');
@@ -152,13 +156,20 @@ function adminPanelPlugin(options = {}) {
       // Session must be registered before file routes so SSR pages can read adminUser.
       if (enabled && ctx.app && !ctx.app._webspressoSessionInitialized) {
         const secret = sessionSecret || process.env.SESSION_SECRET || 'webspresso-admin-secret-change-in-production';
+        const secureMode =
+          process.env.NODE_ENV === 'production' ||
+          process.env.COOKIE_SECURE === 'true' ||
+          /^https:/i.test(String(process.env.BASE_URL || '').trim())
+            ? true
+            : 'auto';
         ctx.app.use(session({
           secret,
           resave: false,
           saveUninitialized: false,
           cookie: {
-            secure: process.env.NODE_ENV === 'production',
+            secure: secureMode,
             httpOnly: true,
+            sameSite: 'lax',
             maxAge: 24 * 60 * 60 * 1000, // 24 hours
           },
         }));
@@ -227,6 +238,14 @@ function adminPanelPlugin(options = {}) {
         });
       }
 
+      // Register admin user management if enabled
+      if (adminUsersConfig.enabled !== false) {
+        registerAdminUsersManagement({
+          registry,
+          config: adminUsersConfig,
+        });
+      }
+
       // Create API handlers
       const apiHandlers = createApiHandlers({
         path: adminPath,
@@ -245,6 +264,16 @@ function adminPanelPlugin(options = {}) {
 
       const pageHandlers = createCustomPageApiHandlers({ registry, db });
 
+      // Admin users management API handlers
+      let adminUsersHandlers = null;
+      if (adminUsersConfig.enabled !== false) {
+        adminUsersHandlers = createAdminUsersApiHandlers({
+          db,
+          AdminUser,
+          hashPassword: (password, rounds) => bcrypt.hash(password, rounds),
+        });
+      }
+
       // User management API handlers
       let userHandlers = null;
       if (userMgmtConfig?.enabled) {
@@ -289,6 +318,15 @@ function adminPanelPlugin(options = {}) {
       ctx.addRoute('get', `${adminPath}/api/extensions/pages/:pageId/data`, requireAuth, pageHandlers.getPageData);
       ctx.addRoute('all', `${adminPath}/api/extensions/pages/:pageId/actions/:actionId`, requireAuth, pageHandlers.executePageAction);
 
+      // Admin users management API routes
+      if (adminUsersHandlers) {
+        ctx.addRoute('get', `${adminPath}/api/admins`, requireAuth, adminUsersHandlers.listAdmins);
+        ctx.addRoute('get', `${adminPath}/api/admins/:id`, requireAuth, adminUsersHandlers.getAdmin);
+        ctx.addRoute('post', `${adminPath}/api/admins`, requireAuth, adminUsersHandlers.createAdmin);
+        ctx.addRoute('put', `${adminPath}/api/admins/:id`, requireAuth, adminUsersHandlers.updateAdmin);
+        ctx.addRoute('delete', `${adminPath}/api/admins/:id`, requireAuth, adminUsersHandlers.deleteAdmin);
+      }
+
       // User management API routes
       if (userHandlers) {
         ctx.addRoute('get', `${adminPath}/api/users`, requireAuth, userHandlers.listUsers);
@@ -391,6 +429,7 @@ function generateAdminPanelHtml(adminPath, registry) {
   const bulkActionsComponent = generateBulkActionsComponent();
   const customPageComponent = generateCustomPageComponent();
   const profileComponent = generateProfileComponent();
+  const adminUsersComponent = generateAdminUsersComponent();
 
   const settings = registry.settings;
   const fieldRenderersCode = Array.from(registry.fieldRenderers.entries()).map(([type, r]) => {
@@ -473,6 +512,7 @@ function generateAdminPanelHtml(adminPath, registry) {
     ${bulkActionsComponent}
     ${customPageComponent}
     ${profileComponent}
+    ${adminUsersComponent}
 
     // Custom page components container
     window.__customPages = window.__customPages || {};