Add store copy show command to view operation details

[jordanverasamy]

WHY are these changes introduced?

Fixes #0000

WHAT is this pull request doing?

How to test your changes?

Post-release steps

Measuring impact

How do we know this change was effective? Please choose one:

• n/a - this doesn't need measurement, e.g. a linting rule or a bug-fix
• Existing analytics will cater for this addition
• PR includes analytics changes to measure impact

Checklist

• I've considered possible cross-platform impacts (Mac, Linux, Windows)
• I've considered possible documentation changes

[jordanverasamy]

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

• Add store copy show command to view operation details #6192 👈 (View in Graphite)
• Introduce pretty progress displays #6158
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

Differences in type declarations

We detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:

• Some seemingly private modules might be re-exported through public modules.
• If the branch is behind main you might see odd diffs, rebase main into this branch.

New type declarations

packages/cli-kit/dist/public/node/progress-indicators.d.ts

/**
 * Creates a colored progress bar showing completion percentage.
 *
 * @param percentage - The completion percentage (0-100).
 * @param width - The width of the progress bar in characters.
 * @returns The colored progress bar string.
 */
export declare function createColoredProgressBar(percentage: number, width?: number): string;
/**
 * Creates an animated gradient progress bar for indeterminate operations.
 *
 * @param animationIteration - The animation counter for gradient cycling.
 * @param width - The width of the progress bar in characters.
 * @returns The animated gradient progress bar string.
 */
export declare function createIndeterminateProgressBar(animationIteration: number, width?: number): string;
/**
 * Creates an animated dots string for loading indicators.
 *
 * @param animationIteration - The animation counter that gets incremented over time.
 * @returns A string with 0-3 dots for animation.
 */
export declare function createAnimatedDots(animationIteration: number): string;

packages/cli-kit/dist/public/node/terminal-layout.d.ts

/**
 * Creates right-aligned text by padding between left and right text.
 *
 * @param leftText - The text to display on the left.
 * @param rightText - The text to display on the right.
 * @param width - The total width for the aligned text.
 * @returns The formatted string with proper alignment.
 */
export declare function createRightAlignedText(leftText: string, rightText: string, width?: number): string;
/**
 * Clears the specified number of lines from the terminal by moving cursor up and clearing each line.
 *
 * @param lineCount - The number of lines to clear.
 */
export declare function clearLines(lineCount: number): void;
/**
 * Calculates an appropriate width to use for terminal content like progress bars.
 * Tries to use two-thirds of the available width, but never less than 20 characters.
 *
 * @returns The calculated terminal width.
 */
export declare function twoThirdsOfTerminalWidth(): number;

Existing type declarations

packages/cli-kit/dist/public/node/ui.d.ts

@@ -380,4 +380,6 @@ interface IsTTYOptions {
 export declare function isTTY({ stdin, uiDebugOptions }?: IsTTYOptions): boolean;
 export type Key = InkKey;
 export type InfoMessage = InfoMessageProps['message'];
-export { Token, Task, TokenItem, InlineToken, LinkToken, TableColumn, InfoTableSection, ListToken, render, handleCtrlC };
\ No newline at end of file
+export { Token, Task, TokenItem, InlineToken, LinkToken, TableColumn, InfoTableSection, ListToken, render, handleCtrlC };
+export { createRightAlignedText, clearLines } from './terminal-layout.js';
+export { createColoredProgressBar, createIndeterminateProgressBar, createAnimatedDots } from './progress-indicators.js';
\ No newline at end of file

[github-actions]

Differences in type declarations

We detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:

• Some seemingly private modules might be re-exported through public modules.
• If the branch is behind main you might see odd diffs, rebase main into this branch.

New type declarations

packages/cli-kit/dist/public/node/progress-indicators.d.ts

/**
 * Creates a colored progress bar showing completion percentage.
 *
 * @param percentage - The completion percentage (0-100).
 * @param width - The width of the progress bar in characters.
 * @returns The colored progress bar string.
 */
export declare function createColoredProgressBar(percentage: number, width?: number): string;
/**
 * Creates an animated gradient progress bar for indeterminate operations.
 *
 * @param animationIteration - The animation counter for gradient cycling.
 * @param width - The width of the progress bar in characters.
 * @returns The animated gradient progress bar string.
 */
export declare function createIndeterminateProgressBar(animationIteration: number, width?: number): string;
/**
 * Creates an animated dots string for loading indicators.
 *
 * @param animationIteration - The animation counter that gets incremented over time.
 * @returns A string with 0-3 dots for animation.
 */
export declare function createAnimatedDots(animationIteration: number): string;

packages/cli-kit/dist/public/node/terminal-layout.d.ts

/**
 * Creates right-aligned text by padding between left and right text.
 *
 * @param leftText - The text to display on the left.
 * @param rightText - The text to display on the right.
 * @param width - The total width for the aligned text.
 * @returns The formatted string with proper alignment.
 */
export declare function createRightAlignedText(leftText: string, rightText: string, width?: number): string;
/**
 * Clears the specified number of lines from the terminal by moving cursor up and clearing each line.
 *
 * @param lineCount - The number of lines to clear.
 */
export declare function clearLines(lineCount: number): void;
/**
 * Calculates an appropriate width to use for terminal content like progress bars.
 * Tries to use two-thirds of the available width, but never less than 20 characters.
 *
 * @returns The calculated terminal width.
 */
export declare function twoThirdsOfTerminalWidth(): number;

Existing type declarations

packages/cli-kit/dist/public/node/ui.d.ts

@@ -380,4 +380,6 @@ interface IsTTYOptions {
 export declare function isTTY({ stdin, uiDebugOptions }?: IsTTYOptions): boolean;
 export type Key = InkKey;
 export type InfoMessage = InfoMessageProps['message'];
-export { Token, Task, TokenItem, InlineToken, LinkToken, TableColumn, InfoTableSection, ListToken, render, handleCtrlC };
\ No newline at end of file
+export { Token, Task, TokenItem, InlineToken, LinkToken, TableColumn, InfoTableSection, ListToken, render, handleCtrlC };
+export { createRightAlignedText, clearLines } from './terminal-layout.js';
+export { createColoredProgressBar, createIndeterminateProgressBar, createAnimatedDots } from './progress-indicators.js';
\ No newline at end of file

[github-actions]

This PR seems inactive. If it's still relevant, please add a comment saying so. Otherwise, take no action.
→ If there's no activity within a week, then a bot will automatically close this.
Thanks for helping to improve Shopify's dev tooling and experience.