@angeloashmore/prismic-cli-poc 0.0.0-pr.8.d3fbd0b → 0.0.0-pr.9.5366ece

package/src/status.ts

@@ -30,8 +30,8 @@ import { getWebhooks } from "./webhook-view";
 const HELP = `
 Show the status of the current Prismic project.
 
-Includes a "Next:" step showing the most important action to take based on
-project state.
+Each section with incomplete items includes "Next steps:" with actionable
+instructions.
 
 By default, this command reads the repository from prismic.config.json at the
 project root.
@@ -57,13 +57,14 @@ type StatusItem = {
 	hint?: string;
 };
 
+type NextStep = {
+	action: string;
+};
+
 type StatusSection = {
 	title: string;
 	items: StatusItem[];
-};
-
-type NextStep = {
-	message: string;
+	nextSteps?: NextStep[];
 };
 
 function getDocsPath(framework: Framework | undefined): string {
@@ -82,7 +83,7 @@ function getDocsPath(framework: Framework | undefined): string {
 function getDocsRef(docsPath: string, anchor?: string): string {
 	if (!docsPath) return "";
 	const fullPath = anchor ? `${docsPath}${anchor}` : docsPath;
-	return ` (run \`prismic docs ${fullPath}\`)`;
+	return `\`prismic docs ${fullPath}\``;
 }
 
 function getClientSetupAnchor(framework: Framework | undefined): string {
@@ -116,126 +117,161 @@ function getWriteComponentsAnchor(framework: Framework | undefined): string {
 	}
 }
 
