@ioka-technologies/asyncapi-ts-client-template 0.0.12 → 0.0.18

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "@ioka-technologies/asyncapi-ts-client-template",
-    "version": "0.0.12",
+    "version": "0.0.18",
     "description": "TypeScript AsyncAPI client generator template compatible with rust-asyncapi patterns",
     "main": "template/index.js",
     "scripts": {
         "test": "npm run test:generate",
-        "test:generate": "asyncapi generate fromTemplate examples/auth-retry/asyncapi.yaml . -o test-output-auth-retry --force-write -p enableAuth=true && cd test-output-auth-retry && npm install && npm run build",
-        "test:realworld": "asyncapi generate fromTemplate ../examples/realworld/asyncapi.yaml . -o test-output-realworld --force-write -p enableAuth=true",
-        "test:simple": "asyncapi generate fromTemplate ../examples/simple/asyncapi.yaml . -o test-output-simple --force-write -p enableAuth=true",
+        "test:generate": "asyncapi generate fromTemplate examples/auth-retry/asyncapi.yaml . -o test-output-auth-retry --force-write && cd test-output-auth-retry && npm install && npm run build",
+        "test:realworld": "asyncapi generate fromTemplate ../examples/realworld/asyncapi.yaml . -o test-output-realworld --force-write",
+        "test:simple": "asyncapi generate fromTemplate ../examples/simple/asyncapi.yaml . -o test-output-simple --force-write",
         "clean": "rm -rf test-output-*"
     },
     "keywords": [
@@ -60,11 +60,6 @@
                 "default": "Apache-2.0",
                 "required": false
             },
