@plasmicapp/cli 0.1.162

package/src/actions/sync-components.ts

@@ -0,0 +1,405 @@
+import {
+  ComponentInfoForMerge,
+  makeCachedProjectSyncDataProvider,
+  mergeFiles,
+} from "@plasmicapp/code-merger";
+import L from "lodash";
+import path from "upath";
+import { AppServerError, ChecksumBundle, ComponentBundle } from "../api";
+import { logger } from "../deps";
+import { ComponentUpdateSummary, formatAsLocal } from "../utils/code-utils";
+import {
+  ComponentConfig,
+  CONFIG_FILE_NAME,
+  isPageAwarePlatform,
+  PlasmicContext,
+  ProjectConfig,
+  ProjectLock,
+} from "../utils/config-utils";
+import { HandledError } from "../utils/error";
+import {
+  defaultPagePath,
+  defaultResourcePath,
+  deleteFile,
+  fileExists,
+  readFileContent,
+  renameFile,
+  writeFileContent,
+} from "../utils/file-utils";
+import { assert, ensure } from "../utils/lang-utils";
+import { confirmWithUser } from "../utils/user-utils";
+
+export interface ComponentPendingMerge {
+  // path of the skeleton module
+  skeletonModulePath: string;
+  editedSkeletonFile: string;
+  newSkeletonFile: string;
+  // function to perform code merger using input whose import has been resolved.
+  merge: (
+    resolvedNewSkeletonFile: string,
+    resolvedEditedSkeletonFile: string
+  ) => Promise<void>;
+}
+
+const updateDirectSkeleton = async (
+  newFileContent: string,
+  editedFileContent: string,
+  context: PlasmicContext,
+  compConfig: ComponentConfig,
+  forceOverwrite: boolean,
+  nameInIdToUuid: [string, string][],
+  appendJsxOnMissingBase: boolean
+) => {
+  // merge code!
+  const componentByUuid = new Map<string, ComponentInfoForMerge>();
+
+  componentByUuid.set(compConfig.id, {
+    editedFile: editedFileContent,
+    newFile: newFileContent,
+    newNameInIdToUuid: new Map(nameInIdToUuid),
+  });
+  const mergedFiles = await mergeFiles(
+    componentByUuid,
+    compConfig.projectId,
+    makeCachedProjectSyncDataProvider(async (projectId, revision) => {
+      try {
+        return await context.api.projectSyncMetadata(projectId, revision, true);
+      } catch (e) {
+        if (
+          e instanceof AppServerError &&
+          /revision \d+ not found/.test(e.message)
+        ) {
+          throw e;
+        } else {
+          throw new HandledError(e.messag);
+        }
+      }
+    }),
+    () => {},
+    appendJsxOnMissingBase
+  );
+  const merged = mergedFiles?.get(compConfig.id);
+  if (merged) {
+    await writeFileContent(context, compConfig.importSpec.modulePath, merged, {
+      force: true,
+    });
+  } else {
+    if (!forceOverwrite) {
+      throw new HandledError(
+        `Cannot merge ${compConfig.importSpec.modulePath}. If you just switched the code scheme for the component from blackbox to direct, use --force-overwrite option to force the switch.`
+      );
+    } else {
+      logger.warn(
+        `Overwrite ${compConfig.importSpec.modulePath} despite merge failure`
+      );
+      await writeFileContent(
+        context,
+        compConfig.importSpec.modulePath,
+        newFileContent,
+        {
+          force: true,
+        }
+      );
+    }
+  }
+};
+
+export async function syncProjectComponents(
+  context: PlasmicContext,
+  project: ProjectConfig,
+  version: string,
+  componentBundles: ComponentBundle[],
+  forceOverwrite: boolean,
+  appendJsxOnMissingBase: boolean,
+  summary: Map<string, ComponentUpdateSummary>,
+  pendingMerge: ComponentPendingMerge[],
+  projectLock: ProjectLock,
+  checksums: ChecksumBundle,
+  baseDir: string
+) {
+  const componentsFromChecksums = new Set([
+    ...checksums.cssRulesChecksums.map(([id, _]) => id),
+    checksums.renderModuleChecksums.map(([id, _]) => id),
+  ]);
+  const allCompConfigs = L.keyBy(project.components, (c) => c.id);
+  const componentBundleIds = L.keyBy(componentBundles, (i) => i.id);
+  const deletedComponents = L.filter(
+    allCompConfigs,
+    (i) => !componentBundleIds[i.id] && !componentsFromChecksums.has(i.id)
+  );
+
+  const renderModuleFileLocks = L.keyBy(
+    projectLock.fileLocks.filter(
+      (fileLock) => fileLock.type === "renderModule"
+    ),
+    (fl) => fl.assetId
+  );
+  const cssRulesFileLocks = L.keyBy(
+    projectLock.fileLocks.filter((fileLock) => fileLock.type === "cssRules"),
+    (fl) => fl.assetId
+  );
+  const id2RenderModuleChecksum = new Map(checksums.renderModuleChecksums);
+  const id2CssRulesChecksum = new Map(checksums.cssRulesChecksums);
+
+  const deletedComponentFiles = new Set<string>();
+  for (const deletedComponent of deletedComponents) {
+    const componentConfig = allCompConfigs[deletedComponent.id];
+    if (
+      fileExists(context, componentConfig.renderModuleFilePath) &&
+      fileExists(context, componentConfig.cssFilePath)
+    ) {
+      logger.info(
+        `Deleting component: ${componentConfig.name}@${version}\t['${project.projectName}' ${project.projectId}/${componentConfig.id} ${project.version}]`
+      );
+      deleteFile(context, componentConfig.renderModuleFilePath);
+      deleteFile(context, componentConfig.cssFilePath);
+      deletedComponentFiles.add(deletedComponent.id);
+
+      const skeletonPath = componentConfig.importSpec.modulePath;
+      if (fileExists(context, skeletonPath)) {
+        const deleteSkeleton = await confirmWithUser(
+          `Do you want to delete ${skeletonPath}?`,
+          context.cliArgs.yes
+        );
+        if (deleteSkeleton) {
+          deleteFile(context, skeletonPath);
+        }
+      }
+    }
+  }
+  project.components = project.components.filter(
+    (c) => !deletedComponentFiles.has(c.id)
+  );
+
+  const deletedComponentIds = new Set(deletedComponents.map((i) => i.id));
+  projectLock.fileLocks = projectLock.fileLocks.filter(
+    (fileLock) =>
+      (fileLock.type !== "renderModule" && fileLock.type !== "cssRules") ||
+      !deletedComponentIds.has(fileLock.assetId)
+  );
+
+  for (const bundle of componentBundles) {
+    const {
+      renderModule,
+      skeletonModule,
+      cssRules,
+      renderModuleFileName,
+      skeletonModuleFileName,
+      cssFileName,
+      componentName,
+      id,
+      scheme,
+      nameInIdToUuid,
+      isPage,
+      plumeType,
+    } = bundle;
+    if (context.cliArgs.quiet !== true) {
+      logger.info(
+        `Syncing component: ${componentName}@${version}\t['${project.projectName}' ${project.projectId}/${id} ${project.version}]`
+      );
+    }
+    let compConfig = allCompConfigs[id];
+
+    // A component should be regenerated if it is new or path-related information (like the name)
+    // changed.
+    const shouldRegenerate = compConfig?.name !== componentName;
+    let skeletonModuleModified = shouldRegenerate;
+
+    const skeletonPath = isPage
+      ? defaultPagePath(context, skeletonModuleFileName)
+      : skeletonModuleFileName;
+
+    const defaultRenderModuleFilePath = defaultResourcePath(
+      context,
+      project,
+      renderModuleFileName
+    );
+    const defaultCssFilePath = defaultResourcePath(
+      context,
+      project,
+      cssFileName
+    );
+
+    if (shouldRegenerate) {
+      project.components = project.components.filter(
+        (existingComponent) => existingComponent.id !== id
+      );
+      compConfig = {
+        id,
+        name: componentName,
+        type: "managed",
+        projectId: project.projectId,
+        renderModuleFilePath: defaultRenderModuleFilePath,
+        importSpec: { modulePath: skeletonPath },
+        cssFilePath: defaultCssFilePath,
+        scheme: scheme as "blackbox" | "direct",
+        componentType: isPage ? "page" : "component",
+        plumeType,
+      };
+      allCompConfigs[id] = compConfig;
+      project.components.push(allCompConfigs[id]);
+
+      // Because it's the first time, we also generate the skeleton file.
+      await writeFileContent(context, skeletonPath, skeletonModule, {
+        force: false,
+      });
+    } else if (compConfig.type === "mapped") {
+    } else if (compConfig.type === "managed") {
+      // This is an existing component.
+      // We only bother touching files on disk if this component is managed.
+
+      compConfig.componentType = isPage ? "page" : "component";
+
+      // Read in the existing file
+      let editedFile: string;
+      try {
+        editedFile = readFileContent(context, compConfig.importSpec.modulePath);
+      } catch (e) {
+        logger.warn(
+          `${compConfig.importSpec.modulePath} is missing. If you deleted this component, remember to remove the component from ${CONFIG_FILE_NAME}`
+        );
+        throw e;
+      }
+
+      const renderModuleFilePath = path.join(
+        path.dirname(compConfig.renderModuleFilePath),
+        path.basename(defaultRenderModuleFilePath)
+      );
+      if (
+        compConfig.renderModuleFilePath !== renderModuleFilePath &&
+        fileExists(context, compConfig.renderModuleFilePath)
+      ) {
+        if (context.cliArgs.quiet !== true) {
+          logger.info(
+            `Renaming component file: ${compConfig.renderModuleFilePath}@${version}\t['${project.projectName}' ${project.projectId}/${id} ${project.version}]`
+          );
+        }
+        renameFile(
+          context,
+          compConfig.renderModuleFilePath,
+          renderModuleFilePath
+        );
+        compConfig.renderModuleFilePath = renderModuleFilePath;
+      }
+
+      const cssFilePath = path.join(
+        path.dirname(compConfig.cssFilePath),
+        path.basename(defaultCssFilePath)
+      );
+      if (
+        compConfig.cssFilePath !== cssFilePath &&
+        fileExists(context, compConfig.cssFilePath)
+      ) {
+        if (context.cliArgs.quiet !== true) {
+          logger.info(
+            `Renaming component css file: ${compConfig.cssFilePath}@${version}\t['${project.projectName}' ${project.projectId}/${id} ${project.version}]`
+          );
+        }
+        renameFile(context, compConfig.cssFilePath, cssFilePath);
+        compConfig.cssFilePath = cssFilePath;
+      }
+
+      if (
+        isPage &&
+        isPageAwarePlatform(context.config.platform) &&
+        skeletonPath !== compConfig.importSpec.modulePath &&
+        fileExists(context, compConfig.importSpec.modulePath)
+      ) {
+        if (context.cliArgs.quiet !== true) {
+          logger.info(
+            `Renaming page file: ${compConfig.importSpec.modulePath} -> ${skeletonPath}\t['${project.projectName}' ${project.projectId}/${id} ${project.version}]`
+          );
+        }
+        renameFile(context, compConfig.importSpec.modulePath, skeletonPath);
+        compConfig.importSpec.modulePath = skeletonPath;
+      }
+
+      compConfig.plumeType = plumeType;
+
+      if (scheme === "direct") {
+        // We cannot merge right now, but wait until all the imports are resolved
+        pendingMerge.push({
+          skeletonModulePath: compConfig.importSpec.modulePath,
+          editedSkeletonFile: editedFile,
+          newSkeletonFile: skeletonModule,
+          merge: async (resolvedNewFile, resolvedEditedFile) =>
+            updateDirectSkeleton(
+              resolvedNewFile,
+              resolvedEditedFile,
+              context,
+              compConfig,
+              forceOverwrite,
+              nameInIdToUuid,
+              appendJsxOnMissingBase
+            ),
+        });
+        skeletonModuleModified = true;
+      } else if (/\/\/\s*plasmic-managed-jsx\/\d+/.test(editedFile)) {
+        if (forceOverwrite) {
+          skeletonModuleModified = true;
+          await writeFileContent(
+            context,
+            compConfig.importSpec.modulePath,
+            skeletonModule,
+            {
+              force: true,
+            }
+          );
+        } else {
+          logger.warn(
+            `file ${compConfig.importSpec.modulePath} is likely in "direct" scheme. If you intend to switch the code scheme from direct to blackbox, use --force-overwrite option to force the switch.`
+          );
+        }
+      }
+    }
+
+    assert(L.isArray(projectLock.fileLocks));
+    // Update FileLocks
+    if (renderModuleFileLocks[id]) {
+      renderModuleFileLocks[id].checksum = ensure(
+        id2RenderModuleChecksum.get(id)
+      );
+    } else {
+      projectLock.fileLocks.push({
+        type: "renderModule",
+        assetId: id,
+        checksum: ensure(id2RenderModuleChecksum.get(id)),
+      });
+    }
+    if (cssRulesFileLocks[id]) {
+      cssRulesFileLocks[id].checksum = ensure(id2CssRulesChecksum.get(id));
+    } else {
+      projectLock.fileLocks.push({
+        type: "cssRules",
+        assetId: id,
+        checksum: ensure(id2CssRulesChecksum.get(id)),
+      });
+    }
+
+    if (compConfig.type === "managed") {
+      // Again, only need to touch files on disk if managed
+      await writeFileContent(
+        context,
+        compConfig.renderModuleFilePath,
+        renderModule,
+        {
+          force: !shouldRegenerate,
+        }
+      );
+      const formattedCssRules = formatAsLocal(
+        cssRules,
+        compConfig.cssFilePath,
+        baseDir
+      );
+      await writeFileContent(
+        context,
+        compConfig.cssFilePath,
+        formattedCssRules,
+        {
+          force: !shouldRegenerate,
+        }
+      );
+    }
+    summary.set(id, { skeletonModuleModified });
+  }
+}