-function computeNextStep(
-	sections: StatusSection[],
-	frameworkInfo: FrameworkInfo,
-	typeStatuses: TypeWithStatus[],
-	sliceStatuses: TypeWithStatus[],
-	slicesWithMissingComponents: string[],
-	slicesReadyToConnect: string[],
-): NextStep | undefined {
+// Next-step builder functions
+
+function buildSetupNextSteps(items: StatusItem[], frameworkInfo: FrameworkInfo): NextStep[] {
+	const nextSteps: NextStep[] = [];
 	const docsPath = getDocsPath(frameworkInfo.framework);
 
-	// 1. Setup - missing dependencies
-	const setupSection = sections.find((s) => s.title === "Setup");
-	const missingDeps = setupSection?.items.filter((i) => !i.done && i.hint === "not installed");
-	if (missingDeps && missingDeps.length > 0) {
+	// Missing dependencies
+	const missingDeps = items.filter((i) => !i.done && i.hint === "not installed");
+	if (missingDeps.length > 0) {
 		const depsList = missingDeps.map((d) => d.label).join(" ");
-		return { message: `Install Prismic packages with 'npm install ${depsList}'` };
+		nextSteps.push({
+			action: `Install dependencies: Run \`npm install ${depsList}\``,
+		});
 	}
 
-	// 2. Setup - missing client file
-	const missingClientFile = setupSection?.items.find((i) => !i.done && i.hint?.includes("client"));
+	// Missing client file
+	const missingClientFile = items.find((i) => !i.done && i.hint?.includes("client"));
 	if (missingClientFile) {
-		return { message: `Create a ${missingClientFile.label} file${getDocsRef(docsPath, getClientSetupAnchor(frameworkInfo.framework))}` };
+		const docsRef = getDocsRef(docsPath, getClientSetupAnchor(frameworkInfo.framework));
+		nextSteps.push({
+			action: `Create Prismic client file: Run ${docsRef} and create the file as shown`,
+		});
 	}
 
-	// 3-7. Preview section (in order: local files, then remote config)
-	const previewSection = sections.find((s) => s.title === "Preview");
-	if (previewSection) {
-		// Local files first
-		const sliceSimRoute = previewSection.items.find(
-			(i) => i.label === "/slice-simulator route" && !i.done,
-		);
-		if (sliceSimRoute) {
-			return { message: `Create the /slice-simulator route${getDocsRef(docsPath, "#set-up-live-previewing")}` };
-		}
+	return nextSteps;
+}
 
-		const apiPreview = previewSection.items.find(
-			(i) => i.label === "/api/preview endpoint" && !i.done,
-		);
-		if (apiPreview) {
-			return { message: `Create the /api/preview route${getDocsRef(docsPath, getPreviewSetupAnchor(frameworkInfo.framework))}` };
-		}
+function buildTypesNextSteps(statuses: TypeWithStatus[]): NextStep[] {
+	const nextSteps: NextStep[] = [];
 
-		const exitPreview = previewSection.items.find(
-			(i) => i.label === "/api/exit-preview endpoint" && !i.done,
-		);
-		if (exitPreview) {
-			return { message: `Create the /api/exit-preview route${getDocsRef(docsPath, getPreviewSetupAnchor(frameworkInfo.framework))}` };
-		}
+	const hasToPush = statuses.some((t) => t.status === "to_push");
+	const hasToPull = statuses.some((t) => t.status === "to_pull");
 
-		// Remote config
-		const simulatorUrl = previewSection.items.find(
-			(i) => i.label === "Slice simulator URL" && !i.done,
-		);
-		if (simulatorUrl) {
-			return { message: `Configure the slice simulator URL with 'prismic preview set-simulator'` };
-		}
+	if (hasToPush) {
+		nextSteps.push({
+			action: "Push local models to Prismic: Run `prismic push`",
+		});
+	}
 
-		const previewEnv = previewSection.items.find(
-			(i) => i.label === "Preview environment" && !i.done,
-		);
-		if (previewEnv) {
-			return { message: `Add a preview environment with 'prismic preview add'` };
-		}
+	if (hasToPull) {
+		nextSteps.push({
+			action: "Pull remote models from Prismic: Run `prismic pull`",
+		});
+	}
+
+	return nextSteps;
+}
+
+function buildSlicesNextSteps(
+	statuses: TypeWithStatus[],
+	missingComponents: string[],
+	slicesReadyToConnect: string[],
+	frameworkInfo: FrameworkInfo,
+): NextStep[] {
+	const nextSteps: NextStep[] = [];
+	const docsPath = getDocsPath(frameworkInfo.framework);
+
+	if (missingComponents.length > 0) {
+		const docsRef = getDocsRef(docsPath, getWriteComponentsAnchor(frameworkInfo.framework));
+		nextSteps.push({
+			action: `Implement slice components: Run ${docsRef} and create each component file`,
+		});
 	}
 
-	// 8. Models to pull
-	const hasToPull =
-		typeStatuses.some((t) => t.status === "to_pull") ||
-		sliceStatuses.some((s) => s.status === "to_pull");
+	const hasToPull = statuses.some((t) => t.status === "to_pull");
+	const hasToPush = statuses.some((t) => t.status === "to_push");
+
 	if (hasToPull) {
-		return { message: `Pull remote models with 'prismic pull'` };
+		nextSteps.push({
+			action: "Pull remote models from Prismic: Run `prismic pull`",
+		});
 	}
 
-	// 8.5 Slices ready to connect to a page type (before pushing)
+	// Slices should be connected to page types before pushing
 	if (slicesReadyToConnect.length > 0) {
 		const sorted = [...slicesReadyToConnect].sort();
 		const sliceName = sorted[0];
-		return {
-			message: `Connect ${sliceName} to a page type with 'prismic page-type connect-slice <type-id> ${sliceName}'`,
-		};
+		nextSteps.push({
+			action: `Connect slice to page type: Run \`prismic page-type connect-slice <type-id> ${sliceName}\``,
+		});
 	}
 
-	// 9. Models to push
-	const hasToPush =
-		typeStatuses.some((t) => t.status === "to_push") ||
-		sliceStatuses.some((s) => s.status === "to_push");
 	if (hasToPush) {
-		return { message: `Push local models with 'prismic push'` };
+		nextSteps.push({
+			action: "Push local models to Prismic: Run `prismic push`",
+		});
 	}
 
-	// 10. Slice components to implement (first alphabetically)
-	if (slicesWithMissingComponents.length > 0) {
-		const sorted = [...slicesWithMissingComponents].sort();
-		const sliceName = sorted[0];
-		const slicesDir = getSlicesDirectory(frameworkInfo);
-		const ext = getSliceComponentExtensions(frameworkInfo.framework)[0];
-		const path = `${slicesDir}${sliceName}/index${ext}`;
-		return { message: `Implement the ${sliceName} slice component at ${path}${getDocsRef(docsPath, getWriteComponentsAnchor(frameworkInfo.framework))}` };
+	return nextSteps;
+}
+
+function buildPreviewNextSteps(items: StatusItem[], frameworkInfo: FrameworkInfo): NextStep[] {
+	const nextSteps: NextStep[] = [];
+	const docsPath = getDocsPath(frameworkInfo.framework);
+
+	// Check for missing /slice-simulator route
+	const sliceSimRoute = items.find((i) => i.label === "/slice-simulator route" && !i.done);
+	if (sliceSimRoute) {
+		const docsRef = getDocsRef(docsPath, "#set-up-live-previewing");
+		nextSteps.push({
+			action: `Create /slice-simulator route: Run ${docsRef} and create the route file as shown`,
+		});
 	}
 
-	// 11-12. Deployment (Next.js only)
-	const deploymentSection = sections.find((s) => s.title === "Deployment");
-	if (deploymentSection) {
-		const revalidateEndpoint = deploymentSection.items.find(
-			(i) => i.label === "/api/revalidate endpoint" && !i.done,
-		);
-		if (revalidateEndpoint) {
-			return { message: `Create the /api/revalidate route for ISR${getDocsRef(docsPath, "#handle-content-changes")}` };
-		}
+	// Check for missing simulator URL config
+	const simulatorUrl = items.find((i) => i.label === "Slice simulator URL" && !i.done);
+	if (simulatorUrl) {
+		nextSteps.push({
+			action: "Configure slice simulator URL: Run `prismic preview set-simulator`",
+		});
+	}
 
-		const webhook = deploymentSection.items.find(
-			(i) => i.label === "Revalidation webhook" && !i.done,
-		);
-		if (webhook) {
-			return { message: `Create a revalidation webhook with 'prismic webhook create'` };
-		}
+	// Check for missing preview endpoints (combine /api/preview and /api/exit-preview)
+	const apiPreview = items.find((i) => i.label === "/api/preview endpoint" && !i.done);
+	const exitPreview = items.find((i) => i.label === "/api/exit-preview endpoint" && !i.done);
+	if (apiPreview || exitPreview) {
+		const docsRef = getDocsRef(docsPath, getPreviewSetupAnchor(frameworkInfo.framework));
+		nextSteps.push({
+			action: `Create preview endpoints: Run ${docsRef} and create the endpoint files as shown`,
+		});
+	}
+
+	// Check for missing preview environment
+	const previewEnv = items.find((i) => i.label === "Preview environment" && !i.done);
+	if (previewEnv) {
+		nextSteps.push({
+			action: "Add preview environment: Run `prismic preview add`",
+		});
+	}
+
+	return nextSteps;
+}
+
+function buildDeploymentNextSteps(items: StatusItem[], frameworkInfo: FrameworkInfo): NextStep[] {
+	const nextSteps: NextStep[] = [];
+	const docsPath = getDocsPath(frameworkInfo.framework);
+
+	// Check for missing /api/revalidate endpoint
+	const revalidateEndpoint = items.find((i) => i.label === "/api/revalidate endpoint" && !i.done);
+	if (revalidateEndpoint) {
+		const docsRef = getDocsRef(docsPath, "#handle-content-changes");
+		nextSteps.push({
+			action: `Create /api/revalidate endpoint: Run ${docsRef} and create the endpoint as shown`,
+		});
+	}
+
+	// Check for missing revalidation webhook
+	const webhook = items.find((i) => i.label === "Revalidation webhook" && !i.done);
+	if (webhook) {
+		nextSteps.push({
+			action: "Create revalidation webhook: Run `prismic webhook create`",
+		});
 	}
 
-	// All complete
-	return undefined;
+	return nextSteps;
 }
 
 export async function status(): Promise<void> {
@@ -304,25 +340,21 @@ export async function status(): Promise<void> {
 
 	const sections: StatusSection[] = [];
 
-	// Track statuses for next step computation
-	let typeStatuses: TypeWithStatus[] = [];
-	let sliceStatuses: TypeWithStatus[] = [];
-	let slicesWithMissingComponents: string[] = [];
-	let slicesReadyToConnect: string[] = [];
-
 	// Setup section
 	const setupSection = await buildSetupSection(frameworkInfo, installedDeps);
+	setupSection.nextSteps = buildSetupNextSteps(setupSection.items, frameworkInfo);
 	sections.push(setupSection);
 
 	// Types sections (Page Types and Custom Types)
 	if (localTypesResult.ok && remoteTypesResult.ok) {
-		const { pageTypes, customTypes, allTypeStatuses } = buildTypeSections(
+		const { pageTypes, customTypes, pageTypeStatuses, customTypeStatuses } = buildTypeSections(
 			localTypesResult.value,
 			remoteTypesResult.value,
 		);
+		pageTypes.nextSteps = buildTypesNextSteps(pageTypeStatuses);
+		customTypes.nextSteps = buildTypesNextSteps(customTypeStatuses);
 		sections.push(pageTypes);
 		sections.push(customTypes);
-		typeStatuses = allTypeStatuses;
 	}
 
 	// Slices section
@@ -331,17 +363,20 @@ export async function status(): Promise<void> {
 			section: slicesSection,
 			statuses,
 			missingComponents,
-			slicesReadyToConnect: readyToConnect,
+			slicesReadyToConnect,
 		} = await buildSlicesSection(
 			localSlicesResult.value,
 			remoteSlicesResult.value,
 			frameworkInfo,
 			localTypesResult.ok ? localTypesResult.value : [],
 		);
+		slicesSection.nextSteps = buildSlicesNextSteps(
+			statuses,
+			missingComponents,
+			slicesReadyToConnect,
+			frameworkInfo,
+		);
 		sections.push(slicesSection);
-		sliceStatuses = statuses;
-		slicesWithMissingComponents = missingComponents;
-		slicesReadyToConnect = readyToConnect;
 	}
 
 	// Preview section
@@ -350,6 +385,7 @@ export async function status(): Promise<void> {
 		previewsResult.ok ? previewsResult.value : undefined,
 		repoInfoResult.ok ? repoInfoResult.value.simulator_url : undefined,
 	);
+	previewSection.nextSteps = buildPreviewNextSteps(previewSection.items, frameworkInfo);
 	sections.push(previewSection);
 
 	// Deployment section (Next.js only)
@@ -358,6 +394,7 @@ export async function status(): Promise<void> {
 			frameworkInfo,
 			webhooksResult.ok ? webhooksResult.value : [],
 		);
+		deploymentSection.nextSteps = buildDeploymentNextSteps(deploymentSection.items, frameworkInfo);
 		sections.push(deploymentSection);
 	}
 
@@ -365,19 +402,6 @@ export async function status(): Promise<void> {
 	for (const section of sections) {
 		printSection(section);
 	}
-
-	// Print next step
-	const nextStep = computeNextStep(
-		sections,
-		frameworkInfo,
-		typeStatuses,
-		sliceStatuses,
-		slicesWithMissingComponents,
-		slicesReadyToConnect,
-	);
-	if (nextStep) {
-		console.info(`Next: ${nextStep.message}`);
-	}
 }
 
 function printSection(section: StatusSection): void {
@@ -409,6 +433,15 @@ function printSection(section: StatusSection): void {
 		console.info(`  ${CIRCLE} ${item.label}${hint}`);
 	}
 
+	// Print next steps if there are any
+	if (section.nextSteps && section.nextSteps.length > 0) {
+		console.info("");
+		console.info("  Next steps:");
+		for (const step of section.nextSteps) {
+			console.info(`  - ${step.action}`);
+		}
+	}
+
 	console.info("");
 }
 
@@ -561,7 +594,12 @@ function computeTypeStatus<T extends { id: string }>(local: T[], remote: T[]): T
 function buildTypeSections(
 	localTypes: CustomType[],
 	remoteTypes: CustomType[],
-): { pageTypes: StatusSection; customTypes: StatusSection; allTypeStatuses: TypeWithStatus[] } {
+): {
+	pageTypes: StatusSection;
+	customTypes: StatusSection;
+	pageTypeStatuses: TypeWithStatus[];
+	customTypeStatuses: TypeWithStatus[];
+} {
 	const typeStatuses = computeTypeStatus(localTypes, remoteTypes);
 
 	// Separate by format
@@ -594,7 +632,8 @@ function buildTypeSections(
 	return {
 		pageTypes: { title: "Page Types", items: pageTypeItems },
 		customTypes: { title: "Custom Types", items: customTypeItems },
-		allTypeStatuses: typeStatuses,
+		pageTypeStatuses,
+		customTypeStatuses,
 	};
 }
 
@@ -670,6 +709,7 @@ async function buildSlicesSection(
 				slicesReadyToConnect.push(slice.label);
 			}
 		}
+
 		// Check if component is implemented
 		const componentExists = await checkSliceComponent(info, slicesDir, slice.id, extensions);