Various logging improvements

code/addons/vitest/src/postinstall.ts

@@ -9,7 +9,6 @@ import {
   formatFileContent,
   getProjectRoot,
   getStorybookInfo,
-  versions,
 } from 'storybook/internal/common';
 import { CLI_COLORS } from 'storybook/internal/node-logger';
 import {
@@ -342,11 +341,7 @@ export default async function postInstall(options: PostinstallOptions) {
         command.push('--config-dir', `"${options.configDir}"`);
       }
 
-      const remoteCommand = packageManager.getRemoteRunCommand(
-        'storybook',
-        command,
-        versions.storybook
-      );
+      const remoteCommand = packageManager.getRemoteRunCommand('storybook', command);
       const [cmd, ...args] = remoteCommand.split(' ');
 
       await prompt.executeTask(() => packageManager.executeCommand({ command: cmd, args }), {
@@ -374,7 +369,7 @@ export default async function postInstall(options: PostinstallOptions) {
 
   logger.line();
   if (errors.length === 0) {
-    logger.step(CLI_COLORS.success('All done!'));
+    logger.step(CLI_COLORS.success('@storybook/addon-vitest setup completed successfully'));
     logger.log(dedent`
         @storybook/addon-vitest is now configured and you're ready to run your tests!
         Here are a couple of tips to get you started:

code/core/src/cli/detect.ts

@@ -117,13 +117,11 @@ export async function detectBuilder(packageManager: JsPackageManager) {
   const dependencies = packageManager.getAllDependencies();
 
   if (viteConfig || (dependencies.vite && dependencies.webpack === undefined)) {
-    logger.step('Builder detected: Vite');
     return SupportedBuilder.VITE;
   }
 
   // REWORK
   if (webpackConfig || (dependencies.webpack && dependencies.vite !== undefined)) {
-    logger.step('Builder detected: Webpack 5');
     return SupportedBuilder.WEBPACK5;
   }
 

code/core/src/common/js-package-manager/BUNProxy.ts

@@ -1,8 +1,8 @@
-import { existsSync, readFileSync } from 'node:fs';
+import { readFileSync } from 'node:fs';
 import { platform } from 'node:os';
 import { join } from 'node:path';
 
-import { logger } from 'storybook/internal/node-logger';
+import { logger, prompt } from 'storybook/internal/node-logger';
 import { FindPackageVersionsError } from 'storybook/internal/server-errors';
 
 import * as find from 'empathic/find';
@@ -191,8 +191,8 @@ export class BUNProxy extends JsPackageManager {
     return this.executeCommand({
       command: 'bun',
       args: ['install', ...this.getInstallArgs(), ...(options?.force ? ['--force'] : [])],
-      stdio: 'inherit',
       cwd: this.cwd,
+      stdio: prompt.getPreferredStdio(),
     });
   }
 

code/core/src/node-logger/logger/logger.ts

@@ -186,7 +186,6 @@ export const outro = (message: string) => {
   logTracker.addLog('info', message);
   if (shouldLog('info')) {
     LOG_FUNCTIONS.outro()(message);
-    console.log('\n');
   }
 };
 

code/lib/cli-storybook/src/automigrate/helpers/logMigrationSummary.ts

@@ -1,4 +1,4 @@
-import { logger } from 'storybook/internal/node-logger';
+import { CLI_COLORS, logger } from 'storybook/internal/node-logger';
 
 import picocolors from 'picocolors';
 import { dedent } from 'ts-dedent';
@@ -56,9 +56,8 @@ export function logMigrationSummary({
   const messages = [];
   messages.push(getGlossaryMessages(fixSummary, fixResults).join(messageDivider));
 
-  messages.push(dedent`If you'd like to run the migrations again, you can do so by running '${picocolors.cyan(
-    'npx storybook automigrate'
-  )}'
+  messages.push(dedent`If you'd like to run the migrations again, you can do so by running 
+    ${picocolors.cyan('npx storybook automigrate')}
 
     The automigrations try to migrate common patterns in your project, but might not contain everything needed to migrate to the latest version of Storybook.
 
@@ -73,14 +72,13 @@ export function logMigrationSummary({
     (r) => r === FixStatus.FAILED || r === FixStatus.CHECK_FAILED
   );
 
-  const title = hasNoFixes
-    ? 'No migrations were applicable to your project'
-    : hasFailures
-      ? 'Migration check ran with failures'
-      : 'Migration check ran successfully';
+  if (hasNoFixes) {
+    logger.warn('No migrations were applicable to your project');
+  } else if (hasFailures) {
+    logger.error('Migration check ran with failures');
+  } else {
+    logger.step(CLI_COLORS.success('Migration check ran successfully'));
+  }
 
-  return logger.logBox(messages.filter(Boolean).join(segmentDivider), {
-    title,
-    borderColor: hasFailures ? 'red' : 'green',
-  });
+  logger.log(messages.filter(Boolean).join(segmentDivider));
 }

code/lib/cli-storybook/src/automigrate/index.ts

@@ -172,7 +172,7 @@ export const automigrate = async ({
     return null;
   }
 
-  logger.log('🔎 checking possible migrations..');
+  logger.step('Checking possible migrations..');
 
   const { fixResults, fixSummary, preCheckFailure } = await runFixes({
     fixes,
@@ -197,12 +197,10 @@ export const automigrate = async ({
   }
 
   if (!hideMigrationSummary) {
-    logger.log('');
     logMigrationSummary({
       fixResults,
       fixSummary,
     });
-    logger.log('');
   }
 
   return { fixResults, preCheckFailure };

code/lib/create-storybook/src/commands/FrameworkDetectionCommand.ts

@@ -1,5 +1,6 @@
 import { type ProjectType, detectBuilder } from 'storybook/internal/cli';
 import type { JsPackageManager } from 'storybook/internal/common';
+import { logger } from 'storybook/internal/node-logger';
 import type { SupportedBuilder, SupportedRenderer } from 'storybook/internal/types';
 import { SupportedFramework } from 'storybook/internal/types';
 
@@ -65,6 +66,8 @@ export class FrameworkDetectionCommand {
       framework = this.getFramework(renderer, builder);
     }
 
+    logger.step(`Framework detected: ${framework}`);
+
     return {
       framework,
       renderer,

code/lib/create-storybook/src/commands/PreflightCheckCommand.ts

@@ -46,10 +46,14 @@ export class PreflightCheckCommand {
       }
 
       // Prompt the user to create a new project from our list
+      logger.intro(CLI_COLORS.info(`Initializing a new project`));
       await scaffoldNewProject(packageManagerType, options);
+      logger.outro(CLI_COLORS.info(`Project created successfully`));
       invalidateProjectRootCache();
     }
 
+    logger.intro(CLI_COLORS.info(`Initializing Storybook`));
+
     const packageManager = JsPackageManagerFactory.getPackageManager({
       force: pkgMgr,
     });

code/lib/create-storybook/src/commands/ProjectDetectionCommand.ts

@@ -37,7 +37,7 @@ export class ProjectDetectionCommand {
       logger.step(`Installing Storybook for user specified project type: ${projectTypeProvided}`);
     } else {
       projectType = await this.autoDetectProjectType(packageManager, options);
-      logger.step(`Project type detected: ${projectType}`);
+      logger.debug(`Project type detected: ${projectType}`);
     }
 
     // Check for existing installation

code/lib/create-storybook/src/initiate.ts

@@ -136,8 +136,6 @@ export async function initiate(options: CommandOptions): Promise<void> {
       printError: (err) => !err.handled && logger.error(err),
     },
     async () => {
-      logger.intro(CLI_COLORS.info(`Initializing Storybook`));
-
       const result = await doInitiate(options);
 
       logger.outro('Initiation completed');