add packageManager to nextSteps data object

svelte-add · mstibbard · Sep 2, 2024 · Sep 2, 2024 · Sep 2, 2024 · Sep 2, 2024
commit 9e818fae4b97e9dda2cb68b51150eb8da0f54f9c
diff --git a/adders/supabase/config/adder.ts b/adders/supabase/config/adder.ts
@@ -520,7 +520,7 @@ Start your project with a Postgres database, authentication, instant APIs, edge
 			condition: ({ options }) => options.demo && options.cli,
 		},
 	],
-	nextSteps: ({ options }) => {
+	nextSteps: ({ options, packageManager }) => {
 		const steps = [
 			'Visit the Supabase docs: https://supabase.com/docs',
 			'Update the authGuard server hook function with your protected routes',
@@ -530,8 +530,8 @@ Start your project with a Postgres database, authentication, instant APIs, edge
 			steps.push(
 				dedent`Local development environment:
 
-					1. Initialize the local development environment: ${colors.yellow('pnpm supabase init')}
-					2. Start the local development services: ${colors.yellow('pnpm supabase start')}. This may take a while the first time you run it
+					1. Initialize the local development environment: ${colors.yellow(`${packageManager} supabase init`)}
+					2. Start the local development services: ${colors.yellow(`${packageManager} supabase start`)}. This may take a while the first time you run it
 					3. Update ${colors.green('./supabase/config.toml')} [auth] section \`site_url\` and \`additional_redirect_urls\` to use port 5173
 					4. Depending on your Auth selections, you may need to create local email templates and update ${colors.green('./supabase/config.toml')}
 					`,

diff --git a/packages/core/adder/config.ts b/packages/core/adder/config.ts
@@ -9,6 +9,7 @@ import type { FileTypes } from '../files/processors.js';
 import type { Workspace } from '../utils/workspace.js';
 import type { Postcondition } from './postconditions.js';
 import type { Colors } from 'picocolors/types.js';
+import type { PackageManager } from '../utils/dependencies.js';
 
 export type { CssAstEditor, HtmlAstEditor, JsAstEditor, SvelteAstEditor };
 
@@ -60,6 +61,7 @@ export type InlineAdderConfig<Args extends OptionDefinition> = BaseAdderConfig<A
 		cwd: string;
 		colors: Colors;
 		docs: string | undefined;
+		packageManager: PackageManager;
 	}) => string[];
 	installHook?: (workspace: Workspace<Args>) => Promise<void>;
 	uninstallHook?: (workspace: Workspace<Args>) => Promise<void>;

diff --git a/packages/core/adder/execute.ts b/packages/core/adder/execute.ts
@@ -270,7 +270,7 @@ async function executePlan<Args extends OptionDefinition>(
 	}
 
 	if (!isTesting) {
-		displayNextSteps(adderDetails, isApplyingMultipleAdders, executionPlan);
+		await displayNextSteps(adderDetails, isApplyingMultipleAdders, executionPlan);
 		endPrompts("You're all set!");
 	}
 }

diff --git a/packages/core/adder/nextSteps.ts b/packages/core/adder/nextSteps.ts
@@ -1,14 +1,18 @@
+import { detectPackageManager } from '../utils/dependencies';
 import { messagePrompt } from '../utils/prompts';
 import type { InlineAdderConfig } from './config';
 import type { AdderDetails, AddersExecutionPlan } from './execute';
 import type { OptionDefinition, OptionValues } from './options';
 import pc from 'picocolors';
 
-export function displayNextSteps<Args extends OptionDefinition>(
+export async function displayNextSteps<Args extends OptionDefinition>(
 	adderDetails: AdderDetails<Args>[],
 	multipleAdders: boolean,
 	executionPlan: AddersExecutionPlan,
 ) {
+	const packageManager = await detectPackageManager(executionPlan.workingDirectory);
+	if (!packageManager) throw new Error('Unable to detect package manager');
+
 	const allAddersMessage = adderDetails
 		.filter((x) => x.config.integrationType == 'inline' && x.config.nextSteps)
 		.map((x) => x.config as InlineAdderConfig<Args>)
@@ -28,6 +32,7 @@ export function displayNextSteps<Args extends OptionDefinition>(
 				cwd: executionPlan.workingDirectory,
 				colors: pc,
 				docs: x.metadata.website?.documentation,
+				packageManager,
 			});
 			adderMessage += `- ${adderNextSteps.join('\n- ')}`;
 			return adderMessage;

diff --git a/packages/core/utils/dependencies.ts b/packages/core/utils/dependencies.ts
@@ -4,32 +4,45 @@ import { COMMANDS } from 'package-manager-detector/agents';
 import { spinner } from '@svelte-add/clack-prompts';
 import { executeCli } from './cli.js';
 
-type PackageManager = (typeof packageManagers)[number] | undefined;
+export type PackageManager = (typeof packageManagers)[number];
 const packageManagers = ['npm', 'pnpm', 'yarn', 'bun'] as const;
 
+/**
+ * @param workingDirectory
+ * @returns the package manager
+ */
+export async function detectPackageManager(
+	workingDirectory: string,
+): Promise<PackageManager | undefined> {
+	const detectedPm = await detect({ cwd: workingDirectory });
+	const pm = normalizePackageManager(detectedPm.agent);
+	return pm;
+}
+
 /**
  * @param workingDirectory
  * @returns the install status of dependencies
  */
 export async function suggestInstallingDependencies(
 	workingDirectory: string,
 ): Promise<'installed' | 'skipped'> {
-	const detectedPm = await detect({ cwd: workingDirectory });
-	let selectedPm = detectedPm.agent;
-
-	selectedPm ??= await selectPrompt(
-		'Which package manager do you want to install dependencies with?',
-		undefined,
-		[
-			{
-				label: 'None',
-				value: undefined,
-			},
-			...packageManagers.map((x) => {
-				return { label: x, value: x as PackageManager };
-			}),
-		],
-	);
+	let selectedPm = await detectPackageManager(workingDirectory);
+
+	if (!selectedPm) {
+		selectedPm = await selectPrompt(
+			'Which package manager do you want to install dependencies with?',
+			undefined,
+			[
+				{
+					label: 'None',
+					value: undefined,
+				},
+				...packageManagers.map((x) => {
+					return { label: x, value: x };
+				}),
+			],
+		);
+	}
 
 	if (!selectedPm || !COMMANDS[selectedPm]) {
 		return 'skipped';
@@ -54,3 +67,9 @@ async function installDependencies(command: string, args: string[], workingDirec
 		throw new Error('unable to install dependencies: ' + typedError.message);
 	}
 }
+
+function normalizePackageManager(pm: string | undefined): PackageManager | undefined {
+	if (pm === 'yarn@berry' || pm === 'yarn') return 'yarn';
+	if (pm === 'pnpm@6' || pm === 'pnpm') return 'pnpm';
+	return pm as PackageManager;
+}