v1.25.0

changelog.md

@@ -1,5 +1,39 @@
 # Changelog
 
+## 2026-05-09 - 1.25.0 - feat(external-gateway)
+add gateway client domain and DNS record support for dcrouter integration
+
+- switch dcrouter route syncing to gateway-client APIs with fallback to legacy workHoster endpoints
+- add admin endpoints and frontend views for browsing gateway domains and DNS records
+- introduce dcrouterGatewayClientId settings support while preserving compatibility with the legacy workHoster ID
+
+## 2026-05-08 - 1.24.7 - fix(web-ui)
+
+align Delegate Routing settings with the Dees catalog control and theme conventions
+
+- replace raw Delegate Routing inputs and save button with `dees-input-text` and `dees-button`
+- style the Delegate Routing card with explicit `cssManager.bdTheme(...)` colors
+
+## 2026-05-08 - 1.24.6 - fix(auth)
+
+avoid bcrypt worker crashes in compiled binaries during login and password creation
+
+- replace bcrypt password hashing with a Web Crypto PBKDF2 hash format
+- remove legacy password-hash fallbacks; existing deployments need their admin user hash updated
+
+## 2026-05-08 - 1.24.5 - fix(opsserver)
+
+start the OpsServer with typedserver custom routes registered through the UtilityWebsiteServer hook
+
+- fixes daemon startup with the current typedserver lifecycle
+- cap SmartProxy readiness waiting at 10 seconds during daemon startup
+
+## 2026-05-08 - 1.24.4 - fix(installer)
+
+avoid documenting a hardcoded initial admin password for fresh installs
+
+- update installer output to point operators to the service logs or `ONEBOX_ADMIN_PASSWORD` for initial credentials
+
 ## 2026-05-08 - 1.24.3 - fix(runtime)
 
 upgrade runtime dependencies and harden registry/shutdown behavior

deno.json