package/src/actions/sync-global-variants.ts

@@ -0,0 +1,129 @@
+import L from "lodash";
+import path from "upath";
+import { ChecksumBundle, GlobalVariantBundle, ProjectMetaBundle } from "../api";
+import { logger } from "../deps";
+import { formatAsLocal } from "../utils/code-utils";
+import { getOrAddProjectLock, PlasmicContext } from "../utils/config-utils";
+import {
+  defaultResourcePath,
+  deleteFile,
+  fileExists,
+  renameFile,
+  writeFileContent,
+} from "../utils/file-utils";
+import { ensure } from "../utils/lang-utils";
+
+export async function syncGlobalVariants(
+  context: PlasmicContext,
+  projectMeta: ProjectMetaBundle,
+  bundles: GlobalVariantBundle[],
+  checksums: ChecksumBundle,
+  baseDir: string,
+) {
+  const projectId = projectMeta.projectId;
+  const projectLock = getOrAddProjectLock(context, projectId);
+  const existingVariantConfigs = L.keyBy(
+    context.config.globalVariants.variantGroups.filter(
+      (group) => group.projectId === projectId
+    ),
+    (c) => c.id
+  );
+  const globalVariantFileLocks = L.keyBy(
+    projectLock.fileLocks.filter(
+      (fileLock) => fileLock.type === "globalVariant"
+    ),
+    (fl) => fl.assetId
+  );
+  const id2VariantChecksum = new Map(checksums.globalVariantChecksums);
+
+  const variantBundleIds = L.keyBy(bundles, (i) => i.id);
+  const deletedGlobalVariants = L.filter(
+    existingVariantConfigs,
+    (i) => !variantBundleIds[i.id] && !id2VariantChecksum.has(i.id)
+  );
+
+  for (const bundle of bundles) {
+    if (context.cliArgs.quiet !== true) {
+      logger.info(
+        `Syncing global variant ${bundle.name} [${projectId}/${bundle.id}]`
+      );
+    }
+    let variantConfig = existingVariantConfigs[bundle.id];
+    const isNew = !variantConfig;
+    const defaultContextFilePath = defaultResourcePath(
+      context,
+      projectMeta,
+      bundle.contextFileName
+    );
+    if (isNew) {
+      variantConfig = {
+        id: bundle.id,
+        name: bundle.name,
+        projectId,
+        contextFilePath: defaultContextFilePath,
+      };
+      existingVariantConfigs[bundle.id] = variantConfig;
+      context.config.globalVariants.variantGroups.push(variantConfig);
+    } else {
+      const contextFilePath = path.join(
+        path.dirname(variantConfig.contextFilePath),
+        path.basename(defaultContextFilePath)
+      );
+      if (
+        variantConfig.contextFilePath !== contextFilePath &&
+        fileExists(context, variantConfig.contextFilePath)
+      ) {
+        if (context.cliArgs.quiet !== true) {
+          logger.info(
+            `Renaming global variant: ${variantConfig.name} [${projectId}/${bundle.id}]`
+          );
+        }
+        renameFile(context, variantConfig.contextFilePath, contextFilePath);
+        variantConfig.contextFilePath = contextFilePath;
+      }
+      variantConfig.name = bundle.name;
+    }
+
+    // Update FileLocks
+    if (globalVariantFileLocks[bundle.id]) {
+      globalVariantFileLocks[bundle.id].checksum = ensure(
+        id2VariantChecksum.get(bundle.id)
+      );
+    } else {
+      projectLock.fileLocks.push({
+        type: "globalVariant",
+        assetId: bundle.id,
+        checksum: ensure(id2VariantChecksum.get(bundle.id)),
+      });
+    }
+
+    await writeFileContent(
+      context,
+      variantConfig.contextFilePath,
+      formatAsLocal(bundle.contextModule, variantConfig.contextFilePath, baseDir),
+      { force: !isNew }
+    );
+  }
+
+  const deletedVariantsFiles = new Set<string>();
+  for (const deletedGlobalVariant of deletedGlobalVariants) {
+    const variantConfig = existingVariantConfigs[deletedGlobalVariant.id];
+    if (fileExists(context, variantConfig.contextFilePath)) {
+      logger.info(
+        `Deleting global variant: ${variantConfig.name} [${projectId}/${deletedGlobalVariant.id}]`
+      );
+      deleteFile(context, variantConfig.contextFilePath);
+      deletedVariantsFiles.add(deletedGlobalVariant.id);
+    }
+  }
+  context.config.globalVariants.variantGroups = context.config.globalVariants.variantGroups.filter(
+    (v) => !deletedVariantsFiles.has(v.id)
+  );
+
+  const deletedVariantIds = new Set(deletedGlobalVariants.map((i) => i.id));
+  projectLock.fileLocks = projectLock.fileLocks.filter(
+    (fileLock) =>
+      fileLock.type !== "globalVariant" ||
+      !deletedVariantIds.has(fileLock.assetId)
+  );
+}

