Merge pull request #6390 from Shopify/jb-multi-env-pull

Allow theme pull command to be called with multiple environments

Author: dejmedus

.changeset/tricky-bugs-float.md

@@ -0,0 +1,6 @@
+---
+'@shopify/theme': minor
+'@shopify/cli': minor
+---
+
+Allow theme pull command to be called with multiple environments

packages/cli/oclif.manifest.json

@@ -6503,6 +6503,16 @@
       "hiddenAliases": [
       ],
       "id": "theme:pull",
+      "multiEnvironmentsFlags": [
+        "store",
+        "password",
+        "path",
+        [
+          "live",
+          "development",
+          "theme"
+        ]
+      ],
       "pluginAlias": "@shopify/cli",
       "pluginName": "@shopify/cli",
       "pluginType": "core",

packages/theme/src/cli/commands/theme/pull.ts

@@ -1,10 +1,14 @@
 import {globFlags, themeFlags} from '../../flags.js'
-import ThemeCommand from '../../utilities/theme-command.js'
-import {pull, PullFlags} from '../../services/pull.js'
+import ThemeCommand, {RequiredFlags} from '../../utilities/theme-command.js'
+import {pull} from '../../services/pull.js'
 import {globalFlags} from '@shopify/cli-kit/node/cli'
 import {Flags} from '@oclif/core'
 import {recordTiming} from '@shopify/cli-kit/node/analytics'
+import {InferredFlags} from '@oclif/core/interfaces'
+import {AdminSession} from '@shopify/cli-kit/node/session'
+import {Writable} from 'stream'
 
+type PullFlags = InferredFlags<typeof Pull.flags>
 export default class Pull extends ThemeCommand {
   static summary = 'Download your remote theme files locally.'
 
@@ -46,25 +50,16 @@ If no theme is specified, then you're prompted to select the theme to pull from
     }),
   }
 
-  async run(): Promise<void> {
-    const {flags} = await this.parse(Pull)
-    const pullFlags: PullFlags = {
-      path: flags.path,
-      password: flags.password,
-      store: flags.store,
-      theme: flags.theme,
-      development: flags.development,
-      live: flags.live,
-      nodelete: flags.nodelete,
-      only: flags.only,
-      ignore: flags.ignore,
-      force: flags.force,
-      verbose: flags.verbose,
-      noColor: flags['no-color'],
-    }
+  static multiEnvironmentsFlags: RequiredFlags = ['store', 'password', 'path', ['live', 'development', 'theme']]
 
+  async command(
+    flags: PullFlags,
+    adminSession?: AdminSession,
+    multiEnvironment?: boolean,
+    context?: {stdout?: Writable; stderr?: Writable},
+  ) {
     recordTiming('theme-command:pull')
-    await pull(pullFlags)
+    await pull({...flags, noColor: flags['no-color']}, adminSession, multiEnvironment, context)
     recordTiming('theme-command:pull')
   }
 }

packages/theme/src/cli/services/pull.test.ts

