feat(init): enforce canonical feature display order (#388)

## Summary

Sorts the feature multi-select prompt into a fixed display order instead
of relying on whatever the server sends. Also tweaks a couple of feature
labels/hints for clarity.

**Display order**: Errors → Replay → Tracing → Logs → Metrics →
Profiling → Source Maps

## Changes

- Add `FEATURE_DISPLAY_ORDER` constant and `sortFeatures()` helper in
`clack-utils.ts`
- Apply sorting in `handleMultiSelect()` before rendering the prompt
- Minor copy tweaks: "Performance Monitoring" → "Performance Monitoring
(Tracing)", drop "Automatic" from error monitoring hint

## Test plan

- `bun run typecheck` passes
- `bun test` passes (no regressions)
- Manual: run `bun run dev` against staging API, confirm multi-select
shows features in the expected order

--------

Author: betegon

src/lib/init/clack-utils.ts

@@ -27,10 +27,10 @@ export function abortIfCancelled<T>(value: T | symbol): T {
 const FEATURE_INFO: Record<string, { label: string; hint: string }> = {
   errorMonitoring: {
     label: "Error Monitoring",
-    hint: "Automatic error and crash reporting",
+    hint: "Error and crash reporting",
   },
   performanceMonitoring: {
-    label: "Performance Monitoring",
+    label: "Performance Monitoring (Tracing)",
     hint: "Transaction and span tracing",
   },
   sessionReplay: {
@@ -57,6 +57,28 @@ export function featureHint(id: string): string | undefined {
   return FEATURE_INFO[id]?.hint;
 }
 
+const FEATURE_DISPLAY_ORDER = [
+  "errorMonitoring",
+  "sessionReplay",
+  "performanceMonitoring",
+  "logs",
+  "metrics",
+  "profiling",
+  "sourceMaps",
+];
+
+/** Sort features into canonical display order for the multi-select prompt. */
+export function sortFeatures(features: string[]): string[] {
+  return features.slice().sort((a, b) => {
+    const ai = FEATURE_DISPLAY_ORDER.indexOf(a);
+    const bi = FEATURE_DISPLAY_ORDER.indexOf(b);
+    return (
+      (ai === -1 ? Number.MAX_SAFE_INTEGER : ai) -
+      (bi === -1 ? Number.MAX_SAFE_INTEGER : bi)
+    );
+  });
+}
+
 export const STEP_LABELS: Record<string, string> = {
   "discover-context": "Analyzing project structure",
   "select-target-app": "Selecting target application",

src/lib/init/interactive.ts

@@ -8,7 +8,12 @@
 
 import { confirm, log, multiselect, select } from "@clack/prompts";
 import chalk from "chalk";
-import { abortIfCancelled, featureHint, featureLabel } from "./clack-utils.js";
+import {
+  abortIfCancelled,
+  featureHint,
+  featureLabel,
+  sortFeatures,
+} from "./clack-utils.js";
 import { REQUIRED_FEATURE } from "./constants.js";
 import type {
   ConfirmPayload,
@@ -90,7 +95,9 @@ async function handleMultiSelect(
     return { features: available };
   }
 
-  const optional = available.filter((f) => f !== REQUIRED_FEATURE);
+  const optional = sortFeatures(
+    available.filter((f) => f !== REQUIRED_FEATURE)
+  );
 
   if (optional.length === 0) {
     if (hasRequired) {

test/lib/init/clack-utils.test.ts

@@ -46,7 +46,7 @@ describe("featureLabel", () => {
   test("returns label for known feature", () => {
     expect(featureLabel("errorMonitoring")).toBe("Error Monitoring");
     expect(featureLabel("performanceMonitoring")).toBe(
-      "Performance Monitoring"
+      "Performance Monitoring (Tracing)"
     );
     expect(featureLabel("logs")).toBe("Logging");
   });
@@ -58,9 +58,7 @@ describe("featureLabel", () => {
 
 describe("featureHint", () => {
   test("returns hint for known feature", () => {
-    expect(featureHint("errorMonitoring")).toBe(
-      "Automatic error and crash reporting"
-    );
+    expect(featureHint("errorMonitoring")).toBe("Error and crash reporting");
     expect(featureHint("sessionReplay")).toBe("Visual replay of user sessions");
   });