@@ -1,6 +1,6 @@
 {
   "name": "@serve.zone/onebox",
-  "version": "1.24.3",
+  "version": "1.25.0",
   "exports": "./mod.ts",
   "tasks": {
     "test": "deno test --allow-all test/",

install.sh

@@ -305,6 +305,6 @@ else
   echo "     onebox service add myapp --image nginx:latest --domain app.example.com"
   echo ""
   echo "  Web UI: http://localhost:3000"
-  echo "  Default credentials: admin / admin"
+  echo "  Initial admin credentials are written to the service logs unless ONEBOX_ADMIN_PASSWORD is set."
 fi
 echo ""

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@serve.zone/onebox",
-  "version": "1.24.3",
+  "version": "1.25.0",
   "description": "Self-hosted container platform with automatic SSL and DNS - a mini Heroku for single servers",
   "main": "mod.ts",
   "type": "module",

test/auth_test.ts

@@ -5,8 +5,7 @@ import type { IUser as IDatabaseUser } from '../ts/types.ts';
 import { AdminHandler } from '../ts/opsserver/handlers/admin.handler.ts';
 import {
   hashPassword,
-  isBcryptHash,
+  isPbkdf2Hash,
-  needsPasswordUpgrade,
   verifyPassword,
 } from '../ts/utils/auth.ts';
 
@@ -45,18 +44,14 @@ async function createAdminHandler(users: IDatabaseUser[]): Promise<AdminHandler>
   return adminHandler;
 }
 
-Deno.test('password helpers support bcrypt and legacy password hashes', async () => {
+Deno.test('password helpers support PBKDF2 password hashes', async () => {
   const password = 'correct horse battery staple';
-  const bcryptHash = await hashPassword(password);
+  const passwordHash = await hashPassword(password);
 
-  assert(isBcryptHash(bcryptHash));
+  assert(isPbkdf2Hash(passwordHash));
-  assert(await verifyPassword(password, bcryptHash));
+  assert(await verifyPassword(password, passwordHash));
-  assert(!(await verifyPassword('wrong password', bcryptHash)));
+  assert(!(await verifyPassword('wrong password', passwordHash)));
-  assert(!needsPasswordUpgrade(bcryptHash));
+  assert(!(await verifyPassword(password, btoa(password))));
-
-  const legacyHash = btoa(password);
-  assert(await verifyPassword(password, legacyHash));
-  assert(needsPasswordUpgrade(legacyHash));
 });
 
 Deno.test('verified identity is derived from the signed JWT and database, not client fields', async () => {

test/external_gateway_test.ts

@@ -62,6 +62,7 @@ class FakeDatabase {
 const makeOneboxRef = () => {
   const database = new FakeDatabase();
   database.settings.set('dcrouterGatewayUrl', 'https://edge.example.com');
+  database.settings.set('dcrouterGatewayClientId', 'onebox-1');
   database.settings.set('dcrouterWorkHosterId', 'onebox-1');
   database.secretSettings.set('dcrouterGatewayApiToken', 'dcr-token');
 
@@ -92,8 +93,9 @@ Deno.test('ExternalGatewayManager syncs dcrouter domains into Onebox domains', a
   });
 
   const manager = new ExternalGatewayManager(oneboxRef as any);
-  (manager as any).fireDcRouterRequest = async (method: string) => {
+  (manager as any).fireDcRouterRequest = async (method: string, requestData: Record<string, unknown>) => {
-    assertEquals(method, 'getWorkHosterDomains');
+    assertEquals(method, 'getGatewayClientDomains');
+    assertEquals(requestData.gatewayClientId, 'onebox-1');
     return {
       domains: [
         {
@@ -117,7 +119,7 @@ Deno.test('ExternalGatewayManager syncs dcrouter domains into Onebox domains', a
   assertEquals(oneboxRef.database.getDomainByName('old.example.com')?.isObsolete, true);
 });
 
-Deno.test('ExternalGatewayManager syncs service routes to dcrouter WorkHoster API', async () => {
+Deno.test('ExternalGatewayManager syncs service routes to dcrouter gatewayClient API', async () => {
   const oneboxRef = makeOneboxRef();
   oneboxRef.database.settings.set('serverIP', '203.0.113.10');
   oneboxRef.database.settings.set('httpPort', '8080');
@@ -146,14 +148,14 @@ Deno.test('ExternalGatewayManager syncs service routes to dcrouter WorkHoster AP
 
   await manager.syncServiceRoute(service);
 
-  const syncRequest = requests.find((request) => request.method === 'syncWorkAppRoute')!;
+  const syncRequest = requests.find((request) => request.method === 'syncGatewayClientRoute')!;
   const route = syncRequest.requestData.route as any;
   const ownership = syncRequest.requestData.ownership as any;
 
   assertEquals(ownership, {
-    workHosterType: 'onebox',
+    gatewayClientType: 'onebox',
-    workHosterId: 'onebox-1',
+    gatewayClientId: 'onebox-1',
-    workAppId: 'hello',
+    appId: 'hello',
     hostname: 'hello.example.com',
   });
   assertEquals(route.match, { ports: [443], domains: ['hello.example.com'] });
@@ -162,13 +164,13 @@ Deno.test('ExternalGatewayManager syncs service routes to dcrouter WorkHoster AP
   assertEquals(syncRequest.requestData.enabled, true);
 });
 
-Deno.test('ExternalGatewayManager deletes service routes through dcrouter WorkHoster API', async () => {
+Deno.test('ExternalGatewayManager deletes service routes through dcrouter gatewayClient API', async () => {
   const oneboxRef = makeOneboxRef();
   const manager = new ExternalGatewayManager(oneboxRef as any);
   let deleteRequest: Record<string, unknown> | null = null;
 
   (manager as any).fireDcRouterRequest = async (method: string, requestData: Record<string, unknown>) => {
-    assertEquals(method, 'syncWorkAppRoute');
+    assertEquals(method, 'syncGatewayClientRoute');
     deleteRequest = requestData;
     return { success: true, action: 'deleted', routeId: 'route-1' };
   };
@@ -182,6 +184,7 @@ Deno.test('ExternalGatewayManager deletes service routes through dcrouter WorkHo
   assert(deleteRequest);
   const capturedDeleteRequest = deleteRequest as Record<string, unknown>;
   assertEquals(capturedDeleteRequest.delete, true);
+  assertEquals((capturedDeleteRequest.ownership as any).gatewayClientId, 'onebox-1');
   assertEquals((capturedDeleteRequest.ownership as any).hostname, 'hello.example.com');
 });
 

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/onebox',
-  version: '1.24.2',
+  version: '1.25.0',
   description: 'Self-hosted container platform with automatic SSL and DNS - a mini Heroku for single servers'
 }

ts/classes/external-gateway.ts

@@ -9,13 +9,22 @@ type TWorkHosterType = 'onebox';
 interface IExternalGatewayConfig {
   url: string;
   apiToken: string;
+  gatewayClientId: string;
+  /** @deprecated Use gatewayClientId. */
   workHosterId: string;
   targetHost?: string;
   targetPort?: number;
 }
 
 interface IWorkHosterDomain {
+  id?: string;
   name: string;
+  source?: 'dcrouter' | 'provider';
+  authoritative?: boolean;
+  providerId?: string;
+  serviceCount?: number;
+  managePath?: string;
+  manageUrl?: string;
   capabilities?: {
     canCreateSubdomains: boolean;
     canManageDnsRecords: boolean;
@@ -24,6 +33,26 @@ interface IWorkHosterDomain {
   };
 }
 
+interface IGatewayDnsRecord {
+  id: string;
+  domainId: string;
+  domainName?: string;
+  name: string;
+  type: string;
+  value: string;
+  ttl: number;
+  source: string;
+  status: 'active' | 'missing';
+  gatewayClientType: 'onebox' | 'cloudly' | 'custom';
+  gatewayClientId: string;
+  appId: string;
+  hostname: string;
+  routeId?: string;
+  serviceName?: string;
+  managePath?: string;
+  manageUrl?: string;
+}
+
 interface IWorkAppRouteOwnership {
   workHosterType: TWorkHosterType;
   workHosterId: string;
@@ -31,6 +60,13 @@ interface IWorkAppRouteOwnership {
   hostname: string;
 }
 
+interface IGatewayClientOwnership {
+  gatewayClientType: TWorkHosterType;
+  gatewayClientId: string;
+  appId: string;
+  hostname: string;
+}
+
 interface IWorkAppRouteSyncResult {
   success: boolean;
   action?: 'created' | 'updated' | 'deleted' | 'unchanged';
@@ -93,12 +129,10 @@ export class ExternalGatewayManager {
   }
 
   public async syncDomains(): Promise<IDomain[]> {
-    const config = await this.requireConfig({ requireTarget: false });
+    if (!(await this.isConfigured())) {
-    const response = await this.fireDcRouterRequest<{ domains: IWorkHosterDomain[] }>(
+      return this.database.getDomainsByProvider('dcrouter');
-      'getWorkHosterDomains',
+    }
-      {},
+    const response = { domains: await this.getGatewayDomains() };
-      config,
-    );
 
     const activeDomainNames = new Set<string>();
     const now = Date.now();
@@ -143,6 +177,55 @@ export class ExternalGatewayManager {
     return this.database.getDomainsByProvider('dcrouter');
   }
 
+  public async getGatewayDomains(): Promise<IWorkHosterDomain[]> {
+    const config = await this.getConfig({ requireTarget: false });
+    if (!config) return [];
+
+    try {
+      const response = await this.fireDcRouterRequest<{ domains: IWorkHosterDomain[] }>(
+        'getGatewayClientDomains',
+        { gatewayClientId: config.gatewayClientId },
+        config,
+      );
+      return response.domains.map((domain) => ({
+        ...domain,
+        manageUrl: this.buildManageUrl(config, domain.managePath),
+      }));
+    } catch (error) {
+      logger.debug(`Falling back to legacy gateway domain API: ${getErrorMessage(error)}`);
+      const response = await this.fireDcRouterRequest<{ domains: IWorkHosterDomain[] }>(
+        'getWorkHosterDomains',
+        {},
+        config,
+      );
+      return response.domains.map((domain) => ({
+        ...domain,
+        manageUrl: this.buildManageUrl(config, domain.managePath),
+      }));
+    }
+  }
+
+  public async getGatewayDnsRecords(): Promise<IGatewayDnsRecord[]> {
+    const config = await this.getConfig({ requireTarget: false });
+    if (!config) return [];
+
+    try {
+      const response = await this.fireDcRouterRequest<{ records: IGatewayDnsRecord[] }>(
+        'getGatewayClientDnsRecords',
+        { gatewayClientId: config.gatewayClientId },
+        config,
+      );
+      return response.records.map((record) => ({
+        ...record,
+        serviceName: record.serviceName || record.appId,
+        manageUrl: this.buildManageUrl(config, record.managePath),
+      }));
+    } catch (error) {
+      logger.warn(`Failed to fetch gateway DNS records: ${getErrorMessage(error)}`);
+      return [];
+    }
+  }
+
   public async syncServiceRoute(service: IService): Promise<void> {
     if (!service.domain) return;
 
@@ -150,14 +233,24 @@ export class ExternalGatewayManager {
     if (!config) return;
 
     const result = await this.fireDcRouterRequest<IWorkAppRouteSyncResult>(
+      'syncGatewayClientRoute',
+      {
+        ownership: this.buildGatewayClientOwnership(service, service.domain, config),
+        route: this.buildRoute(service, config),
+        enabled: service.status === 'running',
+      },
+      config,
+    ).catch(async () => {
+      return await this.fireDcRouterRequest<IWorkAppRouteSyncResult>(
         'syncWorkAppRoute',
         {
-        ownership: this.buildOwnership(service, service.domain, config),
+          ownership: this.buildOwnership(service, service.domain!, config),
           route: this.buildRoute(service, config),
           enabled: service.status === 'running',
         },
         config,
       );
+    });
 
     if (!result.success) {
       throw new Error(result.message || `dcrouter route sync failed for ${service.domain}`);
@@ -176,13 +269,22 @@ export class ExternalGatewayManager {
     if (!config) return;
 
     const result = await this.fireDcRouterRequest<IWorkAppRouteSyncResult>(
+      'syncGatewayClientRoute',
+      {
+        ownership: this.buildGatewayClientOwnership(service, service.domain, config),
+        delete: true,
+      },
+      config,
+    ).catch(async () => {
+      return await this.fireDcRouterRequest<IWorkAppRouteSyncResult>(
         'syncWorkAppRoute',
         {
-        ownership: this.buildOwnership(service, service.domain, config),
+          ownership: this.buildOwnership(service, service.domain!, config),
           delete: true,
         },
         config,
       );
+    });
 
     if (!result.success) {
       throw new Error(result.message || `dcrouter route delete failed for ${service.domain}`);
@@ -240,10 +342,12 @@ export class ExternalGatewayManager {
       return null;
     }
 
+    const gatewayClientId = this.ensureGatewayClientId();
     const config: IExternalGatewayConfig = {
       url,
       apiToken,
-      workHosterId: this.ensureWorkHosterId(),
+      gatewayClientId,
+      workHosterId: gatewayClientId,
     };
 
     if (options.requireTarget !== false) {
@@ -288,13 +392,13 @@ export class ExternalGatewayManager {
     return port;
   }
 
-  private ensureWorkHosterId(): string {
+  private ensureGatewayClientId(): string {
-    let workHosterId = this.database.getSetting('dcrouterWorkHosterId');
+    let gatewayClientId = this.database.getSetting('dcrouterGatewayClientId') || this.database.getSetting('dcrouterWorkHosterId');
-    if (!workHosterId) {
+    if (!gatewayClientId) {
-      workHosterId = crypto.randomUUID();
+      gatewayClientId = crypto.randomUUID();
-      this.database.setSetting('dcrouterWorkHosterId', workHosterId);
+      this.database.setSetting('dcrouterGatewayClientId', gatewayClientId);
     }
-    return workHosterId;
+    return gatewayClientId;
   }
 
   private buildOwnership(
@@ -304,12 +408,25 @@ export class ExternalGatewayManager {
   ): IWorkAppRouteOwnership {
     return {
       workHosterType: 'onebox',
-      workHosterId: config.workHosterId,
+      workHosterId: config.gatewayClientId,
       workAppId: service.name || `service-${service.id}`,
       hostname,
     };
   }
 
+  private buildGatewayClientOwnership(
+    service: Pick<IService, 'id' | 'name'>,
+    hostname: string,
+    config: IExternalGatewayConfig,
+  ): IGatewayClientOwnership {
+    return {
+      gatewayClientType: 'onebox',
+      gatewayClientId: config.gatewayClientId,
+      appId: service.name || `service-${service.id}`,
+      hostname,
+    };
+  }
+
   private buildRoute(service: IService, config: IExternalGatewayConfig): IDcRouterRouteConfig {
     return {
       name: this.routeName(service.domain!),
@@ -335,6 +452,11 @@ export class ExternalGatewayManager {
     return `onebox-${domain.replace(/[^a-zA-Z0-9]+/g, '-').replace(/^-|-$/g, '')}`;
   }
 
+  private buildManageUrl(config: IExternalGatewayConfig, managePath?: string): string {
+    const normalizedPath = managePath?.startsWith('/') ? managePath : managePath ? `/${managePath}` : '';
+    return `${config.url}${normalizedPath}`;
+  }
+
   private async fireDcRouterRequest<TResponse>(
     method: string,
     requestData: Record<string, unknown>,

ts/classes/reverseproxy.ts

@@ -77,7 +77,7 @@ export class OneboxReverseProxy {
     if (status.running) {
       logger.info(`HTTPS already running on port ${this.httpsPort} via SmartProxy`);
     } else {
-      await this.smartProxy.start();
+      logger.warn('Skipping HTTPS reverse proxy startup because SmartProxy is not running');
     }
   }
 

ts/classes/smartproxy.ts

@@ -217,7 +217,7 @@ export class SmartProxyManager {
     return network.Id;
   }
 
-  private async waitForReady(maxAttempts = 120, intervalMs = 1000): Promise<void> {
+  private async waitForReady(maxAttempts = 10, intervalMs = 1000): Promise<void> {
     for (let i = 0; i < maxAttempts; i++) {
       try {
         const response = await fetch(`${this.adminUrl}/ready`);

ts/opsserver/classes.opsserver.ts

@@ -36,6 +36,7 @@ export class OpsServer {
       domain: 'localhost',
       feedMetadata: undefined,
       bundledContent: bundledFiles,
+      addCustomRoutes: async (typedserver) => this.registerCustomRoutes(typedserver),
     });
 
     // Chain typedrouters: server -> opsServer -> individual handlers
@@ -43,7 +44,6 @@ export class OpsServer {
 
     // Set up all handlers
     await this.setupHandlers();
-    this.registerCustomRoutes();
 
     await this.server.start(port);
     logger.success(`OpsServer started on http://localhost:${port}`);
@@ -73,18 +73,18 @@ export class OpsServer {
     logger.success('OpsServer TypedRequest handlers initialized');
   }
 
-  private registerCustomRoutes(): void {
+  private registerCustomRoutes(typedserver: plugins.typedserver.TypedServer): void {
-    this.server.typedserver.addRoute(
+    typedserver.addRoute(
       '/v2',
       'ALL',
       async (ctx) => this.oneboxRef.registry.handleRequest(ctx.request),
     );
-    this.server.typedserver.addRoute(
+    typedserver.addRoute(
       '/v2/*',
       'ALL',
       async (ctx) => this.oneboxRef.registry.handleRequest(ctx.request),
     );
-    this.server.typedserver.addRoute(
+    typedserver.addRoute(
       '/backups/:backupId/download',
       'GET',
       async (ctx) => {

ts/opsserver/handlers/admin.handler.ts

@@ -2,7 +2,7 @@ import * as plugins from '../../plugins.ts';
 import { logger } from '../../logging.ts';
 import type { OpsServer } from '../classes.opsserver.ts';
 import * as interfaces from '../../../ts_interfaces/index.ts';
-import { hashPassword, needsPasswordUpgrade, verifyPassword } from '../../utils/auth.ts';
+import { hashPassword, verifyPassword } from '../../utils/auth.ts';
 
 export interface IJwtData {
   userId: string;
@@ -112,11 +112,6 @@ export class AdminHandler {
               throw new plugins.typedrequest.TypedResponseError('Invalid credentials');
             }
 
-            if (needsPasswordUpgrade(user.passwordHash)) {
-              const upgradedHash = await hashPassword(dataArg.password);
-              this.opsServerRef.oneboxRef.database.updateUserPassword(user.username, upgradedHash);
-            }
-
             const expiresAt = Date.now() + 24 * 3600 * 1000;
             const freshUser = this.opsServerRef.oneboxRef.database.getUserByUsername(user.username) || user;
             const identity = await this.createIdentityForUser(freshUser, expiresAt);

ts/opsserver/handlers/dns.handler.ts

@@ -61,5 +61,16 @@ export class DnsHandler {
         },
       ),
     );
+
+    this.typedrouter.addTypedHandler(
+      new plugins.typedrequest.TypedHandler<interfaces.requests.IReq_GetGatewayDnsRecords>(
+        'getGatewayDnsRecords',
+        async (dataArg) => {
+          await requireAdminIdentity(this.opsServerRef.adminHandler, dataArg);
+          const records = await this.opsServerRef.oneboxRef.externalGateway.getGatewayDnsRecords();
+          return { records };
+        },
+      ),
+    );
   }
 }

ts/opsserver/handlers/domains.handler.ts

@@ -97,5 +97,16 @@ export class DomainsHandler {
         },
       ),
     );
+
+    this.typedrouter.addTypedHandler(
+      new plugins.typedrequest.TypedHandler<interfaces.requests.IReq_GetGatewayDomains>(
+        'getGatewayDomains',
+        async (dataArg) => {
+          await requireAdminIdentity(this.opsServerRef.adminHandler, dataArg);
+          const domains = await this.opsServerRef.oneboxRef.externalGateway.getGatewayDomains();
+          return { domains };
+        },
+      ),
+    );
   }
 }

ts/opsserver/handlers/settings.handler.ts

@@ -24,7 +24,8 @@ export class SettingsHandler {
       cloudflareZoneId: settingsMap['cloudflareZoneId'] || '',
       dcrouterGatewayUrl: settingsMap['dcrouterGatewayUrl'] || '',
       dcrouterGatewayApiToken: dcrouterGatewayApiToken || '',
-      dcrouterWorkHosterId: settingsMap['dcrouterWorkHosterId'] || '',
+      dcrouterGatewayClientId: settingsMap['dcrouterGatewayClientId'] || settingsMap['dcrouterWorkHosterId'] || '',
+      dcrouterWorkHosterId: settingsMap['dcrouterWorkHosterId'] || settingsMap['dcrouterGatewayClientId'] || '',
       dcrouterTargetHost: settingsMap['dcrouterTargetHost'] || '',
       dcrouterTargetPort: parseInt(settingsMap['dcrouterTargetPort'] || '0', 10),
       autoRenewCerts: settingsMap['autoRenewCerts'] === 'true',
@@ -106,6 +107,7 @@ export class SettingsHandler {
     return [
       'dcrouterGatewayUrl',
       'dcrouterGatewayApiToken',
+      'dcrouterGatewayClientId',
       'dcrouterWorkHosterId',
       'dcrouterTargetHost',
       'dcrouterTargetPort',

ts/plugins.ts

@@ -55,10 +55,6 @@ export const awsS3 = {
 import * as taskbuffer from '@push.rocks/taskbuffer';
 export { taskbuffer };
 
-// Crypto utilities (for password hashing, encryption)
-import * as bcrypt from 'https://deno.land/x/bcrypt@v0.4.1/mod.ts';
-export { bcrypt };
-
 // JWT for authentication
 import * as jwt from 'https://deno.land/x/djwt@v3.0.2/mod.ts';
 export { jwt};

ts/types.ts

@@ -261,6 +261,8 @@ export interface IAppSettings {
   cloudflareZoneId?: string;
   dcrouterGatewayUrl?: string;
   dcrouterGatewayApiToken?: string;
+  dcrouterGatewayClientId?: string;
+  /** @deprecated Use dcrouterGatewayClientId. */
   dcrouterWorkHosterId?: string;
   dcrouterTargetHost?: string;
   dcrouterTargetPort?: number;

ts/utils/auth.ts

@@ -1,17 +1,79 @@
-import * as plugins from '../plugins.ts';
+const pbkdf2HashPattern = /^pbkdf2-sha256\$(\d+)\$([A-Za-z0-9+/=]+)\$([A-Za-z0-9+/=]+)$/;
+const pbkdf2Iterations = 210_000;
+const pbkdf2KeyLengthBits = 256;
 
-const bcryptHashPattern = /^\$2[abxy]\$\d\d\$/;
+const bytesToBase64 = (bytesArg: Uint8Array): string => {
+  let binary = '';
+  for (const byte of bytesArg) {
+    binary += String.fromCharCode(byte);
+  }
+  return btoa(binary);
+};
 
-export function isBcryptHash(passwordHash: string): boolean {
+const base64ToBytes = (base64Arg: string): Uint8Array => {
-  return bcryptHashPattern.test(passwordHash);
+  const binary = atob(base64Arg);
-}
+  const bytes = new Uint8Array(binary.length);
+  for (let i = 0; i < binary.length; i++) {
+    bytes[i] = binary.charCodeAt(i);
+  }
+  return bytes;
+};
 
-export function needsPasswordUpgrade(passwordHash: string): boolean {
+const timingSafeEqual = (aArg: Uint8Array, bArg: Uint8Array): boolean => {
-  return !isBcryptHash(passwordHash);
+  if (aArg.length !== bArg.length) {
+    return false;
+  }
+
+  let diff = 0;
+  for (let i = 0; i < aArg.length; i++) {
+    diff |= aArg[i] ^ bArg[i];
+  }
+  return diff === 0;
+};
+
+const toArrayBuffer = (bytesArg: Uint8Array): ArrayBuffer => {
+  return bytesArg.buffer.slice(
+    bytesArg.byteOffset,
+    bytesArg.byteOffset + bytesArg.byteLength,
+  ) as ArrayBuffer;
+};
+
+const derivePasswordHash = async (
+  passwordArg: string,
+  saltArg: Uint8Array,
+  iterationsArg: number,
+): Promise<Uint8Array> => {
+  const key = await crypto.subtle.importKey(
+    'raw',
+    new TextEncoder().encode(passwordArg),
+    'PBKDF2',
+    false,
+    ['deriveBits'],
+  );
+
+  const bits = await crypto.subtle.deriveBits(
+    {
+      name: 'PBKDF2',
+      hash: 'SHA-256',
+      salt: toArrayBuffer(saltArg),
+      iterations: iterationsArg,
+    },
+    key,
+    pbkdf2KeyLengthBits,
+  );
+
+  return new Uint8Array(bits);
+};
+
+export function isPbkdf2Hash(passwordHash: string): boolean {
+  return pbkdf2HashPattern.test(passwordHash);
 }
 
 export async function hashPassword(password: string): Promise<string> {
-  return await plugins.bcrypt.hash(password);
+  // Use Web Crypto only so compiled binaries do not depend on external worker files.
+  const salt = crypto.getRandomValues(new Uint8Array(16));
+  const hash = await derivePasswordHash(password, salt, pbkdf2Iterations);
+  return `pbkdf2-sha256$${pbkdf2Iterations}$${bytesToBase64(salt)}$${bytesToBase64(hash)}`;
 }
 
 export async function verifyPassword(password: string, passwordHash: string): Promise<boolean> {
@@ -19,10 +81,14 @@ export async function verifyPassword(password: string, passwordHash: string): Pr
     return false;
   }
 
-  if (isBcryptHash(passwordHash)) {
+  const pbkdf2Match = passwordHash.match(pbkdf2HashPattern);
-    return await plugins.bcrypt.compare(password, passwordHash);
+  if (pbkdf2Match) {
+    const iterations = Number(pbkdf2Match[1]);
+    const salt = base64ToBytes(pbkdf2Match[2]);
+    const expectedHash = base64ToBytes(pbkdf2Match[3]);
+    const actualHash = await derivePasswordHash(password, salt, iterations);
+    return timingSafeEqual(actualHash, expectedHash);
   }
 
-  // Legacy compatibility for older databases that stored base64-encoded passwords.
+  return false;
-  return passwordHash === btoa(password);
 }

ts_interfaces/data/domain.ts

@@ -57,3 +57,40 @@ export interface IDnsRecord {
   createdAt: number;
   updatedAt: number;
 }
+
+export interface IGatewayDomain {
+  id?: string;
+  name: string;
+  source?: 'dcrouter' | 'provider';
+  authoritative?: boolean;
+  providerId?: string;
+  serviceCount?: number;
+  managePath?: string;
+  manageUrl?: string;
+  capabilities?: {
+    canCreateSubdomains: boolean;
+    canManageDnsRecords: boolean;
+    canIssueCertificates: boolean;
+    canHostEmail: boolean;
+  };
+}
+
+export interface IGatewayDnsRecord {
+  id: string;
+  domainId: string;
+  domainName?: string;
+  name: string;
+  type: string;
+  value: string;
+  ttl: number;
+  source: string;
+  status: 'active' | 'missing';
+  gatewayClientType: 'onebox' | 'cloudly' | 'custom';
+  gatewayClientId: string;
+  appId: string;
+  hostname: string;
+  routeId?: string;
+  serviceName?: string;
+  managePath?: string;
+  manageUrl?: string;
+}

ts_interfaces/data/settings.ts

@@ -7,6 +7,8 @@ export interface ISettings {
   cloudflareZoneId: string;
   dcrouterGatewayUrl: string;
   dcrouterGatewayApiToken: string;
+  dcrouterGatewayClientId: string;
+  /** @deprecated Use dcrouterGatewayClientId. */
   dcrouterWorkHosterId: string;
   dcrouterTargetHost: string;
   dcrouterTargetPort: number;

ts_interfaces/requests/dns.ts

@@ -56,3 +56,16 @@ export interface IReq_SyncDns extends plugins.typedrequestInterfaces.implementsT
     records: data.IDnsRecord[];
   };
 }
+
+export interface IReq_GetGatewayDnsRecords extends plugins.typedrequestInterfaces.implementsTR<
+  plugins.typedrequestInterfaces.ITypedRequest,
+  IReq_GetGatewayDnsRecords
+> {
+  method: 'getGatewayDnsRecords';
+  request: {
+    identity: data.IIdentity;
+  };
+  response: {
+    records: data.IGatewayDnsRecord[];
+  };
+}

ts_interfaces/requests/domains.ts

@@ -40,3 +40,16 @@ export interface IReq_SyncDomains extends plugins.typedrequestInterfaces.impleme
     domains: data.IDomainDetail[];
   };
 }
+
+export interface IReq_GetGatewayDomains extends plugins.typedrequestInterfaces.implementsTR<
+  plugins.typedrequestInterfaces.ITypedRequest,
+  IReq_GetGatewayDomains
+> {
+  method: 'getGatewayDomains';
+  request: {
+    identity: data.IIdentity;
+  };
+  response: {
+    domains: data.IGatewayDomain[];
+  };
+}

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/onebox',
-  version: '1.24.2',
+  version: '1.25.0',
   description: 'Self-hosted container platform with automatic SSL and DNS - a mini Heroku for single servers'
 }

ts_web/appstate.ts

@@ -36,6 +36,8 @@ export interface INetworkState {
   trafficStats: interfaces.data.ITrafficStats | null;
   dnsRecords: interfaces.data.IDnsRecord[];
   domains: interfaces.data.IDomainDetail[];
+  gatewayDomains: interfaces.data.IGatewayDomain[];
+  gatewayDnsRecords: interfaces.data.IGatewayDnsRecord[];
   certificates: interfaces.data.ICertificate[];
 }
 
@@ -110,6 +112,8 @@ export const networkStatePart = await appState.getStatePart<INetworkState>(
     trafficStats: null,
     dnsRecords: [],
     domains: [],
+    gatewayDomains: [],
+    gatewayDnsRecords: [],
     certificates: [],
   },
   'soft',
@@ -628,6 +632,34 @@ export const fetchDomainsAction = networkStatePart.createAction(async (statePart
   }
 });
 
+export const fetchGatewayDomainsAction = networkStatePart.createAction(async (statePartArg) => {
+  const context = getActionContext();
+  try {
+    const typedRequest = new plugins.domtools.plugins.typedrequest.TypedRequest<
+      interfaces.requests.IReq_GetGatewayDomains
+    >('/typedrequest', 'getGatewayDomains');
+    const response = await typedRequest.fire({ identity: context.identity! });
+    return { ...statePartArg.getState(), gatewayDomains: response.domains };
+  } catch (err) {
+    console.error('Failed to fetch gateway domains:', err);
+    return statePartArg.getState();
+  }
+});
+
+export const fetchGatewayDnsRecordsAction = networkStatePart.createAction(async (statePartArg) => {
+  const context = getActionContext();
+  try {
+    const typedRequest = new plugins.domtools.plugins.typedrequest.TypedRequest<
+      interfaces.requests.IReq_GetGatewayDnsRecords
+    >('/typedrequest', 'getGatewayDnsRecords');
+    const response = await typedRequest.fire({ identity: context.identity! });
+    return { ...statePartArg.getState(), gatewayDnsRecords: response.records };
+  } catch (err) {
+    console.error('Failed to fetch gateway DNS records:', err);
+    return statePartArg.getState();
+  }
+});
+
 export const fetchCertificatesAction = networkStatePart.createAction(async (statePartArg) => {
   const context = getActionContext();
   try {

ts_web/elements/ob-app-shell.ts

@@ -14,6 +14,8 @@ import {
 
 import type { ObViewDashboard } from './ob-view-dashboard.js';
 import type { ObViewServices } from './ob-view-services.js';
+import type { ObViewDomains } from './ob-view-domains.js';
+import type { ObViewDnsRecords } from './ob-view-dns-records.js';
 import type { ObViewNetwork } from './ob-view-network.js';
 import type { ObViewRegistries } from './ob-view-registries.js';
 import type { ObViewTokens } from './ob-view-tokens.js';
@@ -41,6 +43,8 @@ export class ObAppShell extends DeesElement {
     { name: 'Dashboard', iconName: 'lucide:layoutDashboard', element: (async () => (await import('./ob-view-dashboard.js')).ObViewDashboard)() },
     { name: 'App Store', iconName: 'lucide:store', element: (async () => (await import('./ob-view-appstore.js')).ObViewAppStore)() },
     { name: 'Services', iconName: 'lucide:boxes', element: (async () => (await import('./ob-view-services.js')).ObViewServices)() },
+    { name: 'Domains', iconName: 'lucide:globe', element: (async () => (await import('./ob-view-domains.js')).ObViewDomains)() },
+    { name: 'DNS Records', iconName: 'lucide:listTree', element: (async () => (await import('./ob-view-dns-records.js')).ObViewDnsRecords)() },
     { name: 'Network', iconName: 'lucide:network', element: (async () => (await import('./ob-view-network.js')).ObViewNetwork)() },
     { name: 'Registries', iconName: 'lucide:package', element: (async () => (await import('./ob-view-registries.js')).ObViewRegistries)() },
     { name: 'Tokens', iconName: 'lucide:key', element: (async () => (await import('./ob-view-tokens.js')).ObViewTokens)() },

ts_web/elements/ob-view-dashboard.ts

@@ -36,6 +36,8 @@ export class ObViewDashboard extends DeesElement {
     trafficStats: null,
     dnsRecords: [],
     domains: [],
+    gatewayDomains: [],
+    gatewayDnsRecords: [],
     certificates: [],
   };
 

ts_web/elements/ob-view-dns-records.ts

@@ -0,0 +1,88 @@
+import * as shared from './shared/index.js';
+import * as appstate from '../appstate.js';
+import { appRouter } from '../router.js';
+import {
+  DeesElement,
+  customElement,
+  html,
+  state,
+  css,
+  cssManager,
+  type TemplateResult,
+} from '@design.estate/dees-element';
+
+@customElement('ob-view-dns-records')
+export class ObViewDnsRecords extends DeesElement {
+  @state()
+  accessor networkState: appstate.INetworkState = {
+    targets: [],
+    stats: null,
+    trafficStats: null,
+    dnsRecords: [],
+    domains: [],
+    gatewayDomains: [],
+    gatewayDnsRecords: [],
+    certificates: [],
+  };
+
+  constructor() {
+    super();
+    const networkSub = appstate.networkStatePart.select((s) => s).subscribe((newState) => {
+      this.networkState = newState;
+    });
+    this.rxSubscriptions.push(networkSub);
+  }
+
+  public static styles = [
+    cssManager.defaultStyles,
+    shared.viewHostCss,
+    css`
+      .table { border: 1px solid var(--ci-shade-2, #e4e4e7); border-radius: 10px; overflow: hidden; }
+      .row { display: grid; grid-template-columns: 2fr 90px 2fr 90px 140px 220px; gap: 16px; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--ci-shade-2, #e4e4e7); }
+      .row:last-child { border-bottom: none; }
+      .header { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--ci-shade-5, #71717a); background: var(--ci-shade-1, #f4f4f5); }
+      .name { font-weight: 600; }
+      .value { font-family: monospace; color: var(--ci-shade-5, #71717a); overflow-wrap: anywhere; }
+      .badge { border-radius: 999px; padding: 3px 8px; background: var(--ci-shade-1, #f4f4f5); font-size: 12px; }
+      .missing { color: #dc2626; }
+      a, button.link { color: var(--ci-primary, #2563eb); background: none; border: none; padding: 0; cursor: pointer; font: inherit; text-decoration: none; }
+      .actions { display: flex; gap: 12px; }
+      .empty { padding: 32px; text-align: center; color: var(--ci-shade-5, #71717a); }
+    `,
+  ];
+
+  async connectedCallback() {
+    super.connectedCallback();
+    await appstate.networkStatePart.dispatchAction(appstate.fetchGatewayDnsRecordsAction, null);
+  }
+
+  public render(): TemplateResult {
+    const records = this.networkState.gatewayDnsRecords;
+    return html`
+      <ob-sectionheading>DNS Records</ob-sectionheading>
+      <div class="table">
+        <div class="row header">
+          <span>Name</span>
+          <span>Type</span>
+          <span>Value</span>
+          <span>Status</span>
+          <span>Service</span>
+          <span>Actions</span>
+        </div>
+        ${records.length ? records.map((record) => html`
+          <div class="row ${record.status === 'missing' ? 'missing' : ''}">
+            <span class="name">${record.name}</span>
+            <span><span class="badge">${record.type}</span></span>
+            <span class="value">${record.value || '-'}</span>
+            <span>${record.status}</span>
+            <span>${record.serviceName || record.appId}</span>
+            <span class="actions">
+              <button class="link" @click=${() => appRouter.navigateToView('services')}>View service</button>
+              ${record.manageUrl ? html`<a href=${record.manageUrl} target="_blank" rel="noopener">Manage in dcrouter</a>` : ''}
+            </span>
+          </div>
+        `) : html`<div class="empty">No gateway DNS records found. Configure a dcrouter gateway in Settings.</div>`}
+      </div>
+    `;
+  }
+}

ts_web/elements/ob-view-domains.ts

@@ -0,0 +1,97 @@
+import * as shared from './shared/index.js';
+import * as appstate from '../appstate.js';
+import {
+  DeesElement,
+  customElement,
+  html,
+  state,
+  css,
+  cssManager,
+  type TemplateResult,
+} from '@design.estate/dees-element';
+
+@customElement('ob-view-domains')
+export class ObViewDomains extends DeesElement {
+  @state()
+  accessor networkState: appstate.INetworkState = {
+    targets: [],
+    stats: null,
+    trafficStats: null,
+    dnsRecords: [],
+    domains: [],
+    gatewayDomains: [],
+    gatewayDnsRecords: [],
+    certificates: [],
+  };
+
+  constructor() {
+    super();
+    const networkSub = appstate.networkStatePart.select((s) => s).subscribe((newState) => {
+      this.networkState = newState;
+    });
+    this.rxSubscriptions.push(networkSub);
+  }
+
+  public static styles = [
+    cssManager.defaultStyles,
+    shared.viewHostCss,
+    css`
+      .table {
+        border: 1px solid var(--ci-shade-2, #e4e4e7);
+        border-radius: 10px;
+        overflow: hidden;
+      }
+      .row {
+        display: grid;
+        grid-template-columns: 2fr 1fr 120px 120px 140px;
+        gap: 16px;
+        align-items: center;
+        padding: 14px 16px;
+        border-bottom: 1px solid var(--ci-shade-2, #e4e4e7);
+      }
+      .row:last-child { border-bottom: none; }
+      .header { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--ci-shade-5, #71717a); background: var(--ci-shade-1, #f4f4f5); }
+      .domain { font-weight: 600; }
+      .muted { color: var(--ci-shade-5, #71717a); font-size: 13px; }
+      .badge { border-radius: 999px; padding: 3px 8px; background: var(--ci-shade-1, #f4f4f5); font-size: 12px; }
+      a { color: var(--ci-primary, #2563eb); text-decoration: none; }
+      .empty { padding: 32px; text-align: center; color: var(--ci-shade-5, #71717a); }
+    `,
+  ];
+
+  async connectedCallback() {
+    super.connectedCallback();
+    await appstate.networkStatePart.dispatchAction(appstate.fetchGatewayDomainsAction, null);
+  }
+
+  public render(): TemplateResult {
+    const domains = this.networkState.gatewayDomains;
+    return html`
+      <ob-sectionheading>Domains</ob-sectionheading>
+      <div class="muted" style="margin-bottom: 16px;">
+        Domains are managed in dcrouter. Onebox shows gateway visibility for deployed services.
+      </div>
+      <div class="table">
+        <div class="row header">
+          <span>Domain</span>
+          <span>Source</span>
+          <span>Authoritative</span>
+          <span>Services</span>
+          <span>Actions</span>
+        </div>
+        ${domains.length ? domains.map((domain) => html`
+          <div class="row">
+            <span>
+              <span class="domain">${domain.name}</span>
+              ${domain.providerId ? html`<div class="muted">Provider: ${domain.providerId}</div>` : ''}
+            </span>
+            <span><span class="badge">${domain.source || 'dcrouter'}</span></span>
+            <span>${domain.authoritative ? 'Yes' : 'No'}</span>
+            <span>${domain.serviceCount || 0}</span>
+            <span>${domain.manageUrl ? html`<a href=${domain.manageUrl} target="_blank" rel="noopener">Manage in dcrouter</a>` : '-'}</span>
+          </div>
+        `) : html`<div class="empty">No gateway domains found. Configure a dcrouter gateway in Settings.</div>`}
+      </div>
+    `;
+  }
+}

ts_web/elements/ob-view-network.ts

@@ -20,6 +20,8 @@ export class ObViewNetwork extends DeesElement {
     trafficStats: null,
     dnsRecords: [],
     domains: [],
+    gatewayDomains: [],
+    gatewayDnsRecords: [],
     certificates: [],
   };
 

ts_web/elements/ob-view-settings.ts

@@ -49,27 +49,29 @@ export class ObViewSettings extends DeesElement {
     css`
       .gateway-card {
         margin-bottom: 24px;
-        border: 1px solid var(--dees-color-border-subtle);
+        border: 1px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
         border-radius: 12px;
-        background: var(--dees-color-background, #ffffff);
+        background: ${cssManager.bdTheme('#ffffff', '#09090b')};
         overflow: hidden;
+        box-shadow: 0 1px 2px ${cssManager.bdTheme('rgba(0,0,0,0.04)', 'rgba(0,0,0,0.2)')};
       }
 
       .gateway-header {
         padding: 16px 20px;
-        border-bottom: 1px solid var(--dees-color-border-subtle);
+        border-bottom: 1px solid ${cssManager.bdTheme('#f4f4f5', '#27272a')};
+        background: ${cssManager.bdTheme('#fafafa', '#101013')};
       }
 
       .gateway-title {
         font-size: 15px;
         font-weight: 600;
-        color: var(--dees-color-text-primary);
+        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
       }
 
       .gateway-subtitle {
         margin-top: 4px;
         font-size: 13px;
-        color: var(--dees-color-text-muted);
+        color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
       }
 
       .gateway-content {
@@ -83,34 +85,8 @@ export class ObViewSettings extends DeesElement {
         grid-column: 1 / -1;
       }
 
-      .field-label {
+      dees-input-text {
-        display: block;
-        margin-bottom: 6px;
-        font-size: 13px;
-        font-weight: 500;
-        color: var(--dees-color-text-secondary);
-      }
-
-      input {
         width: 100%;
-        box-sizing: border-box;
-        padding: 10px 12px;
-        border: 1px solid var(--dees-color-border-subtle);
-        border-radius: 8px;
-        background: transparent;
-        color: var(--dees-color-text-primary);
-        font-size: 14px;
-      }
-
-      input:focus {
-        outline: none;
-        border-color: #3b82f6;
-      }
-
-      .field-hint {
-        margin-top: 5px;
-        font-size: 12px;
-        color: var(--dees-color-text-muted);
       }
 
       .gateway-footer {
@@ -119,21 +95,6 @@ export class ObViewSettings extends DeesElement {
         padding: 0 20px 20px;
       }
 
-      .save-button {
-        border: none;
-        border-radius: 8px;
-        background: #2563eb;
-        color: white;
-        cursor: pointer;
-        font-size: 13px;
-        font-weight: 600;
-        padding: 9px 14px;
-      }
-
-      .save-button:hover {
-        background: #1d4ed8;
-      }
-
       @media (max-width: 700px) {
         .gateway-content {
           grid-template-columns: 1fr;
@@ -156,6 +117,8 @@ export class ObViewSettings extends DeesElement {
           darkMode: true,
           cloudflareToken: '',
           cloudflareZoneId: '',
+          dcrouterGatewayClientId: '',
+          dcrouterWorkHosterId: '',
           autoRenewCerts: false,
           renewalThreshold: 30,
           acmeEmail: '',
@@ -190,18 +153,23 @@ export class ObViewSettings extends DeesElement {
     return html`
       <section class="gateway-card">
         <div class="gateway-header">
-          <div class="gateway-title">External dcrouter Gateway</div>
+          <div class="gateway-title">Delegate Routing</div>
-          <div class="gateway-subtitle">Delegate public WorkApp routing, DNS, and certificates to a dcrouter edge authority.</div>
+          <div class="gateway-subtitle">Delegate public app routing, DNS, and certificates to a dcrouter edge authority.</div>
         </div>
         <div class="gateway-content">
-          ${this.renderGatewayInput('dcrouterGatewayUrl', 'Gateway URL', settings?.dcrouterGatewayUrl || '', 'https://edge.example.com', 'Base URL of the dcrouter OpsServer.')}
+          ${this.renderGatewayInput('dcrouterGatewayUrl', 'Gateway URL', settings?.dcrouterGatewayUrl || '', 'Base URL of the dcrouter OpsServer.')}
-          ${this.renderGatewayInput('dcrouterGatewayApiToken', 'API Token', settings?.dcrouterGatewayApiToken || '', 'dcrouter API token', 'Requires workhosters and certificates scopes.', 'password')}
+          ${this.renderGatewayInput('dcrouterGatewayApiToken', 'API Token', settings?.dcrouterGatewayApiToken || '', 'Requires gateway-client access in dcrouter.', true)}
-          ${this.renderGatewayInput('dcrouterWorkHosterId', 'WorkHoster ID', settings?.dcrouterWorkHosterId || '', 'optional stable owner ID', 'Leave empty to let Onebox create a stable ID.')}
+          ${this.renderGatewayInput('dcrouterGatewayClientId', 'Gateway Client ID', settings?.dcrouterGatewayClientId || settings?.dcrouterWorkHosterId || '', 'Leave empty to let Onebox create a stable ID.')}
-          ${this.renderGatewayInput('dcrouterTargetHost', 'Target Host', settings?.dcrouterTargetHost || '', 'public or private host/IP', 'Defaults to the configured server IP when empty.')}
+          ${this.renderGatewayInput('dcrouterTargetHost', 'Target Host', settings?.dcrouterTargetHost || '', 'Defaults to the configured server IP when empty.')}
-          ${this.renderGatewayInput('dcrouterTargetPort', 'Target Port', String(settings?.dcrouterTargetPort || 80), '80', 'Internal HTTP port dcrouter forwards to.', 'number')}
+          ${this.renderGatewayInput('dcrouterTargetPort', 'Target Port', String(settings?.dcrouterTargetPort || 80), 'Internal HTTP port dcrouter forwards to.')}
         </div>
         <div class="gateway-footer">
-          <button class="save-button" @click=${() => this.saveExternalGatewaySettings()}>Save Gateway Settings</button>
+          <dees-button
+            .text=${'Save Gateway Settings'}
+            .type=${'default'}
+            .icon=${'lucide:Save'}
+            @click=${() => this.saveExternalGatewaySettings()}
+          ></dees-button>
         </div>
       </section>
     `;
@@ -211,21 +179,20 @@ export class ObViewSettings extends DeesElement {
     key: keyof NonNullable<appstate.ISettingsState['settings']>,
     label: string,
     value: string,
-    placeholder: string,
     hint: string,
-    type: 'text' | 'password' | 'number' = 'text',
+    isPassword = false,
   ): TemplateResult {
     return html`
-      <label class="gateway-field ${key === 'dcrouterGatewayUrl' ? 'full' : ''}">
+      <div class="gateway-field ${key === 'dcrouterGatewayUrl' ? 'full' : ''}">
-        <span class="field-label">${label}</span>
+        <dees-input-text
-        <input
+          .key=${key}
-          type=${type}
+          .label=${label}
           .value=${value}
-          placeholder=${placeholder}
+          .description=${hint}
+          .isPasswordBool=${isPassword}
           @input=${(event: Event) => this.updateGatewayDraft(key, (event.target as HTMLInputElement).value)}
-        />
+        ></dees-input-text>
-        <span class="field-hint">${hint}</span>
+      </div>
-      </label>
     `;
   }
 
@@ -252,7 +219,7 @@ export class ObViewSettings extends DeesElement {
       settings: {
         dcrouterGatewayUrl: settings.dcrouterGatewayUrl || '',
         dcrouterGatewayApiToken: settings.dcrouterGatewayApiToken || '',
-        dcrouterWorkHosterId: settings.dcrouterWorkHosterId || '',
+        dcrouterGatewayClientId: settings.dcrouterGatewayClientId || settings.dcrouterWorkHosterId || '',
         dcrouterTargetHost: settings.dcrouterTargetHost || '',
         dcrouterTargetPort: Number(settings.dcrouterTargetPort) || 80,
       },

ts_web/router.ts

@@ -4,7 +4,7 @@ import * as appstate from './appstate.js';
 const SmartRouter = plugins.domtools.plugins.smartrouter.SmartRouter;
 
 export const validViews = [
-  'dashboard', 'app-store', 'services', 'network',
+  'dashboard', 'app-store', 'services', 'domains', 'dns-records', 'network',
   'registries', 'tokens', 'settings',
 ] as const;