@@ -70,7 +70,14 @@ describe('pull', () => {
     // Then
     expect(findDevelopmentThemeSpy).not.toHaveBeenCalled()
     expect(fetchDevelopmentThemeSpy).toHaveBeenCalledOnce()
-    expect(downloadTheme).toHaveBeenCalledWith(theme, adminSession, [], localThemeFileSystem, expect.any(Object))
+    expect(downloadTheme).toHaveBeenCalledWith(
+      theme,
+      adminSession,
+      [],
+      localThemeFileSystem,
+      expect.any(Object),
+      undefined,
+    )
   })
 
   test('should pass the development theme to downloadtheme if development flag is provided', async () => {
@@ -102,7 +109,9 @@ describe('pull', () => {
     // Then
     expect(vi.mocked(ensureDirectoryConfirmed)).toHaveBeenCalledWith(
       false,
-      'The current Git directory has uncommitted changes. Do you want to proceed?',
+      'The current Git directory has uncommitted changes.',
+      undefined,
+      undefined,
     )
   })
 

packages/theme/src/cli/services/pull.ts

@@ -14,13 +14,16 @@ import {glob} from '@shopify/cli-kit/node/fs'
 import {cwd} from '@shopify/cli-kit/node/path'
 import {insideGitDirectory, isClean} from '@shopify/cli-kit/node/git'
 import {recordTiming} from '@shopify/cli-kit/node/analytics'
+import {Writable} from 'stream'
 
 interface PullOptions {
   path: string
   nodelete: boolean
   force: boolean
   only?: string[]
   ignore?: string[]
+  environment?: string
+  multiEnvironment?: boolean
 }
 
 export interface PullFlags {
@@ -83,6 +86,11 @@ export interface PullFlags {
    * Increase the verbosity of the output.
    */
   verbose?: boolean
+
+  /**
+   * The environment to pull from.
+   */
+  environment?: string[]
 }
 
 /**
@@ -91,19 +99,25 @@ export interface PullFlags {
  *
  * @param flags - All flags are optional.
  */
-export async function pull(flags: PullFlags): Promise<void> {
+export async function pull(
+  flags: PullFlags,
+  session?: AdminSession,
+  multiEnvironment?: boolean,
+  context?: {stdout?: Writable; stderr?: Writable},
+): Promise<void> {
   recordTiming('theme-service:pull:setup')
   configureCLIEnvironment({verbose: flags.verbose, noColor: flags.noColor})
 
-  const store = ensureThemeStore({store: flags.store})
-  const adminSession = await ensureAuthenticatedThemes(store, flags.password)
+  // when pull is used programmatically, we don't have an admin session, so need to create one
+  const adminSession =
+    session ?? (await ensureAuthenticatedThemes(ensureThemeStore({store: flags.store}), flags.password))
 
   const developmentThemeManager = new DevelopmentThemeManager(adminSession)
   const developmentTheme = await (flags.development ? developmentThemeManager.find() : developmentThemeManager.fetch())
 
-  const {path, nodelete, live, development, only, ignore, force} = flags
+  const {path, nodelete, live, development, only, ignore, force, environment} = flags
 
-  if (!(await validateDirectory(path ?? cwd(), force ?? false))) {
+  if (!(await validateDirectory(path ?? cwd(), force ?? false, environment?.[0], multiEnvironment))) {
     return
   }
 
@@ -116,13 +130,20 @@ export async function pull(flags: PullFlags): Promise<void> {
   })
   recordTiming('theme-service:pull:setup')
 
-  await executePull(theme, adminSession, {
-    path: path ?? cwd(),
-    nodelete: nodelete ?? false,
-    only: only ?? [],
-    ignore: ignore ?? [],
-    force: force ?? false,
-  })
+  await executePull(
+    theme,
+    adminSession,
+    {
+      environment: environment?.[0],
+      force: force ?? false,
+      ignore: ignore ?? [],
+      multiEnvironment,
+      nodelete: nodelete ?? false,
+      only: only ?? [],
+      path: path ?? cwd(),
+    },
+    context,
+  )
 }
 
 /**
@@ -132,7 +153,12 @@ export async function pull(flags: PullFlags): Promise<void> {
  * @param session - the admin session to access the API and download the theme
  * @param options - the options that modify how the theme gets downloaded
  */
-async function executePull(theme: Theme, session: AdminSession, options: PullOptions) {
+async function executePull(
+  theme: Theme,
+  session: AdminSession,
+  options: PullOptions,
+  context?: {stdout?: Writable; stderr?: Writable},
+) {
   recordTiming('theme-service:pull:file-system')
   const themeFileSystem = mountThemeFileSystem(options.path, {filters: options})
   const [remoteChecksums] = await Promise.all([fetchChecksums(theme.id, session), themeFileSystem.ready()])
@@ -142,9 +168,11 @@ async function executePull(theme: Theme, session: AdminSession, options: PullOpt
   const store = session.storeFqdn
   const themeId = theme.id
 
-  await downloadTheme(theme, session, themeChecksums, themeFileSystem, options)
+  await downloadTheme(theme, session, themeChecksums, themeFileSystem, options, context)
 
+  const header = options.environment ? `Environment: ${options.environment}` : ''
   renderSuccess({
+    headline: header,
     body: ['The theme', ...themeComponent(theme), 'has been pulled.'],
     nextSteps: [
       [
@@ -190,7 +218,7 @@ export async function isEmptyDir(path: string) {
  * @param force - Whether to force the pull operation.
  * @returns Whether the directory is valid.
  */
-async function validateDirectory(path: string, force: boolean) {
+async function validateDirectory(path: string, force: boolean, environment?: string, multiEnvironment?: boolean) {
   if (force) return true
 
   /**
@@ -202,7 +230,7 @@ async function validateDirectory(path: string, force: boolean) {
   if (
     !(await isEmptyDir(path)) &&
     !(await hasRequiredThemeDirectories(path)) &&
-    !(await ensureDirectoryConfirmed(force))
+    !(await ensureDirectoryConfirmed(force, undefined, environment, multiEnvironment))
   ) {
     return false
   }
@@ -217,7 +245,9 @@ async function validateDirectory(path: string, force: boolean) {
     dirtyDirectory &&
     !(await ensureDirectoryConfirmed(
       force,
-      'The current Git directory has uncommitted changes. Do you want to proceed?',
+      'The current Git directory has uncommitted changes.',
+      environment,
+      multiEnvironment,
     ))
   ) {
     return false

packages/theme/src/cli/utilities/theme-downloader.ts

@@ -4,9 +4,11 @@ import {AdminSession} from '@shopify/cli-kit/node/session'
 import {fetchThemeAssets} from '@shopify/cli-kit/node/themes/api'
 import {ThemeFileSystem, Theme, Checksum, ThemeAsset} from '@shopify/cli-kit/node/themes/types'
 import {renderTasks} from '@shopify/cli-kit/node/ui'
+import {Writable} from 'stream'
 
 interface DownloadOptions {
   nodelete: boolean
+  multiEnvironment?: boolean
 }
 
 export async function downloadTheme(
@@ -15,14 +17,18 @@ export async function downloadTheme(
   remoteChecksums: Checksum[],
   themeFileSystem: ThemeFileSystem,
   options: DownloadOptions,
+  context?: {stdout?: Writable; stderr?: Writable},
 ) {
   const deleteTasks = buildDeleteTasks(remoteChecksums, themeFileSystem, options)
   const downloadTasks = buildDownloadTasks(remoteChecksums, theme, themeFileSystem, session)
 
-  const tasks = [...deleteTasks, ...downloadTasks]
+  const tasks = [...deleteTasks, ...downloadTasks, {title: `Theme download complete`, task: async () => {}}]
 
   if (tasks.length > 0) {
-    await renderTasks(tasks)
+    await renderTasks(tasks, {
+      renderOptions: {stdout: (context?.stdout ?? process.stdout) as NodeJS.WriteStream},
+      noProgressBar: options.multiEnvironment,
+    })
   }
 }
 
@@ -65,7 +71,7 @@ function buildDownloadTasks(
   const filenames = checksums.map((checksum) => checksum.key)
 
   const getProgress = (params: {current: number; total: number}) =>
-    `[${Math.round((params.current / params.total) * 100)}%]`
+    params.total === 0 ? `[100%]` : `[${Math.round((params.current / params.total) * 100)}%]`
 
   const batches = batchedTasks(filenames, MAX_GRAPHQL_THEME_FILES, (batchedFilenames, i) => {
     const title = `Downloading files from remote theme ${getProgress({