feat(vpn): add tag-based VPN route access control and support configured initial VPN clients

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '11.14.0',
+  version: '11.15.0',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

ts_web/appstate.ts

@@ -974,7 +974,7 @@ export const fetchVpnAction = vpnStatePart.createAction(async (statePartArg): Pr
 
 export const createVpnClientAction = vpnStatePart.createAction<{
   clientId: string;
-  tags?: string[];
+  serverDefinedClientTags?: string[];
   description?: string;
 }>(async (statePartArg, dataArg, actionContext): Promise<IVpnState> => {
   const context = getActionContext();
@@ -988,7 +988,7 @@ export const createVpnClientAction = vpnStatePart.createAction<{
     const response = await request.fire({
       identity: context.identity!,
       clientId: dataArg.clientId,
-      tags: dataArg.tags,
+      serverDefinedClientTags: dataArg.serverDefinedClientTags,
       description: dataArg.description,
     });
 

ts_web/elements/ops-view-vpn.ts

@@ -255,8 +255,8 @@ export class OpsViewVpn extends DeesElement {
             ? html`<span class="statusBadge enabled">enabled</span>`
             : html`<span class="statusBadge disabled">disabled</span>`,
           'VPN IP': client.assignedIp || '-',
-          'Tags': client.tags?.length
-            ? html`${client.tags.map(t => html`<span class="tagBadge">${t}</span>`)}`
+          'Tags': client.serverDefinedClientTags?.length
+            ? html`${client.serverDefinedClientTags.map(t => html`<span class="tagBadge">${t}</span>`)}`
             : '-',
           'Description': client.description || '-',
           'Created': new Date(client.createdAt).toLocaleDateString(),
@@ -312,11 +312,11 @@ export class OpsViewVpn extends DeesElement {
                 action: async (modal: any) => {
                   const form = modal.shadowRoot!.querySelector('dees-form') as any;
                   const data = await form.collectFormData();
-                  const tags = data.tags ? data.tags.split(',').map((t: string) => t.trim()).filter(Boolean) : undefined;
+                  const serverDefinedClientTags = data.tags ? data.tags.split(',').map((t: string) => t.trim()).filter(Boolean) : undefined;
                   await appstate.vpnStatePart.dispatchAction(appstate.createVpnClientAction, {
                     clientId: data.clientId,
                     description: data.description || undefined,
-                    tags,
+                    serverDefinedClientTags,
                   });
                   modal.destroy();
                 },