package/src/actions/sync-icons.ts

@@ -0,0 +1,135 @@
+import L from "lodash";
+import path from "upath";
+import { CommonArgs } from "..";
+import { ChecksumBundle, IconBundle } from "../api";
+import { logger } from "../deps";
+import { formatAsLocal } from "../utils/code-utils";
+import {
+  getOrAddProjectConfig,
+  getOrAddProjectLock,
+  PlasmicContext,
+} from "../utils/config-utils";
+import {
+  defaultResourcePath,
+  deleteFile,
+  fileExists,
+  renameFile,
+  writeFileContent,
+} from "../utils/file-utils";
+import { ensure } from "../utils/lang-utils";
+
+export interface SyncIconsArgs extends CommonArgs {
+  projects: readonly string[];
+}
+
+export async function syncProjectIconAssets(
+  context: PlasmicContext,
+  projectId: string,
+  version: string,
+  iconBundles: IconBundle[],
+  checksums: ChecksumBundle,
+  baseDir: string,
+) {
+  const project = getOrAddProjectConfig(context, projectId);
+  if (!project.icons) {
+    project.icons = [];
+  }
+
+  const projectLock = getOrAddProjectLock(context, projectId);
+  const knownIconConfigs = L.keyBy(project.icons, (i) => i.id);
+  const iconFileLocks = L.keyBy(
+    projectLock.fileLocks.filter((fileLock) => fileLock.type === "icon"),
+    (fl) => fl.assetId
+  );
+  const id2IconChecksum = new Map(checksums.iconChecksums);
+
+  const iconBundleIds = L.keyBy(iconBundles, (i) => i.id);
+  const deletedIcons = L.filter(
+    knownIconConfigs,
+    (i) => !iconBundleIds[i.id] && !id2IconChecksum.has(i.id)
+  );
+
+  for (const bundle of iconBundles) {
+    if (context.cliArgs.quiet !== true) {
+      logger.info(
+        `Syncing icon: ${bundle.name}@${version}\t['${project.projectName}' ${project.projectId}/${bundle.id} ${project.version}]`
+      );
+    }
+    let iconConfig = knownIconConfigs[bundle.id];
+    const isNew = !iconConfig;
+    const defaultModuleFilePath = defaultResourcePath(
+      context,
+      project,
+      "icons",
+      bundle.fileName
+    );
+    if (isNew) {
+      iconConfig = {
+        id: bundle.id,
+        name: bundle.name,
+        moduleFilePath: defaultModuleFilePath,
+      };
+      knownIconConfigs[bundle.id] = iconConfig;
+      project.icons.push(iconConfig);
+    } else {
+      const moduleFilePath = path.join(
+        path.dirname(iconConfig.moduleFilePath),
+        path.basename(defaultModuleFilePath)
+      );
+      if (
+        iconConfig.moduleFilePath !== moduleFilePath &&
+        fileExists(context, iconConfig.moduleFilePath)
+      ) {
+        if (context.cliArgs.quiet !== true) {
+          logger.info(
+            `Renaming icon: ${iconConfig.name}@${version}\t['${project.projectName}' ${project.projectId}/${bundle.id} ${project.version}]`
+          );
+        }
+        renameFile(context, iconConfig.moduleFilePath, moduleFilePath);
+        iconConfig.moduleFilePath = moduleFilePath;
+      }
+      iconConfig.name = bundle.name;
+    }
+
+    // Update FileLocks
+    if (iconFileLocks[bundle.id]) {
+      iconFileLocks[bundle.id].checksum = ensure(
+        id2IconChecksum.get(bundle.id)
+      );
+    } else {
+      projectLock.fileLocks.push({
+        type: "icon",
+        assetId: bundle.id,
+        checksum: ensure(id2IconChecksum.get(bundle.id)),
+      });
+    }
+
+    await writeFileContent(
+      context,
+      iconConfig.moduleFilePath,
+      formatAsLocal(bundle.module, iconConfig.moduleFilePath, baseDir),
+      {
+        force: !isNew,
+      }
+    );
+  }
+
+  const deletedIconFiles = new Set<string>();
+  for (const deletedIcon of deletedIcons) {
+    const iconConfig = knownIconConfigs[deletedIcon.id];
+    if (fileExists(context, iconConfig.moduleFilePath)) {
+      logger.info(
+        `Deleting icon: ${iconConfig.name}@${version}\t['${project.projectName}' ${project.projectId}/${deletedIcon.id} ${project.version}]`
+      );
+      deleteFile(context, iconConfig.moduleFilePath);
+      deletedIconFiles.add(deletedIcon.id);
+    }
+  }
+  project.icons = project.icons.filter((i) => !deletedIconFiles.has(i.id));
+
+  const deletedIconIds = new Set(deletedIcons.map((i) => i.id));
+  projectLock.fileLocks = projectLock.fileLocks.filter(
+    (fileLock) =>
+      fileLock.type !== "icon" || !deletedIconIds.has(fileLock.assetId)
+  );
+}