-            "enableAuth": {
-                "description": "Enable authentication middleware",
-                "default": true,
-                "required": false
-            },
             "transports": {
                 "description": "Comma-separated list of transports to include",
                 "default": "websocket,http",

package/template/src/client.ts.js

@@ -2,6 +2,99 @@
 import { File } from '@asyncapi/generator-react-sdk';
 import { operationRequiresAuth, extractOperationSecurityMap } from '../helpers/security.js';
 
+// Helper functions for dynamic channels
+function isDynamicChannel(address) {
+    if (!address || typeof address !== 'string') return false;
+    return /\{[^}]+\}/.test(address);
+}
+
+function extractChannelVariables(address) {
+    if (!address || typeof address !== 'string') return [];
+    const matches = address.match(/\{([^}]+)\}/g);
+    if (!matches) return [];
+    return matches.map(match => match.slice(1, -1)); // Remove { and }
+}
+
+function getChannelParameters(channel) {
+    try {
+        const parameters = [];
+
+        // Try to get parameters from the channel
+        let channelParams = null;
+        if (channel.parameters && typeof channel.parameters === 'function') {
+            channelParams = channel.parameters();
+        } else if (channel.parameters) {
+            channelParams = channel.parameters;
+        } else if (channel._json && channel._json.parameters) {
+            channelParams = channel._json.parameters;
+        }
+
+        if (channelParams) {
+            // Handle different parameter formats
+            if (typeof channelParams === 'object') {
+                for (const [paramName, paramDef] of Object.entries(channelParams)) {
+                    // Skip internal AsyncAPI parser properties
+                    if (paramName.startsWith('_') || paramName === 'collections' || paramName === 'meta') {
+                        continue;
+                    }
+
+                    let description = 'Channel parameter';
+
+                    if (paramDef && typeof paramDef === 'object') {
+                        if (typeof paramDef.description === 'string') {
+                            description = paramDef.description;
+                        } else if (typeof paramDef.description === 'function') {
+                            try {
+                                description = paramDef.description();
+                            } catch (e) {
+                                description = 'Channel parameter';
+                            }
+                        } else if (paramDef._json && paramDef._json.description) {
+                            description = paramDef._json.description;
+                        }
+                    } else if (typeof paramDef === 'string') {
+                        description = paramDef;
+                    }
+
+                    // Create a valid TypeScript identifier
+                    let tsName = paramName.replace(/[^a-zA-Z0-9]/g, '_');
+                    if (/^[0-9]/.test(tsName)) {
+                        tsName = 'param_' + tsName;
+                    }
+                    if (!tsName || tsName === '_') {
+                        tsName = 'param';
+                    }
+
+                    parameters.push({
+                        name: paramName,
+                        description: description,
+                        tsName: tsName,
+                        tsType: 'string' // For now, assume all parameters are strings
+                    });
+                }
+            }
+        }
+
+        return parameters;
+    } catch (e) {
+        console.warn('Error extracting channel parameters:', e.message);
+        return [];
+    }
+}
+
+function resolveChannelAddress(address, variables) {
+    if (!address || typeof address !== 'string') return address;
+    if (!variables || typeof variables !== 'object') return address;
+
+    let resolved = address;
+    for (const [varName, varValue] of Object.entries(variables)) {
+        const placeholder = `{${varName}}`;
+        resolved = resolved.replace(new RegExp(placeholder.replace(/[{}]/g, '\\$&'), 'g'), varValue);
+    }
+
+    return resolved;
+}
+
 function generateClient(asyncapi, clientName) {
     // Method name sanitization function
     function sanitizeMethodName(operationId) {
@@ -95,6 +188,83 @@ export class ${clientName} {
     // Generated operation methods
 `;
 
+    // Extract channels and their operations for dynamic channel support
+    const channelServices = [];
+    if (asyncapi.channels) {
+        const channels = asyncapi.channels();
+        if (channels) {
+            for (const [channelKey, channel] of Object.entries(channels)) {
+                try {
+                    const channelName = channel.id ? channel.id() : channelKey;
+                    let channelAddress = null;
+                    if (channel.address && typeof channel.address === 'function') {
+                        channelAddress = channel.address();
+                    } else if (channel.address) {
+                        channelAddress = channel.address;
+                    }
+
+                    if (channelAddress) {
+                        const isDynamic = isDynamicChannel(channelAddress);
+                        const parameters = isDynamic ? getChannelParameters(channel) : [];
+
+                        channelServices.push({
+                            channelName,
+                            channelAddress,
+                            isDynamic,
+                            parameters,
+                            channel
+                        });
+                    }
+                } catch (e) {
+                    console.warn(`Error processing channel ${channelKey}:`, e.message);
+                }
+            }
+        }
+    }
+
+    // We'll generate channel services after processing operations
+
+    // Generate client accessor methods for dynamic channels
+    const dynamicChannelServices = channelServices.filter(cs => cs.isDynamic);
+    if (dynamicChannelServices.length > 0) {
+        dynamicChannelServices.forEach(channelService => {
+            const serviceName = `${channelService.channelName.charAt(0).toUpperCase() + channelService.channelName.slice(1)}Service`;
+
+            // Extract variables from the channel address to get the actual parameter names
+            const variables = extractChannelVariables(channelService.channelAddress);
+            const actualParams = variables.map(varName => {
+                const existingParam = channelService.parameters.find(p => p.name === varName);
+                return {
+                    name: varName,
+                    tsName: varName.replace(/[^a-zA-Z0-9]/g, '_'),
+                    tsType: 'string',
+                    description: existingParam?.description || `${varName} parameter`
+                };
+            });
+
+            const paramInterface = actualParams.map(p => `${p.tsName}: ${p.tsType}`).join(', ');
+            const methodName = channelService.channelName.replace(/[^a-zA-Z0-9]/g, '');
+
+            content += `
+    /**
+     * Access ${channelService.channelName} channel operations with parameters
+     *
+     * Returns a service instance configured for the specific channel parameters.
+     *
+     * @param ${actualParams.map(p => `${p.tsName} ${p.description}`).join('\n     * @param ')}
+     * @returns ${serviceName} instance for the resolved channel
+     *
+     * @example
+     * const service = client.${methodName}(${actualParams.map(p => `'${p.name.replace('_', '-')}'`).join(', ')});
+     * await service.someOperation(payload);
+     */
+    ${methodName}(${paramInterface}): ${serviceName} {
+        return new ${serviceName}(this.transport, ${actualParams.map(p => p.tsName).join(', ')});
+    }
+`;
+        });
+    }
+
     // Generate methods for each operation (AsyncAPI v3.0.0)
     if (asyncapi.operations) {
         const operations = asyncapi.operations();
@@ -238,6 +408,12 @@ export class ${clientName} {
                     }
 
                     if (channelAddress) {
+                        // Skip operations for dynamic channels - they'll be handled by channel services
+                        const channelService = channelServices.find(cs => cs.channelAddress === channelAddress);
+                        if (channelService && channelService.isDynamic) {
+                            return; // Skip this operation for the main client
+                        }
+
                         if (action === 'send') {
                             // Check if this is a request/response pattern
                             let hasReply = false;
@@ -336,6 +512,27 @@ export class ${clientName} {
         await this.transport.send('${channelAddress}', envelope, options);
     }
 `;
+
+                                // Also generate a subscription method for notification-type operations
+                                // (send operations without replies are typically notifications/events)
+                                const subscribeMethodName = `on${methodName.charAt(0).toUpperCase() + methodName.slice(1)}`;
+                                content += `
+    /**
+     * ${subscribeMethodName} - Subscribe to ${operationId} notifications
+     * Original operation: ${operationId}
+     * Channel: ${channelAddress}
+     * @param callback Function to call when a notification is received
+     * @returns Unsubscribe function to stop listening for notifications
+     */
+    ${subscribeMethodName}(callback: (payload: ${payloadType}) => void): () => void {
+        return this.transport.subscribe('${channelAddress}', '${operationId}', (envelope: MessageEnvelope) => {
+            // Filter by operation to ensure we only handle messages for this specific operation
+            if (envelope.operation === '${operationId}') {
+                callback(envelope.payload);
+            }
+        });
+    }
+`;
                             }
                         } else if (action === 'receive') {
                             // Sanitize the method name
@@ -352,7 +549,7 @@ export class ${clientName} {
      * @returns Unsubscribe function to stop listening for messages
      */
     ${methodName}(callback: (payload: ${payloadType}) => void): () => void {
-        return this.transport.subscribe('${channelAddress}', (envelope: MessageEnvelope) => {
+        return this.transport.subscribe('${channelAddress}', '${operationId}', (envelope: MessageEnvelope) => {
             // Filter by operation to ensure we only handle messages for this specific operation
             if (envelope.operation === '${operationId}') {
                 callback(envelope.payload);
@@ -371,7 +568,238 @@ export class ${clientName} {
 
     content += `
 }
+`;
+
+    // Generate channel service classes for dynamic channels
+    if (dynamicChannelServices.length > 0) {
+        dynamicChannelServices.forEach(channelService => {
+            const serviceName = `${channelService.channelName.charAt(0).toUpperCase() + channelService.channelName.slice(1)}Service`;
+
+            // Extract variables from the channel address to get the actual parameter names
+            const variables = extractChannelVariables(channelService.channelAddress);
+            const actualParams = variables.map(varName => {
+                const existingParam = channelService.parameters.find(p => p.name === varName);
+                return {
+                    name: varName,
+                    tsName: varName.replace(/[^a-zA-Z0-9]/g, '_'),
+                    tsType: 'string',
+                    description: existingParam?.description || `${varName} parameter`
+                };
+            });
+
+            const paramInterface = actualParams.map(p => `${p.tsName}: ${p.tsType}`).join(', ');
+
+            content += `
+/**
+ * ${channelService.channelName} channel service with resolved parameters
+ *
+ * This service provides access to operations on the ${channelService.channelName} channel
+ * with resolved channel parameters for dynamic routing.
+ */
+export class ${serviceName} {
+    private transport: Transport;
+    private resolvedChannel: string;
+
+    constructor(transport: Transport, ${paramInterface}) {
+        this.transport = transport;
+        this.resolvedChannel = '${channelService.channelAddress}'${actualParams.map(p => `
+            .replace('{${p.name}}', ${p.tsName})`).join('')};
+    }
+
+    /**
+     * Get the resolved channel address for this service
+     */
+    getChannel(): string {
+        return this.resolvedChannel;
+    }
+`;
+
+            // Add operations for this dynamic channel
+            if (asyncapi.operations) {
+                const operations = asyncapi.operations();
+                if (operations) {
+                    const operationArray = operations.all ? operations.all() : Object.values(operations);
+                    operationArray.forEach((operation) => {
+                        let operationId = null;
+                        if (operation._meta && operation._meta.id) {
+                            operationId = operation._meta.id;
+                        } else if (operation.id && typeof operation.id === 'function') {
+                            operationId = operation.id();
+                        } else if (operation.id) {
+                            operationId = operation.id;
+                        }
+
+                        if (!operationId) return;
+
+                        try {
+                            // Check if this operation belongs to this dynamic channel
+                            let channelAddress = null;
+                            const embeddedChannel = operation._json && operation._json.channel;
+
+                            if (embeddedChannel) {
+                                const embeddedChannelId = embeddedChannel['x-parser-unique-object-id'];
+                                if (embeddedChannelId) {
+                                    const channels = asyncapi.channels();
+                                    for (const [channelKey, channel] of Object.entries(channels || {})) {
+                                        if (channel.id && channel.id() === embeddedChannelId) {
+                                            if (channel.address && typeof channel.address === 'function') {
+                                                channelAddress = channel.address();
+                                            } else if (channel.address) {
+                                                channelAddress = channel.address;
+                                            }
+                                            break;
+                                        }
+                                    }
+                                }
+                            }
+
+                            if (channelAddress === channelService.channelAddress) {
+                                // This operation belongs to this dynamic channel
+                                let action = 'send';
+                                if (operation.action && typeof operation.action === 'function') {
+                                    action = operation.action();
+                                } else if (operation.action) {
+                                    action = operation.action;
+                                }
+
+                                // Get message types
+                                let messageTypes = [];
+                                if (operation.messages && typeof operation.messages === 'function') {
+                                    const messages = operation.messages();
+                                    if (messages && typeof messages.all === 'function') {
+                                        const messageArray = messages.all();
+                                        messageTypes = messageArray.map(msg => {
+                                            if (msg.name && typeof msg.name === 'function') {
+                                                return msg.name();
+                                            } else if (msg.name) {
+                                                return msg.name;
+                                            }
+                                            return null;
+                                        }).filter(Boolean);
+                                    }
+                                }
+
+                                const methodName = sanitizeMethodName(operationId);
+
+                                if (action === 'send') {
+                                    // Check for reply
+                                    let hasReply = false;
+                                    let replyMessageTypes = [];
+
+                                    if (operation.reply && typeof operation.reply === 'function') {
+                                        const reply = operation.reply();
+                                        if (reply) {
+                                            hasReply = true;
+                                            if (reply.messages && typeof reply.messages === 'function') {
+                                                const replyMessages = reply.messages();
+                                                if (replyMessages && typeof replyMessages.all === 'function') {
+                                                    const messageArray = replyMessages.all();
+                                                    replyMessageTypes = messageArray.map(msg => {
+                                                        if (msg.name && typeof msg.name === 'function') {
+                                                            return msg.name();
+                                                        } else if (msg.name) {
+                                                            return msg.name;
+                                                        }
+                                                        return null;
+                                                    }).filter(Boolean);
+                                                }
+                                            }
+                                        }
+                                    }
+
+                                    if (hasReply) {
+                                        const requestPayloadType = messageTypes.length > 0 ? `Models.${messageTypes[0]}Payload` : 'any';
+                                        const responseType = replyMessageTypes.length > 0 ? `Models.${replyMessageTypes[0]}Payload` : 'any';
+
+                                        content += `
+    /**
+     * ${methodName} - Request/Response operation
+     * Original operation: ${operationId}
+     * @param payload Request payload
+     * @param options Request options
+     * @returns Promise that resolves with the response
+     */
+    async ${methodName}(payload: ${requestPayloadType}, options?: RequestOptions): Promise<${responseType}> {
+        const envelope: MessageEnvelope = {
+            operation: '${operationId}',
+            payload,
+            channel: this.resolvedChannel
+        };
+        return this.transport.send(this.resolvedChannel, envelope, options);
+    }
+`;
+                                    } else {
+                                        const payloadType = messageTypes.length > 0 ? `Models.${messageTypes[0]}Payload` : 'any';
+                                        content += `
+    /**
+     * ${methodName} - Send operation (fire and forget)
+     * Original operation: ${operationId}
+     */
+    async ${methodName}(payload: ${payloadType}, options?: RequestOptions): Promise<void> {
+        const envelope: MessageEnvelope = {
+            operation: '${operationId}',
+            payload,
+            channel: this.resolvedChannel
+        };
+        await this.transport.send(this.resolvedChannel, envelope, options);
+    }
+`;
+
+                                        // Also generate a subscription method for notification-type operations
+                                        // (send operations without replies are typically notifications/events)
+                                        const subscribeMethodName = `on${methodName.charAt(0).toUpperCase() + methodName.slice(1)}`;
+                                        content += `
+    /**
+     * ${subscribeMethodName} - Subscribe to ${operationId} notifications
+     * Original operation: ${operationId}
+     * @param callback Function to call when a notification is received
+     * @returns Unsubscribe function to stop listening for notifications
+     */
+    ${subscribeMethodName}(callback: (payload: ${payloadType}) => void): () => void {
+        return this.transport.subscribe(this.resolvedChannel, '${operationId}', (envelope: MessageEnvelope) => {
+            // Filter by operation to ensure we only handle messages for this specific operation
+            if (envelope.operation === '${operationId}') {
+                callback(envelope.payload);
+            }
+        });
+    }
+`;
+                                    }
+                                } else if (action === 'receive') {
+                                    // Generate receive method (event listener setup) for dynamic channels
+                                    const payloadType = messageTypes.length > 0 ? `Models.${messageTypes[0]}Payload` : 'any';
+                                    content += `
+    /**
+     * ${methodName} - Receive operation
+     * Original operation: ${operationId}
+     * @param callback Function to call when a message is received
+     * @returns Unsubscribe function to stop listening for messages
+     */
+    ${methodName}(callback: (payload: ${payloadType}) => void): () => void {
+        return this.transport.subscribe(this.resolvedChannel, '${operationId}', (envelope: MessageEnvelope) => {
+            // Filter by operation to ensure we only handle messages for this specific operation
+            if (envelope.operation === '${operationId}') {
+                callback(envelope.payload);
+            }
+        });
+    }
+`;
+                                }
+                            }
+                        } catch (error) {
+                            // Skip operations that can't be processed
+                        }
+                    });
+                }
+            }
+
+            content += `
+}
+`;
+        });
+    }
 
+    content += `
 export default ${clientName};
 `;
 

package/template/src/models.ts.js

@@ -13,7 +13,7 @@ function generateModels(asyncapi) {
             .replace(/_+/g, '_')
             .replace(/^_+|_+$/g, '');
         if (/^[0-9]/.test(identifier)) {
-            identifier = 'Item' + identifier;
+            identifier = 'item_' + identifier;
         }
         if (!identifier) {
             identifier = 'unknown';
@@ -21,6 +21,7 @@ function generateModels(asyncapi) {
         return identifier;
     }
 
+
     function toTypeScriptTypeName(str) {
         if (!str) return 'Unknown';
         // Handle camelCase and PascalCase properly

package/template/src/runtime/transports/http.ts.js

@@ -195,10 +195,10 @@ export class HttpTransport implements Transport {
         }
     }
 
-    subscribe(channel: string, callback: (envelope: MessageEnvelope) => void): () => void {
+    subscribe(channel: string, operation: string, callback: (envelope: MessageEnvelope) => void): () => void {
         // HTTP transport doesn't support real-time subscriptions
         // This is a placeholder implementation that logs a warning
-        console.warn(\`HTTP transport does not support subscriptions. Channel '\${channel}' subscription ignored.\`);
+        console.warn(\`HTTP transport does not support subscriptions. Operation '\${operation}' on channel '\${channel}' subscription ignored.\`);
         console.warn('Consider using WebSocket transport for real-time message subscriptions.');
 
         // Return a no-op unsubscribe function

package/template/src/runtime/transports/websocket.ts.js

@@ -52,6 +52,7 @@ export class WebSocketTransport implements Transport {
     private responseHandlers: Map<string, ResponseHandler> = new Map();
     private subscriptions: Map<string, Set<EnvelopeCallback>> = new Map();
     private operationSubscriptions: Map<string, Set<(payload: any) => void>> = new Map();
+    private channelOperations: Map<string, string> = new Map(); // Track operation for each channel
     private reconnectAttempts = 0;
     private maxReconnectAttempts = 5;
     private reconnectDelay = 1000;
@@ -162,22 +163,44 @@ export class WebSocketTransport implements Transport {
         });
     }
 
-    subscribe(channel: string, callback: (envelope: MessageEnvelope) => void): () => void {
+    subscribe(channel: string, operation: string, callback: (envelope: MessageEnvelope) => void): () => void {
+        // When an operation is provided, use operation-based routing to extract the payload
+        if (operation) {
+            // Create a wrapper that extracts the payload from the envelope
+            const payloadCallback = (payload: any) => {
+                // Reconstruct the envelope for backward compatibility
+                const envelope: MessageEnvelope = {
+                    operation: operation,
+                    channel: channel,
+                    payload: payload,
+                    timestamp: new Date().toISOString()
+                };
+                callback(envelope);
+            };
+
+            // Use operation-based subscription which correctly extracts the payload
+            return this.subscribeToOperation(channel, operation, payloadCallback);
+        }
+
+        // Fallback to channel-based subscription for backward compatibility
         if (!this.subscriptions.has(channel)) {
             this.subscriptions.set(channel, new Set());
         }
 
         this.subscriptions.get(channel)!.add(callback);
 
+        // Track the operation for this channel for reconnection purposes
+        this.channelOperations.set(channel, operation);
+
         // Send subscription message to server using envelope format
         if (this.ws && this.ws.readyState === this.ws.OPEN) {
             // Generate auth headers if credentials are available
             const authHeaders = this.config.auth ? generateAuthHeaders(this.config.auth) : {};
 
             const subscribeEnvelope: MessageEnvelope = {
-                operation: 'subscribe',
+                operation: operation,  // ✅ Use the actual operation name
                 channel,
-                payload: { channel },
+                payload: { channel, operation },
                 timestamp: new Date().toISOString(),
                 headers: authHeaders
             };
@@ -200,11 +223,13 @@ export class WebSocketTransport implements Transport {
             channelSubscriptions.delete(callback);
             if (channelSubscriptions.size === 0) {
                 this.subscriptions.delete(channel);
+                this.channelOperations.delete(channel); // Clean up operation tracking
                 this.sendUnsubscribeMessage(channel);
             }
         } else {
             // Unsubscribe all callbacks for this channel
             this.subscriptions.delete(channel);
+            this.channelOperations.delete(channel); // Clean up operation tracking
             this.sendUnsubscribeMessage(channel);
         }
     }
@@ -222,11 +247,28 @@ export class WebSocketTransport implements Transport {
 
         this.operationSubscriptions.get(operationKey)!.add(callback);
 
-        // Subscribe to the channel if not already subscribed
+        // Subscribe to the channel if not already subscribed (use direct channel subscription to avoid circular call)
         if (!this.subscriptions.has(channel)) {
-            this.subscribe(channel, (envelope: MessageEnvelope) => {
-                this.handleOperationMessage(envelope);
-            });
+            // Direct channel subscription without going through the subscribe method
+            this.subscriptions.set(channel, new Set());
+
+            // Track the operation for this channel for reconnection purposes
+            this.channelOperations.set(channel, operation);
+
+            // Send subscription message to server using envelope format
+            if (this.ws && this.ws.readyState === this.ws.OPEN) {
+                // Generate auth headers if credentials are available
+                const authHeaders = this.config.auth ? generateAuthHeaders(this.config.auth) : {};
+
+                const subscribeEnvelope: MessageEnvelope = {
+                    operation: operation,
+                    channel,
+                    payload: { channel, operation },
+                    timestamp: new Date().toISOString(),
+                    headers: authHeaders
+                };
+                this.ws.send(JSON.stringify(subscribeEnvelope));
+            }
         }
 
         // Return unsubscribe function
@@ -275,21 +317,22 @@ export class WebSocketTransport implements Transport {
         try {
             const envelope: MessageEnvelope = JSON.parse(data);
 
-            // Handle response messages (with ID for request/response correlation)
-            if (envelope.id) {
-                const handler = this.responseHandlers.get(envelope.id);
-                if (handler) {
-                    this.responseHandlers.delete(envelope.id);
-                    if (envelope.error) {
-                        handler.reject(new TransportError(\`\${envelope.error.code}: \${envelope.error.message}\`));
-                    } else {
-                        handler.resolve(envelope.payload);
-                    }
+            // Check if this is actually a response to a pending request
+            const isResponse = envelope.id && this.responseHandlers.has(envelope.id);
+
+            if (isResponse) {
+                // Handle as response message
+                const handler = this.responseHandlers.get(envelope.id!)!;
+                this.responseHandlers.delete(envelope.id!);
+                if (envelope.error) {
+                    handler.reject(new TransportError(\`\${envelope.error.code}: \${envelope.error.message}\`));
+                } else {
+                    handler.resolve(envelope.payload);
                 }
                 return;
             }
 
-            // Handle subscription messages (broadcast messages without correlation ID)
+            // Handle as subscription message (even if it has an ID)
             if (envelope.channel) {
                 const channelSubscriptions = this.subscriptions.get(envelope.channel);
                 if (channelSubscriptions) {
@@ -326,13 +369,21 @@ export class WebSocketTransport implements Transport {
 
     private resubscribeAll(): void {
         if (this.ws && this.ws.readyState === this.ws.OPEN) {
+            // Generate auth headers if credentials are available
+            const authHeaders = this.config.auth ? generateAuthHeaders(this.config.auth) : {};
+
             for (const channel of this.subscriptions.keys()) {
-                const subscribeMessage = {
-                    type: 'subscribe',
-                    channel,
-                    timestamp: new Date().toISOString()
-                };
-                this.ws.send(JSON.stringify(subscribeMessage));
+                const operation = this.channelOperations.get(channel);
+                if (operation) {
+                    const subscribeEnvelope: MessageEnvelope = {
+                        operation: operation,
+                        channel,
+                        payload: { channel, operation },
+                        timestamp: new Date().toISOString(),
+                        headers: authHeaders
+                    };
+                    this.ws.send(JSON.stringify(subscribeEnvelope));
+                }
             }
         }
     }

package/template/src/runtime/types.ts.js

@@ -30,7 +30,7 @@ export interface Transport {
     connect(): Promise<void>;
     disconnect(): Promise<void>;
     send(channel: string, envelope: MessageEnvelope, options?: RequestOptions): Promise<any>;
-    subscribe(channel: string, callback: (envelope: MessageEnvelope) => void): () => void;
+    subscribe(channel: string, operation: string, callback: (envelope: MessageEnvelope) => void): () => void;
     unsubscribe(channel: string, callback?: (envelope: MessageEnvelope) => void): void;
 }