@hubspot/ui-extensions-dev-server 0.8.3 → 0.8.6

package/dist/lib/DevModeInterface.d.ts

@@ -1,6 +1,7 @@
 import type { ExtensionConfig, PlatformVersion, ProjectComponentMap } from './types';
 import type { ServiceConfiguration } from '@hubspot/app-functions-dev-server/dist/types';
 import { PromptModule } from 'inquirer';
+import { DevServerState } from './DevServerState';
 interface SetupArguments {
     components: ProjectComponentMap;
     debug?: boolean;
@@ -17,6 +18,12 @@ interface StartArguments {
     accountId?: number;
     debug?: boolean;
     httpClient?: ServiceConfiguration['httpClient'];
+    requestPorts?: (requestPortsData: Array<{
+        instanceId: string;
+        port?: number;
+    }>) => Promise<{
+        [instanceId: string]: number;
+    }>;
     projectConfig?: ProjectConfig;
 }
 interface AppExtensionMapping {
@@ -24,18 +31,15 @@ interface AppExtensionMapping {
     value: ExtensionConfig;
 }
 declare class DevModeInterface {
-    config?: ExtensionConfig;
-    appName?: string;
-    title?: string;
-    extensionConfigPath?: string;
+    configs?: ExtensionConfig[];
+    devServerState?: DevServerState;
     onUploadRequired?: VoidFunction;
     shutdown?: () => Promise<void>;
-    _setDataFromExtensionConfig(extensionConfig: ExtensionConfig): void;
     _generateAppExtensionMappings(components: ProjectComponentMap): AppExtensionMapping[];
     _getPlatformVersion(projectConfig?: ProjectConfig): PlatformVersion;
     setup({ components, debug, extensionConfig, onUploadRequired, promptUser, }: SetupArguments): Promise<void>;
     fileChange(filePath: string, __event: unknown): Promise<void>;
-    start({ accountId, debug, httpClient, projectConfig }: StartArguments): Promise<void>;
+    start({ requestPorts, accountId, debug, httpClient, projectConfig, }: StartArguments): Promise<void>;
     cleanup(): Promise<void>;
 }
 declare const _default: DevModeInterface;

package/dist/lib/DevModeInterface.js

@@ -10,24 +10,16 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 const dev_1 = require("./dev");
-const path_1 = __importDefault(require("path"));
 const constants_1 = require("./constants");
+const constants_2 = require("./constants");
 const config_1 = require("./config");
 // @ts-expect-error no type defs
 const logger_1 = require("@hubspot/cli-lib/logger");
+const DevServerState_1 = require("./DevServerState");
 const utils_1 = require("./utils");
 class DevModeInterface {
-    _setDataFromExtensionConfig(extensionConfig) {
-        this.config = extensionConfig;
-        this.extensionConfigPath = extensionConfig.extensionConfigPath;
-        this.appName = extensionConfig.data.appName;
-        this.title = extensionConfig.data.title;
-    }
     _generateAppExtensionMappings(components) {
         // Loop over all of the app configs that are passed in
         const allComponentNames = Object.keys(components);
@@ -54,13 +46,13 @@ class DevModeInterface {
     _getPlatformVersion(projectConfig) {
         const { platformVersion } = projectConfig !== null && projectConfig !== void 0 ? projectConfig : {};
         if (!platformVersion) {
-            return constants_1.PLATFORM_VERSION.V20231;
+            return constants_2.PLATFORM_VERSION.V20231;
         }
         switch (platformVersion) {
-            case constants_1.PLATFORM_VERSION.V20231:
-                return constants_1.PLATFORM_VERSION.V20231;
-            case constants_1.PLATFORM_VERSION.V20232:
-                return constants_1.PLATFORM_VERSION.V20232;
+            case constants_2.PLATFORM_VERSION.V20231:
+                return constants_2.PLATFORM_VERSION.V20231;
+            case constants_2.PLATFORM_VERSION.V20232:
+                return constants_2.PLATFORM_VERSION.V20232;
             default:
                 return (0, utils_1.throwUnhandledPlatformVersionError)(platformVersion);
         }
@@ -70,7 +62,7 @@ class DevModeInterface {
             (0, logger_1.setLogLevel)(debug ? logger_1.LOG_LEVEL.DEBUG : logger_1.LOG_LEVEL.LOG);
             this.onUploadRequired = onUploadRequired;
             if (extensionConfig) {
-                this._setDataFromExtensionConfig(extensionConfig);
+                this.configs = [extensionConfig];
                 return;
             }
             const choices = this._generateAppExtensionMappings(components);
@@ -78,16 +70,26 @@ class DevModeInterface {
                 throw new Error('No extensions to run');
             }
             else if (choices.length === 1) {
-                this._setDataFromExtensionConfig(choices[0].value);
+                this.configs = [choices[0].value];
             }
             else {
                 const answers = yield promptUser({
-                    type: 'list',
-                    name: 'extension',
-                    message: 'Which extension would you like to run?',
+                    type: 'checkbox',
+                    name: 'extensions',
+                    message: 'Which extension(s) would you like to run?',
+                    validate: (input) => {
+                        if (!input || input.length === 0) {
+                            return 'Select at least one extension to run';
+                        }
+                        const appNames = new Set(input.map(choice => choice.data.appName));
+                        if (appNames.size > 1) {
+                            return 'Running multiple extensions is only supported for a single application';
+                        }
+                        return true;
+                    },
                     choices,
                 });
-                this._setDataFromExtensionConfig(answers.extension);
+                this.configs = answers.extensions;
             }
         });
     }
@@ -95,36 +97,48 @@ class DevModeInterface {
     // eslint-disable-next-line require-await
     fileChange(filePath, __event) {
         return __awaiter(this, void 0, void 0, function* () {
-            if (this.extensionConfigPath &&
-                this.extensionConfigPath === filePath &&
-                this.onUploadRequired) {
+            if (!this.devServerState || !this.devServerState.extensionsMetadata) {
+                return;
+            }
+            const relevantConfigFileChanged = this.devServerState.extensionsMetadata.some(metadata => metadata.config.extensionConfigPath === filePath);
+            if (relevantConfigFileChanged && this.onUploadRequired) {
                 this.onUploadRequired();
             }
         });
     }
-    start({ accountId, debug, httpClient, projectConfig }) {
+    start({ requestPorts, accountId, debug, httpClient, projectConfig, }) {
         return __awaiter(this, void 0, void 0, function* () {
             if (debug !== undefined) {
                 (0, logger_1.setLogLevel)(debug ? logger_1.LOG_LEVEL.DEBUG : logger_1.LOG_LEVEL.LOG);
             }
-            if (!this.config || !this.config.path) {
-                throw new Error('Unable to load the required extension configuration files');
+            let expressPort = constants_1.EXPRESS_DEFAULT_PORT;
+            let webSocketPort = constants_1.WEBSOCKET_DEFAULT_PORT;
+            if (requestPorts) {
+                try {
+                    const portData = yield requestPorts([
+                        { instanceId: constants_1.EXPRESS_SERVER_ID, port: constants_1.EXPRESS_DEFAULT_PORT },
+                        { instanceId: constants_1.VITE_DEV_SERVER_ID, port: constants_1.WEBSOCKET_DEFAULT_PORT },
+                    ]);
+                    expressPort = portData[constants_1.EXPRESS_SERVER_ID];
+                    webSocketPort = portData[constants_1.VITE_DEV_SERVER_ID];
+                }
+                catch (e) {
+                    logger_1.logger.debug('Call to port manager failed, using default ports');
+                }
             }
-            const appPath = this.config.path;
-            // Pass options from the CLI for running app functions locally
-            const functionsConfig = {
-                app: { path: appPath },
+            this.devServerState = new DevServerState_1.DevServerState({
+                extensionConfigs: this.configs,
                 accountId,
                 httpClient,
                 platformVersion: this._getPlatformVersion(projectConfig),
-            };
-            this.shutdown = yield (0, dev_1.startDevMode)({
-                extensionConfig: this.config,
-                outputDir: path_1.default.join(this.config.extensionPath, constants_1.OUTPUT_DIR),
-                functionsConfig,
-                root: appPath,
+                expressPort,
+                webSocketPort,
+            });
+            this.shutdown = yield (0, dev_1.startDevMode)(this.devServerState);
+            this.devServerState.extensionsMetadata.forEach(metadata => {
+                const { config: { data: { title, appName }, }, } = metadata;
+                logger_1.logger.info(`Running extension '${title}' from app '${appName}'`);
             });
-            logger_1.logger.info(`Running extension '${this.title}' from app '${this.appName}'`);
         });
     }
     cleanup() {

package/dist/lib/DevServerState.d.ts

@@ -0,0 +1,28 @@
+import { ExtensionConfig, ExtensionMetadata, PlatformVersion } from './types';
+import { ServiceConfiguration } from '@hubspot/app-functions-dev-server/dist/types';
+interface DevServerStateArgs {
+    extensionConfigs?: ExtensionConfig[];
+    accountId: number | undefined;
+    httpClient: ServiceConfiguration['httpClient'] | undefined;
+    expressPort: number;
+    webSocketPort: number;
+    platformVersion: PlatformVersion;
+}
+export declare class DevServerState {
+    private _webSocketPort;
+    private _expressPort;
+    private _functionsConfig;
+    private _outputDir;
+    private _appPath;
+    private _extensionsMetadata;
+    private _portalId?;
+    constructor({ extensionConfigs, accountId, httpClient, expressPort, webSocketPort, platformVersion, }: DevServerStateArgs);
+    get portalId(): number | undefined;
+    get webSocketPort(): number;
+    get expressPort(): number;
+    get extensionsMetadata(): ExtensionMetadata[];
+    get functionsConfig(): Partial<ServiceConfiguration>;
+    get outputDir(): string;
+    get appPath(): string;
+}
+export {};

package/dist/lib/DevServerState.js

@@ -0,0 +1,65 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DevServerState = void 0;
+const constants_1 = require("./constants");
+const path_1 = __importDefault(require("path"));
+class DevServerState {
+    constructor({ extensionConfigs, accountId, httpClient, expressPort, webSocketPort, platformVersion, }) {
+        if (!extensionConfigs) {
+            throw new Error('Unable to load the required extension configuration files');
+        }
+        const extensionsMetadata = [];
+        extensionConfigs.forEach(config => {
+            const { appName, title, sourceId } = config.data;
+            extensionsMetadata.push({
+                config,
+                baseMessage: {
+                    appName,
+                    title,
+                    sourceId,
+                    callback: `http://hslocal.net:${expressPort}/${config.output}`,
+                    portalId: accountId,
+                },
+            });
+        });
+        this._webSocketPort = webSocketPort;
+        this._expressPort = expressPort;
+        this._extensionsMetadata = extensionsMetadata;
+        this._appPath = extensionConfigs[0].path;
+        this._portalId = accountId;
+        this._outputDir = path_1.default.join(this._appPath, constants_1.OUTPUT_DIR);
+        // Pass options from the CLI for running app functions locally
+        this._functionsConfig = {
+            app: { path: this._appPath },
+            accountId,
+            httpClient,
+            platformVersion,
+        };
+        Object.freeze(this);
+    }
+    get portalId() {
+        return this._portalId;
+    }
+    get webSocketPort() {
+        return this._webSocketPort;
+    }
+    get expressPort() {
+        return this._expressPort;
+    }
+    get extensionsMetadata() {
+        return this._extensionsMetadata;
+    }
+    get functionsConfig() {
+        return this._functionsConfig;
+    }
+    get outputDir() {
+        return this._outputDir;
+    }
+    get appPath() {
+        return this._appPath;
+    }
+}
+exports.DevServerState = DevServerState;

package/dist/lib/constants.d.ts

@@ -1,8 +1,10 @@
 export declare const OUTPUT_DIR = "dist";
 export declare const MAIN_APP_CONFIG = "app.json";
 export declare const MANIFEST_FILE = "manifest.json";
-export declare const VITE_DEFAULT_PORT = 5173;
-export declare const WEBSOCKET_PORT = 5174;
+export declare const EXPRESS_SERVER_ID = "ui-extensions-dev-server";
+export declare const VITE_DEV_SERVER_ID = "ui-extensions-vite-dev-server";
+export declare const EXPRESS_DEFAULT_PORT = 5173;
+export declare const WEBSOCKET_DEFAULT_PORT = 5174;
 export declare const ROLLUP_OPTIONS: {
     external: string[];
     output: {

package/dist/lib/constants.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PLATFORM_VERSION = exports.SERVER_CAPABILITIES = exports.WEBSOCKET_MESSAGE_VERSION = exports.EXTENSIONS_MESSAGE_VERSION = exports.ROLLUP_OPTIONS = exports.WEBSOCKET_PORT = exports.VITE_DEFAULT_PORT = exports.MANIFEST_FILE = exports.MAIN_APP_CONFIG = exports.OUTPUT_DIR = void 0;
+exports.PLATFORM_VERSION = exports.SERVER_CAPABILITIES = exports.WEBSOCKET_MESSAGE_VERSION = exports.EXTENSIONS_MESSAGE_VERSION = exports.ROLLUP_OPTIONS = exports.WEBSOCKET_DEFAULT_PORT = exports.EXPRESS_DEFAULT_PORT = exports.VITE_DEV_SERVER_ID = exports.EXPRESS_SERVER_ID = exports.MANIFEST_FILE = exports.MAIN_APP_CONFIG = exports.OUTPUT_DIR = void 0;
 exports.OUTPUT_DIR = 'dist';
 exports.MAIN_APP_CONFIG = 'app.json';
 exports.MANIFEST_FILE = 'manifest.json';
-exports.VITE_DEFAULT_PORT = 5173;
-exports.WEBSOCKET_PORT = 5174;
+exports.EXPRESS_SERVER_ID = 'ui-extensions-dev-server';
+exports.VITE_DEV_SERVER_ID = 'ui-extensions-vite-dev-server';
+exports.EXPRESS_DEFAULT_PORT = 5173;
+exports.WEBSOCKET_DEFAULT_PORT = 5174;
 exports.ROLLUP_OPTIONS = {
     // Deps to exclude from the bundle
     external: ['react', 'react-dom', '@remote-ui/react'],

package/dist/lib/dev.d.ts

@@ -1,12 +1,2 @@
-import { ExtensionConfig } from './types';
-import { ServiceConfiguration } from '@hubspot/app-functions-dev-server/dist/types';
-interface StartDevModeArgs {
-    outputDir?: string;
-    extensionConfig: ExtensionConfig;
-    webSocketPort?: number;
-    expressPort?: number;
-    root?: string;
-    functionsConfig: Partial<ServiceConfiguration>;
-}
-export declare function startDevMode({ extensionConfig, functionsConfig, outputDir, expressPort, webSocketPort, root, }: StartDevModeArgs): Promise<() => Promise<void>>;
-export {};
+import { DevServerState } from './DevServerState';
+export declare function startDevMode(devServerState: DevServerState): Promise<() => Promise<void>>;

package/dist/lib/dev.js

@@ -17,26 +17,23 @@ const vite_1 = require("vite");
 const path_1 = __importDefault(require("path"));
 const server_1 = __importDefault(require("./server"));
 const devBuildPlugin_1 = __importDefault(require("./plugins/devBuildPlugin"));
-const constants_1 = require("./constants");
-// @ts-expect-error no type defs
-const logger_1 = require("@hubspot/cli-lib/logger");
 // @ts-expect-error no type defs
 const detect_port_1 = __importDefault(require("detect-port"));
-function _createViteDevServer({ outputDir, extensionConfig, webSocketPort, baseMessage, root, }) {
+function _createViteDevServer(devServerState) {
     return __awaiter(this, void 0, void 0, function* () {
         return yield (0, vite_1.createServer)({
-            root,
+            root: devServerState.appPath,
             logLevel: 'silent',
             appType: 'custom',
             mode: 'development',
             server: {
                 middlewareMode: true,
                 hmr: {
-                    port: webSocketPort,
+                    port: devServerState.webSocketPort,
                 },
                 watch: {
                     ignored: [
-                        path_1.default.join(outputDir, '/**/*'),
+                        path_1.default.join(devServerState.outputDir, '/**/*'),
                         '**/src/app/app.functions/**/*',
                         '**/app.json',
                         '**/package.json',
@@ -46,9 +43,7 @@ function _createViteDevServer({ outputDir, extensionConfig, webSocketPort, baseM
             },
             plugins: [
                 (0, devBuildPlugin_1.default)({
-                    extensionConfig,
-                    outputDir,
-                    baseMessage,
+                    devServerState,
                 }),
             ],
             clearScreen: false,
@@ -64,38 +59,16 @@ function throwIfPortTaken(port) {
         }
     });
 }
-function startDevMode({ extensionConfig, functionsConfig, outputDir = constants_1.OUTPUT_DIR, expressPort = constants_1.VITE_DEFAULT_PORT, webSocketPort = constants_1.WEBSOCKET_PORT, root = process.cwd(), }) {
+function startDevMode(devServerState) {
     return __awaiter(this, void 0, void 0, function* () {
-        if (!extensionConfig) {
+        if (!devServerState || !devServerState.extensionsMetadata) {
             throw new Error('Unable to determine which extension to run');
         }
-        yield throwIfPortTaken(expressPort);
-        const actualWebSocketPort = yield (0, detect_port_1.default)(webSocketPort);
-        if (actualWebSocketPort !== webSocketPort) {
-            logger_1.logger.debug(`WebSocket port ${webSocketPort} is in use; using next available port ${actualWebSocketPort}`);
-        }
-        const { appName, title, sourceId } = extensionConfig.data;
-        const baseMessage = Object.freeze({
-            appName,
-            title,
-            sourceId,
-            callback: `http://hslocal.net:${expressPort}/${extensionConfig.output}`,
-            portalId: functionsConfig.accountId,
-        });
-        const viteDevServer = yield _createViteDevServer({
-            outputDir,
-            extensionConfig,
-            webSocketPort: actualWebSocketPort,
-            baseMessage,
-            root,
-        });
+        yield throwIfPortTaken(devServerState.webSocketPort);
+        const viteDevServer = yield _createViteDevServer(devServerState);
         const shutdownServer = yield (0, server_1.default)({
-            outputDir,
-            expressPort,
-            webSocketPort: actualWebSocketPort,
-            baseMessage,
+            devServerState,
             viteDevServer,
-            functionsConfig,
         });
         return shutdownServer;
     });

package/dist/lib/extensionsService.d.ts

@@ -1,12 +1,12 @@
-import { BaseMessage } from './types';
 import { Response } from 'express/lib/response';
 import { Request } from 'express/lib/request';
 import { Application } from 'express/lib/application';
+import { DevServerState } from './DevServerState';
 declare class ExtensionsService {
     endpoint: string;
     constructor();
-    add(server: Application, webSocketPort: number, outputDir: string, baseMessage: BaseMessage, capabilities: string[]): string[];
-    generateExtensionsHandler(baseMessage: BaseMessage, webSocketPort: number, outputDir: string, capabilities?: string[]): (_req: Request, res: Response) => void;
+    add(server: Application, devServerState: DevServerState, capabilities: string[]): string[];
+    generateExtensionsHandler(devServerState: DevServerState, capabilities?: string[]): (_req: Request, res: Response) => void;
 }
 declare const _default: ExtensionsService;
 export default _default;

package/dist/lib/extensionsService.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+/* eslint-disable hubspot-dev/no-unsupported-ts-syntax */
 const path_1 = __importDefault(require("path"));
 const constants_1 = require("./constants");
 const utils_1 = require("./utils");
@@ -10,22 +11,24 @@ class ExtensionsService {
     constructor() {
         this.endpoint = '/extensions';
     }
-    add(server, webSocketPort, outputDir, baseMessage, capabilities) {
-        server.get(this.endpoint, this.generateExtensionsHandler(baseMessage, webSocketPort, outputDir, capabilities));
+    add(server, devServerState, capabilities) {
+        server.get(this.endpoint, this.generateExtensionsHandler(devServerState, capabilities));
         return [this.endpoint];
     }
-    generateExtensionsHandler(baseMessage, webSocketPort, outputDir, capabilities = []) {
+    generateExtensionsHandler(devServerState, capabilities = []) {
         return function extensionsHandler(_req, res) {
             try {
-                const output = path_1.default.parse(baseMessage.callback).name;
+                const extensions = devServerState.extensionsMetadata.map(metadata => {
+                    const { baseMessage } = metadata;
+                    const output = path_1.default.parse(baseMessage.callback).name;
+                    return Object.assign(Object.assign({}, baseMessage), { manifest: (0, utils_1.loadManifest)(devServerState.outputDir, output) });
+                });
                 const response = {
-                    websocket: `ws://localhost:${webSocketPort}`,
+                    websocket: `ws://localhost:${devServerState.webSocketPort}`,
                     version: constants_1.EXTENSIONS_MESSAGE_VERSION,
                     capabilities,
-                    portalId: baseMessage.portalId,
-                    extensions: [
-                        Object.assign(Object.assign({}, baseMessage), { manifest: (0, utils_1.loadManifest)(outputDir, output) }),
-                    ],
+                    portalId: devServerState.portalId,
+                    extensions,
                 };
                 res.status(200).json(response);
             }

package/dist/lib/plugins/codeCheckingPlugin.js

@@ -14,7 +14,8 @@ const codeCheckingPlugin = options => {
         writeBundle(__options, __bundle) {
             try {
                 const code = fs_1.default.readFileSync(output).toString();
-                if (!code.includes('const extend = (...args) => self.extend(...args);')) {
+                if (!code.includes('const extend = (...args) => self.extend(...args);') &&
+                    !code.includes('self.extend_V2(renderExtensionCallback)')) {
                     logger_1.logger.warn('Unable to determine if your extension entry point is calling hubspot.extend, this may prevent it from rendering as expected');
                 }
             }

package/dist/lib/plugins/devBuildPlugin.d.ts

@@ -1,9 +1,7 @@
 import Vite from 'vite';
-import { ExtensionConfig, BaseMessage } from '../types';
+import { DevServerState } from '../DevServerState';
 export interface DevBuildPluginOptions {
-    extensionConfig: ExtensionConfig;
-    outputDir: string;
-    baseMessage: BaseMessage;
+    devServerState: DevServerState;
 }
 export type DevBuildPlugin = (options: DevBuildPluginOptions) => Vite.Plugin;
 declare const devBuildPlugin: DevBuildPlugin;

package/dist/lib/plugins/devBuildPlugin.js

@@ -47,16 +47,18 @@ const path_1 = __importDefault(require("path"));
 const logger_1 = require("@hubspot/cli-lib/logger");
 const friendlyLoggingPlugin_1 = __importDefault(require("./friendlyLoggingPlugin"));
 const relevantModulesPlugin_1 = __importStar(require("./relevantModulesPlugin"));
+function addVersionToBaseMessage(baseMessage) {
+    return Object.assign(Object.assign({}, baseMessage), { version: constants_1.WEBSOCKET_MESSAGE_VERSION });
+}
 const devBuildPlugin = options => {
-    let lastBuildError;
-    const { extensionConfig, outputDir, baseMessage } = options;
-    const versionedBaseMessage = Object.assign(Object.assign({}, baseMessage), { version: constants_1.WEBSOCKET_MESSAGE_VERSION });
+    const { devServerState } = options;
+    let lastBuildErrorContext;
     const handleBuildError = (error, server) => {
-        const { plugin, errors, frame, loc, id } = error;
+        const { error: { plugin, errors, frame, loc, id }, extensionMetadata, } = error;
         // Filter out our custom plugins, but send everything else
         if (!(plugin === null || plugin === void 0 ? void 0 : plugin.startsWith('ui-extensions'))) {
             // @ts-expect-error Our websocket messages don't match Vite format
-            server.ws.send(Object.assign(Object.assign({}, versionedBaseMessage), { event: 'error', error: {
+            server.ws.send(Object.assign(Object.assign({}, addVersionToBaseMessage(extensionMetadata.baseMessage)), { event: 'error', error: {
                     details: {
                         errors,
                         formattedError: (0, utils_1.stripAnsiColorCodes)(frame),
@@ -66,8 +68,9 @@ const devBuildPlugin = options => {
                 } }));
         }
     };
-    const devBuild = (server) => __awaiter(void 0, void 0, void 0, function* () {
+    const devBuild = (server, extensionMetadata, emptyOutDir = false) => __awaiter(void 0, void 0, void 0, function* () {
         try {
+            const { config: extensionConfig } = extensionMetadata;
             yield (0, vite_1.build)({
                 logLevel: 'warn',
                 mode: 'development',
@@ -95,24 +98,27 @@ const devBuildPlugin = options => {
                                 extensionPath: extensionConfig.extensionPath,
                             }),
                             (0, codeCheckingPlugin_1.default)({
-                                output: path_1.default.join(outputDir, extensionConfig.output),
+                                output: path_1.default.join(devServerState.outputDir, extensionConfig.output),
                             }),
                             (0, friendlyLoggingPlugin_1.default)(),
                             (0, relevantModulesPlugin_1.default)({ output: extensionConfig.output }),
                         ], output: Object.assign(Object.assign({}, constants_1.ROLLUP_OPTIONS.output), { sourcemap: 'inline' }) }),
-                    outDir: outputDir,
-                    emptyOutDir: true,
+                    outDir: devServerState.outputDir,
+                    emptyOutDir,
                     minify: false,
                 },
                 clearScreen: false,
             });
-            lastBuildError = null;
+            lastBuildErrorContext = null;
             return true;
         }
         catch (error) {
-            lastBuildError = error;
+            lastBuildErrorContext = {
+                error: error,
+                extensionMetadata,
+            };
             logger_1.logger.debug(error);
-            handleBuildError(lastBuildError, server);
+            handleBuildError(lastBuildErrorContext, server);
             return false;
         }
     });
@@ -126,41 +132,52 @@ const devBuildPlugin = options => {
             localServer = server;
             localServer.ws.on('connection', () => {
                 logger_1.logger.info('Browser connected and listening for bundle updates');
-                // @ts-expect-error Our websocket messages don't match Vite format
-                localServer.ws.send(Object.assign(Object.assign({}, versionedBaseMessage), { event: 'start' }));
-                if (lastBuildError) {
-                    handleBuildError(lastBuildError, server);
+                devServerState.extensionsMetadata.forEach(metadata => {
+                    // @ts-expect-error Our websocket messages don't match Vite format
+                    localServer.ws.send(Object.assign(Object.assign({}, addVersionToBaseMessage(metadata.baseMessage)), { event: 'start' }));
+                });
+                if (lastBuildErrorContext) {
+                    handleBuildError(lastBuildErrorContext, server);
                 }
             });
-            yield devBuild(localServer);
+            for (let i = 0; i < devServerState.extensionsMetadata.length; ++i) {
+                yield devBuild(localServer, devServerState.extensionsMetadata[i], i === 0);
+            }
         }),
         handleHotUpdate: ({ file, server }) => __awaiter(void 0, void 0, void 0, function* () {
             // If the file is not in the relevantModules list, it's update is inconsequential
-            if (!(0, relevantModulesPlugin_1.getRelevantModules)(extensionConfig.output).includes(file)) {
-                return [];
-            }
-            const successful = yield devBuild(server);
-            if (!successful) {
-                return [];
-            }
-            logger_1.logger.info(`Extension ${extensionConfig.data.title} updated, compiled`);
-            if (server.ws.clients.size === 0) {
-                logger_1.logger.debug('Bundle updated, no browsers connected to notify');
-                return [];
+            const extensionsToRebuild = devServerState.extensionsMetadata.filter(metadata => {
+                const { config } = metadata;
+                return (0, relevantModulesPlugin_1.getRelevantModules)(config.output).includes(file);
+            });
+            for (let i = 0; i < extensionsToRebuild.length; ++i) {
+                const toRebuild = extensionsToRebuild[i];
+                const successful = yield devBuild(server, toRebuild);
+                if (!successful) {
+                    return [];
+                }
+                const { config: extensionConfig } = toRebuild;
+                logger_1.logger.info(`Extension ${extensionConfig.data.title} updated, compiled`);
+                if (server.ws.clients.size === 0) {
+                    logger_1.logger.debug('Bundle updated, no browsers connected to notify');
+                    return [];
+                }
+                logger_1.logger.debug('Bundle updated, notifying connected browsers');
+                // @ts-expect-error Our websocket messages don't match Vite format
+                server.ws.send(Object.assign(Object.assign({}, addVersionToBaseMessage(toRebuild.baseMessage)), { event: 'update' }));
             }
-            logger_1.logger.debug('Bundle updated, notifying connected browsers');
-            // @ts-expect-error Our websocket messages don't match Vite format
-            server.ws.send(Object.assign(Object.assign({}, versionedBaseMessage), { event: 'update' }));
             return [];
         }),
         buildEnd(error) {
             if (error) {
                 logger_1.logger.error(error);
             }
-            logger_1.logger.debug('Sending shutdown message to connected browsers');
             if (localServer && localServer.ws) {
-                // @ts-expect-error Our websocket messages don't match Vite format
-                localServer.ws.send(Object.assign(Object.assign({}, versionedBaseMessage), { event: 'shutdown' }));
+                logger_1.logger.debug('Sending shutdown message to connected browsers');
+                devServerState.extensionsMetadata.forEach(metadata => {
+                    // @ts-expect-error Our websocket messages don't match Vite format
+                    localServer.ws.send(Object.assign(Object.assign({}, addVersionToBaseMessage(metadata.baseMessage)), { event: 'shutdown' }));
+                });
             }
         },
     };

package/dist/lib/server.d.ts

@@ -1,13 +1,8 @@
-import { BaseMessage } from './types';
 import { ViteDevServer } from 'vite';
-import { ServiceConfiguration } from '@hubspot/app-functions-dev-server/dist/types';
+import { DevServerState } from './DevServerState';
 interface StartDevServerArgs {
-    outputDir: string;
-    expressPort: number;
-    webSocketPort: number;
-    baseMessage: BaseMessage;
+    devServerState: DevServerState;
     viteDevServer: ViteDevServer;
-    functionsConfig: Partial<ServiceConfiguration>;
 }
-declare function startDevServer({ outputDir, expressPort, webSocketPort, baseMessage, viteDevServer, functionsConfig, }: StartDevServerArgs): Promise<() => Promise<void>>;
+declare function startDevServer({ devServerState, viteDevServer, }: StartDevServerArgs): Promise<() => Promise<void>>;
 export default startDevServer;

package/dist/lib/server.js

@@ -1,4 +1,6 @@
 "use strict";
+/* eslint-disable hubspot-dev/no-unsupported-ts-syntax */
+/* eslint-disable no-unused-expressions */
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -30,15 +32,17 @@ function listen(app, port) {
         });
     });
 }
-function startDevServer({ outputDir, expressPort, webSocketPort, baseMessage, viteDevServer, functionsConfig, }) {
+function startDevServer({ devServerState, viteDevServer, }) {
+    var _a;
     return __awaiter(this, void 0, void 0, function* () {
         const app = (0, express_1.default)();
         // Setup middleware
         app.use((0, cors_1.default)());
-        app.use(express_1.default.static(outputDir));
-        app.use('/api/crm-extensibility/execution/internal/v3', (0, app_functions_dev_server_1.AppFunctionExecutionService)(Object.assign(Object.assign({}, functionsConfig), { logger: logger_1.logger })));
-        logger_1.logger.info(`Serving app functions locally (platform version ${functionsConfig.platformVersion})`);
-        const endpointsAdded = extensionsService_1.default.add(app, webSocketPort, outputDir, baseMessage, constants_1.SERVER_CAPABILITIES);
+        app.use(express_1.default.static(devServerState.outputDir));
+        app.use('/api/crm-extensibility/execution/internal/v3', (0, app_functions_dev_server_1.AppFunctionExecutionService)(Object.assign(Object.assign({}, devServerState.functionsConfig), { logger: logger_1.logger })));
+        logger_1.logger.info(`Serving app functions locally (platform version ${devServerState.functionsConfig.platformVersion})`);
+        const endpointsAdded = extensionsService_1.default.add(app, devServerState, constants_1.SERVER_CAPABILITIES);
+        const { expressPort } = devServerState;
         endpointsAdded.forEach(endpoint => {
             logger_1.logger.debug(`Listening at http://hslocal.net:${expressPort}${endpoint}`);
         });
@@ -46,15 +50,18 @@ function startDevServer({ outputDir, expressPort, webSocketPort, baseMessage, vi
         app.use(viteDevServer.middlewares);
         let server;
         try {
-            server = yield listen(app, expressPort);
+            server = yield listen(app, devServerState.expressPort);
         }
         catch (e) {
             if (e.code === 'EADDRINUSE') {
-                throw new Error(`Port ${expressPort} is already in use.`);
+                throw new Error(`Port ${devServerState.expressPort} is already in use.`);
             }
             throw new Error(e);
         }
-        logger_1.logger.debug(`Listening at ${baseMessage.callback}`);
+        (_a = devServerState.extensionsMetadata) === null || _a === void 0 ? void 0 : _a.forEach(metadata => {
+            const { baseMessage } = metadata;
+            logger_1.logger.debug(`Listening at ${baseMessage.callback}`);
+        });
         return function shutdown() {
             return __awaiter(this, void 0, void 0, function* () {
                 yield viteDevServer.pluginContainer.close();

package/dist/lib/types.d.ts

@@ -52,5 +52,9 @@ export interface BaseMessage {
     sourceId?: string | null;
     portalId?: number;
 }
+export interface ExtensionMetadata {
+    baseMessage: BaseMessage;
+    config: ExtensionConfig;
+}
 export type PlatformVersion = typeof PLATFORM_VERSION[keyof typeof PLATFORM_VERSION];
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/ui-extensions-dev-server",
-  "version": "0.8.3",
+  "version": "0.8.6",
   "description": "",
   "scripts": {
     "test": "jest",
@@ -63,5 +63,5 @@
       "optional": true
     }
   },
-  "gitHead": "ab25629916c542f19bf8cde83a10ad8bd225078f"
+  "gitHead": "621bee406c8dfa9ca133f1d76f4bde725a2b9f43"
 }