feat: local development multi-site support (#120)

Author: nrkruk

package.json

@@ -5,7 +5,7 @@
   "author": "Salesforce",
   "bugs": "https://github.com/forcedotcom/cli/issues",
   "dependencies": {
-    "@lwrjs/api": "0.13.3",
+    "@lwrjs/api": "0.13.6",
     "@lwc/lwc-dev-server": "^9.4.0",
     "@lwc/sfdc-lwc-compiler": "^9.4.0",
     "@oclif/core": "^4.0.17",
@@ -15,8 +15,8 @@
     "@salesforce/sf-plugins-core": "^11.2.4",
     "@inquirer/select": "^2.4.3",
     "chalk": "^5.3.0",
-    "lwc": "7.2.0",
-    "lwr": "0.13.3",
+    "lwc": "7.2.1",
+    "lwr": "0.13.6",
     "node-fetch": "^3.3.2",
     "tar": "^7.4.3"
   },
@@ -92,7 +92,6 @@
     "prepack": "sf-prepack",
     "prepare": "sf-install",
     "test": "wireit",
-    "test:compile": "wireit",
     "test:nuts": "nyc mocha \"**/*.nut.ts\" --slow 4500 --timeout 600000 --parallel",
     "test:only": "wireit",
     "unlink-lwr": "yarn unlink @lwrjs/api @lwrjs/app-service @lwrjs/asset-registry @lwrjs/asset-transformer @lwrjs/auth-middleware @lwrjs/base-view-provider @lwrjs/base-view-transformer @lwrjs/client-modules @lwrjs/config @lwrjs/core @lwrjs/dev-proxy-server @lwrjs/diagnostics @lwrjs/esbuild @lwrjs/everywhere @lwrjs/fs-asset-provider @lwrjs/fs-watch @lwrjs/html-view-provider @lwrjs/instrumentation @lwrjs/label-module-provider @lwrjs/lambda @lwrjs/legacy-npm-module-provider @lwrjs/loader @lwrjs/lwc-module-provider @lwrjs/lwc-ssr @lwrjs/markdown-view-provider @lwrjs/module-bundler @lwrjs/module-registry @lwrjs/npm-module-provider @lwrjs/nunjucks-view-provider @lwrjs/o11y @lwrjs/resource-registry @lwrjs/router @lwrjs/security @lwrjs/server @lwrjs/shared-utils @lwrjs/static @lwrjs/tools @lwrjs/types @lwrjs/view-registry lwr",

schemas/lightning-dev-site.json

@@ -4,13 +4,14 @@
  * Licensed under the BSD 3-Clause license.
  * For full license text, see LICENSE.txt file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
-import fs from 'node:fs';
-import path from 'node:path';
+// import fs from 'node:fs';
+// import path from 'node:path';
 import { SfCommand, Flags } from '@salesforce/sf-plugins-core';
-import { Messages, SfError } from '@salesforce/core';
-import { expDev, setupDev } from '@lwrjs/api';
+import { Messages } from '@salesforce/core';
+import { expDev } from '@lwrjs/api';
 import { PromptUtils } from '../../../shared/prompt.js';
-import { OrgUtils } from '../../../shared/orgUtils.js';
+// import { OrgUtils } from '../../../shared/orgUtils.js';
+import { ExperienceSite } from '../../../shared/experience/expSite.js';
 
 Messages.importMessagesDirectoryFromMetaUrl(import.meta.url);
 const messages = Messages.loadMessages('@salesforce/plugin-lightning-dev', 'lightning.dev.site');
@@ -19,7 +20,7 @@ export type LightningDevSiteResult = {
   path: string;
 };
 
-export default class LightningDevSite extends SfCommand<LightningDevSiteResult> {
+export default class LightningDevSite extends SfCommand<void> {
   public static readonly summary = messages.getMessage('summary');
   public static readonly description = messages.getMessage('description');
   public static readonly examples = messages.getMessages('examples');
@@ -36,85 +37,54 @@ export default class LightningDevSite extends SfCommand<LightningDevSiteResult>
     'target-org': Flags.optionalOrg({ summary: messages.getMessage('flags.target-org.summary') }),
   };
 
-  public async run(): Promise<LightningDevSiteResult> {
+  public async run(): Promise<void> {
     const { flags } = await this.parse(LightningDevSite);
-    // Connect to Org
-    const connection = flags['target-org'].getConnection();
 
-    // If we don't have a site to use, promp the user for one
-    let siteName = flags.name;
-    if (!siteName) {
-      this.log('No site name was specified, pick one');
-      // Query for the list of possible sites
-      const siteList = await OrgUtils.retrieveSites(connection);
-      siteName = await PromptUtils.promptUserToSelectSite(siteList);
-    }
-    this.log(`Setting up local development for: ${siteName}`);
+    // TODO short circuit all this if user specifies a site name and it exists locally
 
-    siteName = siteName.trim().replace(' ', '_');
-    const siteDir = path.join('__local_dev__', siteName);
-    if (!fs.existsSync(path.join(siteDir, 'ssr.js'))) {
-      // Ensure local dev dir is created
-      fs.mkdirSync('__local_dev__');
-      // 3. Check if the site has been published
-      const result = await connection.query<{ Id: string; Name: string; LastModifiedDate: string }>(
-        "SELECT Id, Name, LastModifiedDate FROM StaticResource WHERE Name LIKE 'MRT%" + siteName + "'"
-      );
+    try {
+      // 1. Connect to Org
+      const org = flags['target-org'];
+      let siteName = flags.name;
 
-      let resourceName;
-      // Pick the site you want if there is more than one
-      if (result?.totalSize > 1) {
-        const chooseFromList = result.records.map((record) => record.Name);
-        resourceName = await PromptUtils.promptUserToSelectSite(chooseFromList);
-      } else if (result?.totalSize === 1) {
-        resourceName = result.records[0].Name;
-      } else {
-        throw new SfError(
-          `Couldnt find your site: ${siteName}. Please navigate to the builder and publish your site with the Local Development preference enabled in your org.`
-        );
+      // 2. If we don't have a site to use, prompt the user for one
+      if (!siteName) {
+        this.log('No site was specified');
+        // Allow user to pick a site
+        const siteList = await ExperienceSite.getAllExpSites(org.getConnection());
+        siteName = await PromptUtils.promptUserToSelectSite(siteList);
       }
 
-      // Download the static resource
-      this.log('Downloading Site...');
-      const staticresource = await connection.metadata.read('StaticResource', resourceName);
-      const resourcePath = path.join('__local_dev__', `${resourceName}.gz`);
-      if (staticresource?.content) {
-        // Save the static resource
-        const buffer = Buffer.from(staticresource.content, 'base64');
-        this.log(`Writing file to path: ${resourcePath}`);
-        fs.writeFileSync(resourcePath, buffer);
+      // 3. Setup local dev directory structure: '.localdev/${site}'
+      this.log(`Setting up Local Development for: ${siteName}`);
+      const selectedSite = new ExperienceSite(org, siteName);
+      let siteZip;
+      if (!selectedSite.isSiteSetup()) {
+        // TODO Verify the bundle has been published and download
+        this.log('Downloading Site...');
+        siteZip = await selectedSite.downloadSite();
       } else {
-        throw new SfError(`Error occured downloading your site: ${siteName}`);
+        // If we do have the site setup already, don't do anything / TODO prompt the user if they want to get latest?
+        // Check if the site has been published
+        // const result = await connection.query<{ Id: string; Name: string; LastModifiedDate: string }>(
+        //   "SELECT Id, Name, LastModifiedDate FROM StaticResource WHERE Name LIKE 'MRT%" + siteName + "'"
+        // );
+        // this.log('Setup already complete!');
       }
 
-      const domains = await OrgUtils.getDomains(connection);
-      const domain = await PromptUtils.promptUserToSelectDomain(domains);
-      const urlPrefix = await OrgUtils.getSitePathPrefix(connection, siteName);
-      const fullProxyUrl = `https://${domain}${urlPrefix}`;
-
-      // Setup Local Dev
-      await setupDev({ mrtBundle: resourcePath, mrtDir: siteDir, proxyUrl: fullProxyUrl, npmInstall: false });
-      this.log('Setup Complete!');
-    } else {
-      // If we do have the site setup already, don't do anything / TODO prompt the user if they want to get latest?
+      // 6. Start the dev server
+      this.log('Starting local development server...');
+      await expDev({
+        open: false,
+        port: 3000,
+        logLevel: 'error',
+        mode: 'dev',
+        siteZip,
+        siteDir: selectedSite.getSiteDirectory(),
+      });
+    } catch (e) {
+      // this.error(e);
+      this.log('Local Development setup failed', e);
     }
-
-    // 6. Start the dev server
-    this.log('Starting local development server...');
-    // TODO add additional args
-    // eslint-disable-next-line unicorn/numeric-separators-style
-    await expDev({
-      open: false,
-      port: 3000,
-      timeout: 30000,
-      sandbox: false,
-      logLevel: 'error',
-      mrtBundleRoot: siteDir,
-    });
-    // const name = flags.name ?? 'world';
-    // this.log(`hello ${name} from /Users/nkruk/git/plugin-lightning-dev/src/commands/lightning/dev/site.ts`);
-    return {
-      path: '/Users/nkruk/git/plugin-lightning-dev/src/commands/lightning/dev/site.ts',
-    };
   }
 }