@hubspot/cli 4.2.1-beta.1 → 4.2.1-beta.2

package/bin/cli.js

@@ -115,7 +115,7 @@ const argv = yargs
   .option('debug', {
     alias: 'd',
     default: false,
-    describe: 'set log level to debug',
+    describe: 'Set log level to debug',
     type: 'boolean',
   })
   .option('noHyperlinks', {

package/commands/accounts/list.js

@@ -71,7 +71,7 @@ const getPortalData = mappedPortalData => {
 };
 
 exports.handler = async options => {
-  await loadAndValidateOptions(options);
+  await loadAndValidateOptions(options, false);
 
   const accountId = getAccountId(options);
 

package/commands/project/add.js

@@ -11,7 +11,7 @@ const { loadAndValidateOptions } = require('../../lib/validation');
 const i18nKey = 'cli.commands.project.subcommands.add';
 
 exports.command = 'add';
-exports.describe = null; //i18n(`${i18nKey}.describe`);
+exports.describe = i18n(`${i18nKey}.describe`);
 
 exports.handler = async options => {
   await loadAndValidateOptions(options);

package/commands/project/dev.js

@@ -5,7 +5,10 @@ const {
   addUseEnvironmentOptions,
   addTestingOptions,
 } = require('../../lib/commonOpts');
-const { trackCommandUsage } = require('../../lib/usageTracking');
+const {
+  trackCommandUsage,
+  trackCommandMetadataUsage,
+} = require('../../lib/usageTracking');
 const { loadAndValidateOptions } = require('../../lib/validation');
 const { i18n } = require('../../lib/lang');
 const { logger } = require('@hubspot/cli-lib/logger');
@@ -17,6 +20,7 @@ const {
   ensureProjectExists,
   handleProjectUpload,
   pollProjectBuildAndDeploy,
+  showPlatformVersionWarning,
 } = require('../../lib/projects');
 const { EXIT_CODES } = require('../../lib/enums/exitCodes');
 const { uiAccountDescription, uiBetaMessage, uiLine } = require('../../lib/ui');
@@ -60,7 +64,7 @@ const {
 const i18nKey = 'cli.commands.project.subcommands.dev';
 
 exports.command = 'dev [--account]';
-exports.describe = null; //i18n(`${i18nKey}.describe`);
+exports.describe = i18n(`${i18nKey}.describe`);
 
 exports.handler = async options => {
   await loadAndValidateOptions(options);
@@ -79,6 +83,8 @@ exports.handler = async options => {
     process.exit(EXIT_CODES.ERROR);
   }
 
+  await showPlatformVersionWarning(accountId, projectConfig);
+
   const accounts = getConfigAccounts();
   let targetAccountId = options.account ? accountId : null;
   let createNewSandbox = false;
@@ -129,6 +135,13 @@ exports.handler = async options => {
     }
     try {
       const { name } = await sandboxNamePrompt(DEVELOPER_SANDBOX);
+
+      trackCommandMetadataUsage(
+        'sandbox-create',
+        { step: 'project-dev' },
+        accountId
+      );
+
       const { result } = await buildSandbox({
         name,
         type: DEVELOPER_SANDBOX,
@@ -176,12 +189,13 @@ exports.handler = async options => {
     ? UPLOAD_PERMISSIONS.manual
     : UPLOAD_PERMISSIONS.always;
 
+  let deployedBuild;
+
   if (projectExists) {
-    const { sourceIntegration } = await fetchProject(
-      targetAccountId,
-      projectConfig.name
-    );
-    if (options.extension || sourceIntegration) {
+    const project = await fetchProject(targetAccountId, projectConfig.name);
+    deployedBuild = project.deployedBuild;
+
+    if (options.local || options.localAll || project.sourceIntegration) {
       uploadPermission = UPLOAD_PERMISSIONS.never;
     }
   }
@@ -285,7 +299,7 @@ exports.handler = async options => {
   // Do this before starting the dev server for v2 behavior because we cannot
   // run a server on a broken project
   if (
-    options.extension &&
+    (options.local || options.localAll) &&
     initialUploadResult &&
     !initialUploadResult.succeeded
   ) {
@@ -314,27 +328,30 @@ exports.handler = async options => {
 
   SpinniesManager.remove('devModeSetup');
 
-  const LocalDev = options.extension
-    ? new LocalDevManagerV2({
-        debug: options.debug,
-        extension: options.extension,
-        projectConfig,
-        projectDir,
-        targetAccountId,
-      })
-    : new LocalDevManager({
-        debug: options.debug,
-        projectConfig,
-        projectDir,
-        targetAccountId,
-        uploadPermission,
-      });
+  const LocalDev =
+    options.local || options.localAll
+      ? new LocalDevManagerV2({
+          alpha: options.localAll,
+          debug: options.debug,
+          deployedBuild,
+          projectConfig,
+          projectDir,
+          targetAccountId,
+        })
+      : new LocalDevManager({
+          debug: options.debug,
+          projectConfig,
+          projectDir,
+          targetAccountId,
+          uploadPermission,
+        });
 
   await LocalDev.start();
 
   // Let the user know when the initial build or deploy fails
   if (
-    !options.extension &&
+    !options.local &&
+    !options.localAll &&
     initialUploadResult &&
     !initialUploadResult.succeeded
   ) {
@@ -354,9 +371,15 @@ exports.builder = yargs => {
   addUseEnvironmentOptions(yargs, true);
   addTestingOptions(yargs, true);
 
-  yargs.option('extension', {
-    describe: i18n(`${i18nKey}.options.extension.describe`),
-    type: 'string',
+  yargs.option('local', {
+    describe: i18n(`${i18nKey}.options.local.describe`),
+    type: 'boolean',
+    hidden: true,
+  });
+
+  yargs.option('local-all', {
+    describe: i18n(`${i18nKey}.options.localAll.describe`),
+    type: 'boolean',
     hidden: true,
   });
 

package/commands/project/listBuilds.js

@@ -7,6 +7,7 @@ const {
   addUseEnvironmentOptions,
 } = require('../../lib/commonOpts');
 const { trackCommandUsage } = require('../../lib/usageTracking');
+const { i18n } = require('../../lib/lang');
 const {
   logApiErrorInstance,
   ApiErrorContext,
@@ -31,8 +32,10 @@ const {
 const moment = require('moment');
 const { promptUser } = require('../../lib/prompts/promptUtils');
 
+const i18nKey = 'cli.commands.project.subcommands.listBuilds';
+
 exports.command = 'list-builds [path]';
-exports.describe = false;
+exports.describe = i18n(`${i18nKey}.describe`);
 
 exports.handler = async options => {
   await loadAndValidateOptions(options);

package/commands/project/upload.js

@@ -16,6 +16,7 @@ const {
   logFeedbackMessage,
   validateProjectConfig,
   pollProjectBuildAndDeploy,
+  showPlatformVersionWarning,
 } = require('../../lib/projects');
 const { i18n } = require('../../lib/lang');
 const { getAccountConfig } = require('@hubspot/cli-lib');
@@ -48,6 +49,8 @@ exports.handler = async options => {
 
   validateProjectConfig(projectConfig, projectDir);
 
+  await showPlatformVersionWarning(accountId, projectConfig);
+
   await ensureProjectExists(accountId, projectConfig.name, { forceCreate });
 
   try {

package/commands/project/watch.js

@@ -21,6 +21,7 @@ const {
   pollDeployStatus,
   validateProjectConfig,
   logFeedbackMessage,
+  showPlatformVersionWarning,
 } = require('../../lib/projects');
 const {
   cancelStagedBuild,
@@ -97,6 +98,8 @@ exports.handler = async options => {
 
   validateProjectConfig(projectConfig, projectDir);
 
+  await showPlatformVersionWarning(accountId, projectConfig);
+
   await ensureProjectExists(accountId, projectConfig.name);
 
   try {

package/commands/project.js

@@ -1,4 +1,5 @@
 const { addConfigOptions, addAccountOptions } = require('../lib/commonOpts');
+const { i18n } = require('../lib/lang');
 const deploy = require('./project/deploy');
 const create = require('./project/create');
 const upload = require('./project/upload');
@@ -10,24 +11,26 @@ const open = require('./project/open');
 const dev = require('./project/dev');
 const add = require('./project/add');
 
+const i18nKey = 'cli.commands.project';
+
 exports.command = 'project';
-exports.describe = false; //'Commands for working with projects';
+exports.describe = i18n(`${i18nKey}.describe`);
 
 exports.builder = yargs => {
   addConfigOptions(yargs, true);
   addAccountOptions(yargs, true);
 
   // TODO: deploy must be updated
-  yargs.command(deploy).demandCommand(1, '');
   yargs.command(create).demandCommand(0, '');
-  yargs.command(upload).demandCommand(0, '');
+  yargs.command(add).demandCommand(0, '');
   yargs.command(watch).demandCommand(0, '');
-  yargs.command(listBuilds).demandCommand(0, '');
+  yargs.command(dev).demandCommand(0, '');
+  yargs.command(upload).demandCommand(0, '');
+  yargs.command(deploy).demandCommand(1, '');
   yargs.command(logs).demandCommand(1, '');
+  yargs.command(listBuilds).demandCommand(0, '');
   yargs.command(download).demandCommand(0, '');
   yargs.command(open).demandCommand(0, '');
-  yargs.command(dev).demandCommand(0, '');
-  yargs.command(add).demandCommand(0, '');
 
   return yargs;
 };

package/commands/sandbox/create.js

@@ -22,7 +22,10 @@ const {
 } = require('../../lib/sandboxes');
 const { getValidEnv } = require('@hubspot/cli-lib/lib/environment');
 const { logger } = require('@hubspot/cli-lib/logger');
-const { trackCommandUsage } = require('../../lib/usageTracking');
+const {
+  trackCommandUsage,
+  trackCommandMetadataUsage,
+} = require('../../lib/usageTracking');
 const {
   sandboxTypePrompt,
   sandboxNamePrompt,
@@ -153,6 +156,12 @@ exports.handler = async options => {
     // Prompt user to sync assets after sandbox creation
     const sandboxAccountConfig = getAccountConfig(result.sandbox.sandboxHubId);
     const handleSyncSandbox = async syncTasks => {
+      // Send tracking event for secondary action, in this case a sandbox sync within the sandbox create flow
+      trackCommandMetadataUsage(
+        'sandbox-sync',
+        { step: 'sandbox-create' },
+        result.sandbox.sandboxHubId
+      );
       await syncSandbox({
         accountConfig: sandboxAccountConfig,
         parentAccountConfig: accountConfig,

package/commands/sandbox/delete.js

@@ -168,19 +168,15 @@ exports.handler = async options => {
   } catch (err) {
     debugErrorAndContext(err);
 
-    if (err instanceof HubSpotAuthError) {
+    if (err instanceof HubSpotAuthError && err.statusCode === 401) {
       // Intercept invalid key error
       // This command uses the parent portal PAK to delete a sandbox, so we must specify which account needs a new key
-      const regex = /\bYour personal access key is invalid\b/;
-      const match = err.message.match(regex);
-      if (match && match[0]) {
-        logger.log('');
-        logger.error(
-          i18n(`${i18nKey}.failure.invalidKey`, {
-            account: getAccountName(parentAccount),
-          })
-        );
-      }
+      logger.log('');
+      logger.error(
+        i18n(`${i18nKey}.failure.invalidKey`, {
+          account: getAccountName(parentAccount),
+        })
+      );
     } else if (
       isSpecifiedError(err, {
         statusCode: 403,

package/lang/en.lyaml

@@ -444,9 +444,10 @@ en:
             describe: "Shortcut of the link you'd like to open"
         selectLink: "Select a link to open"
       project:
+        describe: "{{#bold}}[beta]{{/bold}} Commands for working with projects. For more information, visit our documentation: https://developers.hubspot.com/docs/platform/build-and-deploy-using-hubspot-projects"
         subcommands:
           dev:
-            describe: "Start local dev for the current project"
+            describe: "{{#bold}}[beta]{{/bold}} Start local dev for the current project"
             logs:
               betaMessage: "HubSpot projects local development"
               nonSandboxWarning: "Testing in a sandbox is strongly recommended. To switch the target account, select an option below or run {{#bold}}`hs accounts use`{{/bold}} before running the command again."
@@ -461,17 +462,18 @@ en:
               startupMessage: "Starting local dev server for {{#bold}}{{ projectName }}{{/bold}} ..."
             prompt:
               createProject: "Create new project {{ projectName}} in {{#bold}}[{{ accountIdentifier }}]{{/bold}}?"
-              targetNonSandbox: "Continue testing in a non-sandbox account?"
             options:
-              extension:
-                describe: "The extension that you would like to run locally"
+              local:
+                describe: "Run the alpha version of this command with some local dev server functionality"
+              localAll:
+                describe: "Run the alpha version of this command with all local dev server functionality"
             errors:
               noProjectConfig: "No project detected. Please run this command again from a project directory."
               projectLockedError: "Your project is locked. This may mean that another user is running the {{#bold}}`hs project dev`{{/bold}} command for this project. If this is you, unlock the project in Projects UI."
             examples:
               default: "Start local dev for the current project"
           create:
-            describe: "Create a new project"
+            describe: "{{#bold}}[beta]{{/bold}} Create a new project"
             logs:
               welcomeMessage: "Welcome to HubSpot Developer Projects!"
             examples:
@@ -486,7 +488,7 @@ en:
               templateSource:
                 describe: "Path to custom GitHub repository from which to create project template"
           add:
-            describe: "Create a new component within a project"
+            describe: "{{#bold}}[beta]{{/bold}} Create a new component within a project"
             options:
               name:
                 describe: "Component name"
@@ -501,7 +503,7 @@ en:
             examples:
               default: "Create a component within your project"
           deploy:
-            describe: "Deploy a project build"
+            describe: "{{#bold}}[beta]{{/bold}} Deploy a project build"
             debug:
               deploying: "Deploying project at path: {{ path }}"
             errors:
@@ -516,8 +518,10 @@ en:
                 describe: "Project build ID to be deployed"
               project:
                 describe: "Project name"
+          listBuilds:
+            describe: "{{#bold}}[beta]{{/bold}} List the project's builds"
           logs:
-            describe: "Get execution logs for a serverless function within a project"
+            describe: "{{#bold}}[beta]{{/bold}} Get execution logs for a serverless function within a project"
             errors:
               invalidAppName: "Could not find app with name \"{{ appName }}\" in project \"{{ projectName }}\""
             logs:
@@ -552,7 +556,7 @@ en:
               endpoint:
                 describe: "Public endpoint path"
           upload:
-            describe: "Upload your project files and create a new build"
+            describe: "{{#bold}}[beta]{{/bold}} Upload your project files and create a new build"
             examples:
               default: "Upload a project"
             logs:
@@ -570,7 +574,7 @@ en:
               path:
                 describe: "Path to a project folder"
           watch:
-            describe: "Watch your local project for changes and automatically upload changed files to a new build in HubSpot"
+            describe: "{{#bold}}[beta]{{/bold}} Watch your local project for changes and automatically upload changed files to a new build in HubSpot"
             examples:
               default: "Watch a project within the myProjectFolder folder"
             logs:
@@ -582,7 +586,7 @@ en:
               initialUpload:
                 describe: "Upload directory before watching for updates"
           download:
-            describe: "Download your project files from HubSpot and write to a path on your computer"
+            describe: "{{#bold}}[beta]{{/bold}} Download your project files from HubSpot and write to a path on your computer"
             examples:
               default: "Download the project myProject into myProjectFolder folder"
             logs:
@@ -599,7 +603,7 @@ en:
               dest:
                 describe: "Destination folder for the project"
           open:
-            describe: "Open available projects for the specified account"
+            describe: "{{#bold}}[beta]{{/bold}} Open the specified project's details page in the browser"
             options:
               project:
                 describe: "Name of project to open"
@@ -848,8 +852,12 @@ en:
     lib:
       DevServerManager:
         portConflict: "The port {{ port }} is already in use."
+        notInitialized: "The Dev Server Manager must be initialized before it is started."
+        noCompatibleComponents: "Skipping call to {{ serverKey }} because there are no compatible components in the project."
       LocalDevManagerV2:
         failedToInitialize: "Missing required arguments to initialize Local Dev"
+        noComponents: "There are no components in this project."
+        noRunnableComponents: "There are no components in this project that support local development."
         betaMessage: "HubSpot projects local development"
         running: "Running {{#bold}}{{ projectName }}{{/bold}} locally on {{ accountIdentifier }}, waiting for changes ..."
         quitHelper: "Press {{#bold}}'q'{{/bold}} to stop the local dev server"
@@ -857,8 +865,16 @@ en:
         exitingStart: "Stopping local dev server ..."
         exitingSucceed: "Successfully exited"
         exitingFail: "Failed to cleanup before exiting"
+        uploadWarning:
+          missingComponents: "Your deployed project does not contain the components {{#bold}}'{{ missingComponents }}'{{/bold}}. This may cause issues in local development."
+          header: "{{ reason }} To reflect these changes:"
+          stopDev: "  * Stop {{#bold}}`hs project dev`{{/bold}}"
+          runUpload: "  * Run {{#bold}}`hs project upload`{{/bold}}"
+          runUploadWithAccount: "  * Run {{#bold}}`hs project upload --account={{ accountId }}`{{/bold}}"
+          restartDev: "  * Re-run {{#bold}}`hs project dev`{{/bold}}"
         devServer:
           cleanupError: "Failed to cleanup local dev server: {{ message }}"
+          setupError: "Failed to setup local dev server: {{ message }}"
           startError: "Failed to start local dev server: {{ message }}"
       LocalDevManager:
         failedToInitialize: "Missing required arguments to initialize Local Dev Manager"
@@ -925,6 +941,9 @@ en:
         logFeedbackMessage:
           feedbackHeader: "We'd love to hear your feedback!"
           feedbackMessage: "How are you liking the new projects and developer tools? \n > Run `{{#yellow}}hs feedback{{/yellow}}` to let us know what you think!\n"
+        showPlatformVersionWarning:
+          noPlatformVersion: "No platformVersion found in hsproject.json. Falling back to version \"{{ defaultVersion }}\"."
+          noPlatformVersionAlt: "No platformVersion found in hsproject.json. Falling back to default version."
       ui:
         betaTag: "{{#bold}}[beta]{{/bold}}"
         betaWarning:

package/lib/DevServerManager.js

@@ -1,28 +1,39 @@
 const express = require('express');
 const bodyParser = require('body-parser');
 const cors = require('cors');
-const { walk } = require('@hubspot/cli-lib/lib/walk');
+const httpClient = require('@hubspot/cli-lib/http');
+const { logger } = require('@hubspot/cli-lib/logger');
 const { getProjectDetailUrl } = require('./projects');
+const { COMPONENT_TYPES } = require('./projectStructure');
 const { i18n } = require('./lang');
 const { EXIT_CODES } = require('./enums/exitCodes');
-const { logger } = require('@hubspot/cli-lib/logger');
+const { promptUser } = require('./prompts/promptUtils');
 
 const i18nKey = 'cli.lib.DevServerManager';
 
 const DEFAULT_PORT = 8080;
+const SERVER_KEYS = {
+  app: 'app',
+};
 
 class DevServerManager {
   constructor() {
     this.initialized = false;
+    this.started = false;
+    this.componentsByType = {};
     this.server = null;
     this.path = null;
     this.devServers = {};
+    this.debug = false;
   }
 
   safeLoadServer() {
     try {
       const { DevModeInterface } = require('@hubspot/ui-extensions-dev-server');
-      this.devServers['uie'] = DevModeInterface;
+      this.devServers[SERVER_KEYS.app] = {
+        componentType: COMPONENT_TYPES.app,
+        serverInterface: DevModeInterface,
+      };
     } catch (e) {
       logger.debug('Failed to load dev server interface: ', e);
     }
@@ -33,8 +44,16 @@ class DevServerManager {
 
     for (let i = 0; i < serverKeys.length; i++) {
       const serverKey = serverKeys[i];
-      const serverInterface = this.devServers[serverKey];
-      await callback(serverInterface, serverKey);
+      const devServer = this.devServers[serverKey];
+
+      const compatibleComponents =
+        this.componentsByType[devServer.componentType] || {};
+
+      if (Object.keys(compatibleComponents).length) {
+        await callback(devServer.serverInterface, compatibleComponents);
+      } else {
+        logger.debug(i18n(`${i18nKey}.noCompatibleComponents`, { serverKey }));
+      }
     }
   }
 
@@ -42,66 +61,98 @@ class DevServerManager {
     return this.path ? `${this.path}/${path}` : null;
   }
 
-  async start({
-    accountId,
-    debug,
-    extension,
-    projectConfig,
-    projectSourceDir,
-  }) {
-    const app = express();
-
-    // Install Middleware
-    app.use(bodyParser.json({ limit: '50mb' }));
-    app.use(bodyParser.urlencoded({ limit: '50mb', extended: true }));
-    app.use(cors());
-
-    // Configure
-    app.set('trust proxy', true);
-
-    // Initialize a base route
-    app.get('/', (req, res) => {
-      res.send('HubSpot local dev server');
-    });
-
-    // Initialize URL redirects
-    app.get('/hs/project', (req, res) => {
-      res.redirect(getProjectDetailUrl(projectConfig.name, accountId));
-    });
-
-    // Start server
-    this.server = await app.listen(DEFAULT_PORT).on('error', err => {
-      if (err.code === 'EADDRINUSE') {
-        logger.error(i18n(`${i18nKey}.portConflict`, { port: DEFAULT_PORT }));
-        logger.log();
-        process.exit(EXIT_CODES.ERROR);
+  arrangeComponentsByType(components) {
+    return components.reduce((acc, component) => {
+      if (!acc[component.type]) {
+        acc[component.type] = {};
       }
-    });
-
-    const projectFiles = await walk(projectSourceDir);
-
-    // Initialize component servers
-    await this.iterateDevServers(async serverInterface => {
-      if (serverInterface.start) {
-        await serverInterface.start({
-          accountId,
-          debug,
-          extension,
-          projectConfig,
-          projectFiles,
-        });
-      }
-    });
 
-    this.path = this.server.address()
-      ? `http://localhost:${this.server.address().port}`
-      : null;
+      acc[component.type][component.config.name] = component;
+
+      return acc;
+    }, {});
+  }
+
+  async setup({ alpha, components, debug, onUploadRequired }) {
+    this.debug = debug;
+
+    this.componentsByType = this.arrangeComponentsByType(components);
+
+    this.safeLoadServer();
+
+    await this.iterateDevServers(
+      async (serverInterface, compatibleComponents) => {
+        if (serverInterface.setup) {
+          await serverInterface.setup({
+            alpha,
+            components: compatibleComponents,
+            debug,
+            onUploadRequired,
+            promptUser,
+          });
+        }
+      }
+    );
 
     this.initialized = true;
   }
 
-  async cleanup() {
+  async start({ alpha, accountId, projectConfig }) {
     if (this.initialized) {
+      const app = express();
+
+      // Install Middleware
+      app.use(bodyParser.json({ limit: '50mb' }));
+      app.use(bodyParser.urlencoded({ limit: '50mb', extended: true }));
+      app.use(cors());
+
+      // Configure
+      app.set('trust proxy', true);
+
+      // Initialize a base route
+      app.get('/', (req, res) => {
+        res.send('HubSpot local dev server');
+      });
+
+      // Initialize URL redirects
+      app.get('/hs/project', (req, res) => {
+        res.redirect(getProjectDetailUrl(projectConfig.name, accountId));
+      });
+
+      // Start server
+      this.server = await app.listen(DEFAULT_PORT).on('error', err => {
+        if (err.code === 'EADDRINUSE') {
+          logger.error(i18n(`${i18nKey}.portConflict`, { port: DEFAULT_PORT }));
+          logger.log();
+          process.exit(EXIT_CODES.ERROR);
+        }
+      });
+
+      // Initialize component servers
+      await this.iterateDevServers(async serverInterface => {
+        if (serverInterface.start) {
+          await serverInterface.start({
+            alpha,
+            accountId,
+            debug: this.debug,
+            httpClient,
+            projectConfig,
+          });
+        }
+      });
+
+      this.path = this.server.address()
+        ? `http://localhost:${this.server.address().port}`
+        : null;
+    } else {
+      throw new Error(i18n(`${i18nKey}.notInitialized`));
+    }
+
+    this.started = true;
+  }
+
+  async cleanup() {
+    if (this.started) {
       await this.iterateDevServers(async serverInterface => {
         if (serverInterface.cleanup) {
           await serverInterface.cleanup();

package/lib/LocalDevManager.js

@@ -303,7 +303,8 @@ class LocalDevManager {
     try {
       const { buildId } = await provisionBuild(
         this.targetAccountId,
-        this.projectConfig.name
+        this.projectConfig.name,
+        this.projectConfig.platformVersion
       );
       this.currentStagedBuildId = buildId;
     } catch (err) {
@@ -536,7 +537,11 @@ class LocalDevManager {
     let queueBuildError;
 
     try {
-      await queueBuild(this.targetAccountId, this.projectConfig.name);
+      await queueBuild(
+        this.targetAccountId,
+        this.projectConfig.name,
+        this.projectConfig.platformVersion
+      );
     } catch (err) {
       queueBuildError = err;
     }
@@ -663,6 +668,9 @@ class LocalDevManager {
 
   async devServerStart() {
     try {
+      // Set this to true manually for now
+      DevServerManager.initialized = true;
+
       await DevServerManager.start({
         accountId: this.targetAccountId,
         debug: this.debug,

package/lib/LocalDevManagerV2.js

@@ -3,11 +3,26 @@ const chalk = require('chalk');
 const { i18n } = require('./lang');
 const { logger } = require('@hubspot/cli-lib/logger');
 const { handleKeypress } = require('@hubspot/cli-lib/lib/process');
+const {
+  getAccountId,
+  getConfigDefaultAccount,
+} = require('@hubspot/cli-lib/lib/config');
 const SpinniesManager = require('./SpinniesManager');
 const DevServerManager = require('./DevServerManager');
 const { EXIT_CODES } = require('./enums/exitCodes');
 const { getProjectDetailUrl } = require('./projects');
-const { uiAccountDescription, uiBetaMessage, uiLink, uiLine } = require('./ui');
+const {
+  COMPONENT_TYPES,
+  findProjectComponents,
+  getAppCardConfigs,
+} = require('./projectStructure');
+const {
+  UI_COLORS,
+  uiAccountDescription,
+  uiBetaMessage,
+  uiLink,
+  uiLine,
+} = require('./ui');
 
 const i18nKey = 'cli.lib.LocalDevManagerV2';
 
@@ -16,8 +31,9 @@ class LocalDevManagerV2 {
     this.targetAccountId = options.targetAccountId;
     this.projectConfig = options.projectConfig;
     this.projectDir = options.projectDir;
-    this.extension = options.extension;
     this.debug = options.debug || false;
+    this.alpha = options.alpha;
+    this.deployedBuild = options.deployedBuild;
 
     this.projectSourceDir = path.join(
       this.projectDir,
@@ -31,14 +47,38 @@ class LocalDevManagerV2 {
   }
 
   async start() {
-    console.clear();
     SpinniesManager.removeAll();
     SpinniesManager.init();
 
+    const components = await findProjectComponents(this.projectSourceDir);
+
+    if (!components.length) {
+      logger.log();
+      logger.error(i18n(`${i18nKey}.noComponents`));
+      process.exit(EXIT_CODES.SUCCESS);
+    }
+
+    const runnableComponents = components.filter(
+      component => component.runnable
+    );
+
+    if (!runnableComponents.length) {
+      logger.log();
+      logger.error(i18n(`${i18nKey}.noRunnableComponents`));
+      process.exit(EXIT_CODES.SUCCESS);
+    }
+
+    logger.log();
+    const setupSucceeded = await this.devServerSetup(runnableComponents);
+
+    if (setupSucceeded || !this.debug) {
+      console.clear();
+    }
+
     uiBetaMessage(i18n(`${i18nKey}.betaMessage`));
     logger.log();
     logger.log(
-      chalk.hex('#FF8F59')(
+      chalk.hex(UI_COLORS.orange)(
         i18n(`${i18nKey}.running`, {
           accountIdentifier: uiAccountDescription(this.targetAccountId),
           projectName: this.projectConfig.name,
@@ -59,6 +99,8 @@ class LocalDevManagerV2 {
     await this.devServerStart();
 
     this.updateKeypressListeners();
+
+    this.compareLocalProjectToDeployed(runnableComponents);
   }
 
   async stop() {
@@ -89,15 +131,83 @@ class LocalDevManagerV2 {
     });
   }
 
+  logUploadWarning(reason) {
+    const currentDefaultAccount = getConfigDefaultAccount();
+    const defaultAccountId = getAccountId(currentDefaultAccount);
+
+    logger.log();
+    logger.warn(i18n(`${i18nKey}.uploadWarning.header`, { reason }));
+    logger.log(i18n(`${i18nKey}.uploadWarning.stopDev`));
+    if (this.targetAccountId !== defaultAccountId) {
+      logger.log(
+        i18n(`${i18nKey}.uploadWarning.runUploadWithAccount`, {
+          accountId: this.targetAccountId,
+        })
+      );
+    } else {
+      logger.log(i18n(`${i18nKey}.uploadWarning.runUpload`));
+    }
+    logger.log(i18n(`${i18nKey}.uploadWarning.restartDev`));
+  }
+
+  compareLocalProjectToDeployed(runnableComponents) {
+    const deployedComponentNames = this.deployedBuild.subbuildStatuses.map(
+      subbuildStatus => subbuildStatus.buildName
+    );
+
+    let missingComponents = [];
+
+    runnableComponents.forEach(({ type, config, path }) => {
+      if (type === COMPONENT_TYPES.app) {
+        const cardConfigs = getAppCardConfigs(config, path);
+
+        cardConfigs.forEach(cardConfig => {
+          if (
+            cardConfig.data &&
+            cardConfig.data.title &&
+            !deployedComponentNames.includes(cardConfig.data.title)
+          ) {
+            missingComponents.push(cardConfig.data.title);
+          }
+        });
+      }
+    });
+
+    if (missingComponents.length) {
+      this.logUploadWarning(
+        i18n(`${i18nKey}.uploadWarning.missingComponents`, {
+          missingComponents: missingComponents.join(','),
+        })
+      );
+    }
+  }
+
+  async devServerSetup(components) {
+    try {
+      await DevServerManager.setup({
+        alpha: this.alpha,
+        components,
+        debug: this.debug,
+        onUploadRequired: this.logUploadWarning.bind(this),
+      });
+      return true;
+    } catch (e) {
+      if (this.debug) {
+        logger.error(e);
+      }
+      logger.error(
+        i18n(`${i18nKey}.devServer.setupError`, { message: e.message })
+      );
+      return false;
+    }
+  }
+
   async devServerStart() {
     try {
-      DevServerManager.safeLoadServer();
       await DevServerManager.start({
+        alpha: this.alpha,
         accountId: this.targetAccountId,
-        debug: this.debug,
-        extension: this.extension,
         projectConfig: this.projectConfig,
-        projectSourceDir: this.projectSourceDir,
       });
     } catch (e) {
       if (this.debug) {

package/lib/projectStructure.js

@@ -0,0 +1,106 @@
+const fs = require('fs');
+const path = require('path');
+const { walk } = require('@hubspot/cli-lib/lib/walk');
+const { logger } = require('@hubspot/cli-lib/logger');
+
+const COMPONENT_TYPES = Object.freeze({
+  app: 'app',
+});
+
+const APP_COMPONENT_CONFIG = 'app.json';
+
+function loadConfigFile(configPath) {
+  if (configPath) {
+    try {
+      const source = fs.readFileSync(configPath);
+      const parsedConfig = JSON.parse(source);
+      return parsedConfig;
+    } catch (e) {
+      logger.debug(e);
+    }
+  }
+  return null;
+}
+
+function getAppCardConfigs(appConfig, appPath) {
+  let cardConfigs = [];
+  let cards;
+
+  if (appConfig && appConfig.extensions && appConfig.extensions.crm) {
+    cards = appConfig.extensions.crm.cards;
+  }
+
+  if (cards) {
+    cards.forEach(({ file }) => {
+      const cardConfigPath = path.join(appPath, file);
+      const cardConfig = loadConfigFile(cardConfigPath);
+
+      if (cardConfig) {
+        cardConfigs.push(cardConfig);
+      }
+    });
+  }
+
+  return cardConfigs;
+}
+
+function getIsLegacyApp(appConfig, appPath) {
+  const cardConfigs = getAppCardConfigs(appConfig, appPath);
+
+  if (!cardConfigs.length) {
+    // Assume any app that does not have any cards is not legacy
+    return false;
+  }
+
+  let hasAnyReactExtensions = false;
+
+  cardConfigs.forEach(cardConfig => {
+    if (!hasAnyReactExtensions) {
+      const isReactExtension =
+        cardConfig &&
+        !!cardConfig.data &&
+        !!cardConfig.data.module &&
+        !!cardConfig.data.module.file;
+
+      hasAnyReactExtensions = isReactExtension;
+    }
+  });
+
+  return !hasAnyReactExtensions;
+}
+
+async function findProjectComponents(projectSourceDir) {
+  const components = [];
+
+  const projectFiles = await walk(projectSourceDir);
+
+  projectFiles.forEach(projectFile => {
+    // Find app components
+    if (projectFile.endsWith(APP_COMPONENT_CONFIG)) {
+      const parsedAppConfig = loadConfigFile(projectFile);
+
+      if (parsedAppConfig && parsedAppConfig.name) {
+        const appPath = projectFile.substring(
+          0,
+          projectFile.indexOf(APP_COMPONENT_CONFIG)
+        );
+        const isLegacy = getIsLegacyApp(parsedAppConfig, appPath);
+
+        components.push({
+          type: COMPONENT_TYPES.app,
+          config: parsedAppConfig,
+          runnable: !isLegacy,
+          path: appPath,
+        });
+      }
+    }
+  });
+
+  return components;
+}
+
+module.exports = {
+  COMPONENT_TYPES,
+  findProjectComponents,
+  getAppCardConfigs,
+};

package/lib/projects.js

@@ -17,6 +17,9 @@ const {
   PROJECT_TASK_TYPES,
   SPINNER_STATUS,
 } = require('@hubspot/cli-lib/lib/constants');
+const {
+  fetchDefaultVersion,
+} = require('@hubspot/cli-lib/lib/projectPlatformVersion');
 const {
   createProject,
   getBuildStatus,
@@ -312,7 +315,8 @@ const uploadProjectFiles = async (
   accountId,
   projectName,
   filePath,
-  uploadMessage
+  uploadMessage,
+  platformVersion
 ) => {
   SpinniesManager.init({});
   const accountIdentifier = uiAccountDescription(accountId);
@@ -333,7 +337,8 @@ const uploadProjectFiles = async (
       accountId,
       projectName,
       filePath,
-      uploadMessage
+      uploadMessage,
+      platformVersion
     );
 
     buildId = upload.buildId;
@@ -490,7 +495,8 @@ const handleProjectUpload = async (
         accountId,
         projectConfig.name,
         tempFile.name,
-        uploadMessage
+        uploadMessage,
+        projectConfig.platformVersion
       );
 
       if (error) {
@@ -807,6 +813,28 @@ const createProjectComponent = async (component, name) => {
   );
 };
 
+const showPlatformVersionWarning = async (accountId, projectConfig) => {
+  const platformVersion = projectConfig.platformVersion;
+
+  if (!platformVersion) {
+    try {
+      const defaultVersion = await fetchDefaultVersion(accountId);
+      logger.log('');
+      logger.warn(
+        i18n(`${i18nKey}.showPlatformVersionWarning.noPlatformVersion`, {
+          defaultVersion,
+        })
+      );
+    } catch (e) {
+      logger.log('');
+      logger.warn(
+        i18n(`${i18nKey}.showPlatformVersionWarning.noPlatformVersionAlt`)
+      );
+      logger.debug(e.error);
+    }
+  }
+};
+
 module.exports = {
   writeProjectConfig,
   getProjectConfig,
@@ -823,4 +851,5 @@ module.exports = {
   ensureProjectExists,
   logFeedbackMessage,
   createProjectComponent,
+  showPlatformVersionWarning,
 };

package/lib/ui.js

@@ -6,6 +6,10 @@ const { getAccountConfig } = require('@hubspot/cli-lib/lib/config');
 const { i18n } = require('./lang');
 const { logger } = require('@hubspot/cli-lib/logger');
 
+const UI_COLORS = {
+  orange: '#FF8F59',
+};
+
 /**
  * Outputs horizontal line
  *
@@ -108,7 +112,7 @@ const uiFeatureHighlight = (commands, title) => {
 const uiBetaMessage = message => {
   const i18nKey = 'cli.lib.ui';
 
-  logger.log(chalk.hex('#bda9ea')(i18n(`${i18nKey}.betaTag`)), message);
+  logger.log(chalk.hex(UI_COLORS.orange)(i18n(`${i18nKey}.betaTag`)), message);
 };
 
 const uiBetaWarning = logMessage => {
@@ -120,6 +124,7 @@ const uiBetaWarning = logMessage => {
 };
 
 module.exports = {
+  UI_COLORS,
   uiAccountDescription,
   uiBetaMessage,
   uiBetaWarning,

package/lib/usageTracking.js

@@ -7,6 +7,25 @@ const { version } = require('../package.json');
 const { getPlatform } = require('./environment');
 const { setLogLevel } = require('./commonOpts');
 
+/* **
+Available tracking meta properties
+
+  - action: "The specific action taken in the CLI"
+  - os: "The user's OS"
+  - nodeVersion: "The user's version of node.js"
+  - nodeMajorVersion: "The user's major version of node.js"
+  - version: "The user's version of the CLI"
+  - command: "The specific command that the user ran in this interaction"
+  - authType: "The configured auth type the user has for the CLI"
+  - step: "The specific step in the auth process"
+  - assetType: "The CMS asset type"
+  - mode: "The CLI mode (draft or publish"
+  - type: "The upload type (file or folder)"
+  - file: "Whether or not the 'file' flag was used"
+  - successful: "Whether or not the CLI interaction was successful"
+
+*/
+
 const EventClass = {
   USAGE: 'USAGE',
   INTERACTION: 'INTERACTION',
@@ -132,10 +151,48 @@ const trackAuthAction = async (command, authType, step, accountId) => {
   }
 };
 
+function trackCommandMetadataUsage(command, meta = {}, accountId) {
+  if (!isTrackingAllowed()) {
+    return;
+  }
+  logger.debug('Attempting to track metadata usage of "%s" command', command);
+  let authType = 'unknown';
+  if (accountId) {
+    const accountConfig = getAccountConfig(accountId);
+    authType =
+      accountConfig && accountConfig.authType
+        ? accountConfig.authType
+        : API_KEY_AUTH_METHOD.value;
+  }
+  setImmediate(async () => {
+    const usageTrackingEvent = {
+      action: 'cli-command-metadata',
+      os: getPlatform(),
+      ...getNodeVersionData(),
+      version,
+      command,
+      authType,
+      ...meta,
+    };
+    try {
+      await trackUsage(
+        'cli-interaction',
+        EventClass.INTERACTION,
+        usageTrackingEvent,
+        accountId
+      );
+      logger.debug('Sent usage tracking command event: %o', usageTrackingEvent);
+    } catch (e) {
+      logger.debug('Metadata usage tracking failed: %s', e.message);
+    }
+  });
+}
+
 module.exports = {
   trackCommandUsage,
   trackHelpUsage,
   addHelpUsageTracking,
   trackConvertFieldsUsage,
   trackAuthAction,
+  trackCommandMetadataUsage,
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/cli",
-  "version": "4.2.1-beta.1",
+  "version": "4.2.1-beta.2",
   "description": "CLI for working with HubSpot",
   "license": "Apache-2.0",
   "repository": {
@@ -8,9 +8,9 @@
     "url": "https://github.com/HubSpot/hubspot-cms-tools"
   },
   "dependencies": {
-    "@hubspot/cli-lib": "^4.1.14",
-    "@hubspot/serverless-dev-runtime": "4.1.8-beta.6",
-    "@hubspot/ui-extensions-dev-server": "^0.4.0",
+    "@hubspot/cli-lib": "^4.2.1",
+    "@hubspot/serverless-dev-runtime": "4.2.1-beta.2",
+    "@hubspot/ui-extensions-dev-server": "^0.5.0",
     "archiver": "^5.3.0",
     "body-parser": "^1.19.0",
     "chalk": "^4.1.2",
@@ -45,5 +45,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a79d4a4d6c61971986a7df3aaa8374cbe2405a0b"
+  "gitHead": "9a111f2df1b19153efe867f3501599bfa4aedabe"
 }