@posthog/wizard 2.19.0 → 2.20.0

package/dist/{slides-mT2s9wM_.js → slides-BEshbXqG.js}

@@ -1,12 +1,13 @@
-import { g as SERVICE_LABELS, s as logToFile } from "./debug-DnMO6O8O.js";
+import { g as SERVICE_LABELS, s as logToFile } from "./debug-BJu_sS4l.js";
 import { n as isTaskStatus } from "./wizard-ui-YdGFRyu_.js";
-import { r as sessionProperties, t as analytics } from "./analytics-Df-Xb81i.js";
-import { i as buildSession } from "./wizard-session-d27JGRGi.js";
-import { v as AUDIT_SEVERITY_STYLE } from "./agent-interface-CQU6x4Hj.js";
-import { c as computeVisibleRange, d as isObjectBlock, f as Colors, l as isClearBlock, p as Icons, s as TextBlock, u as isLinesBlock } from "./posthog-integration-C8qhJnI3.js";
+import { r as sessionProperties, t as analytics } from "./analytics-C8lJzXjY.js";
+import { i as buildSession } from "./wizard-session-G3VWD6hv.js";
+import { y as AUDIT_SEVERITY_STYLE } from "./agent-interface-B-LAvrNL.js";
+import { c as computeVisibleRange, d as isObjectBlock, f as Colors, l as isClearBlock, p as Icons, s as TextBlock, u as isLinesBlock } from "./posthog-integration-8iTgqy2J.js";
 import { a as getProgramConfig, i as Program, l as getKindMeta, r as PROGRAM_REGISTRY } from "./bin.js";
 import { n as AVAILABLE_FEATURES, o as isAllFeaturesSelected, t as ALL_FEATURE_VALUES } from "./defaults-BNWIWzjc.js";
 import * as fs$1 from "fs";
+import opn from "opn";
 import { Box, Text, measureElement, useInput, useStdout } from "ink";
 import { Component, Fragment, createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -159,8 +160,7 @@ var WizardStore = class {
 		this._initFromProgram(program);
 	}
 	/**
-	* Scan program steps for gate predicates and onInit callbacks.
-	* Creates gate promises and fires init work.
+	* Scan program steps for gate predicates and create gate promises.
 	*/
 	_initFromProgram(program) {
 		const steps = getProgramConfig(program).steps;
@@ -176,6 +176,15 @@ var WizardStore = class {
 				resolved: false
 			});
 		}
+	}
+	/**
+	* Run the program steps' onInit callbacks. startTUI calls this once
+	* the screens are actually rendering — constructing a store alone
+	* (tests, playground) must not fire init work like the health-check
+	* pre-flight, whose probes belong only to flows that show its screen.
+	*/
+	runInitHooks() {
+		const steps = getProgramConfig(this.router.activeProgram).steps;
 		const getSession = () => this.session;
 		const ctx = {
 			get session() {
@@ -487,6 +496,14 @@ var WizardStore = class {
 		this.$session.setKey("mcpSuggestedPromptsDismissed", true);
 		this.emitChange();
 	}
+	setSlackStepDismissed() {
+		this.$session.setKey("slackStepDismissed", true);
+		this.emitChange();
+	}
+	setSlackConnected(connected) {
+		this.$session.setKey("slackConnected", connected);
+		this.emitChange();
+	}
 	setOutroDismissed() {
 		this.$session.setKey("outroDismissed", true);
 		this.emitChange();
@@ -891,6 +908,27 @@ function useKeyBindings(id, bindings) {
 * Key bindings are declared via useKeyBindings, which auto-registers
 * hints in the KeyboardHintsBar.
 */
+/**
+* Step through a column's options in `dir`, wrapping, until an enabled
+* option is found. Returns `from` unchanged if the column is entirely
+* disabled.
+*/
+function stepEnabled(options, rows, from, dir) {
+	const colStart = Math.floor(from / rows) * rows;
+	const colLen = Math.min(rows, options.length - colStart);
+	let row = from % rows;
+	for (let i = 0; i < colLen; i++) {
+		row = (row + dir + colLen) % colLen;
+		const idx = colStart + row;
+		if (!options[idx]?.disabled) return idx;
+	}
+	return from;
+}
+/** Index of the first enabled option, for the initial focus. */
+function firstEnabled(options) {
+	const idx = options.findIndex((o) => !o.disabled);
+	return idx === -1 ? 0 : idx;
+}
 const PickerMenu = ({ message, options, mode = "single", centered = false, columns = 1, optionMarginBottom = 0, onSelect }) => {
 	if (mode === "multi") return /* @__PURE__ */ jsx(MultiPickerMenu, {
 		message,
@@ -911,22 +949,18 @@ const PickerMenu = ({ message, options, mode = "single", centered = false, colum
 };
 /** Custom single-select with triangle indicator and accent highlight. */
 const SinglePickerMenu = ({ message, options, centered = false, columns = 1, optionMarginBottom = 0, onSelect }) => {
-	const [focused, setFocused] = useState(0);
+	const [focused, setFocused] = useState(() => firstEnabled(options));
 	const rows = Math.ceil(options.length / columns);
+	useEffect(() => {
+		if (focused >= options.length || options[focused]?.disabled) setFocused(firstEnabled(options));
+	}, [options, focused]);
 	const bindings = [{
 		match: ["upArrow", "downArrow"],
 		label: "↑↓",
 		action: "navigate",
 		handler: (_input, key) => {
-			const col = Math.floor(focused / rows);
-			const row = focused % rows;
-			if (key.upArrow) if (row > 0) setFocused(col * rows + row - 1);
-			else setFocused(Math.min(col * rows + rows - 1, options.length - 1));
-			if (key.downArrow) {
-				const next = col * rows + row + 1;
-				if (next < options.length && row + 1 < rows) setFocused(next);
-				else setFocused(col * rows);
-			}
+			if (key.upArrow) setFocused(stepEnabled(options, rows, focused, -1));
+			if (key.downArrow) setFocused(stepEnabled(options, rows, focused, 1));
 		}
 	}, {
 		match: "return",
@@ -934,7 +968,7 @@ const SinglePickerMenu = ({ message, options, centered = false, columns = 1, opt
 		action: "select",
 		handler: () => {
 			const selected = options[focused];
-			if (selected) onSelect(selected.value);
+			if (selected && !selected.disabled) onSelect(selected.value);
 		}
 	}];
 	if (columns > 1) bindings.splice(1, 0, {
@@ -944,14 +978,17 @@ const SinglePickerMenu = ({ message, options, centered = false, columns = 1, opt
 		handler: (_input, key) => {
 			const col = Math.floor(focused / rows);
 			const row = focused % rows;
+			let next = focused;
 			if (key.leftArrow) {
 				const prevCol = col > 0 ? col - 1 : columns - 1;
-				setFocused(Math.min(prevCol * rows + row, options.length - 1));
+				next = Math.min(prevCol * rows + row, options.length - 1);
 			}
 			if (key.rightArrow) {
 				const nextCol = col < columns - 1 ? col + 1 : 0;
-				setFocused(Math.min(nextCol * rows + row, options.length - 1));
+				next = Math.min(nextCol * rows + row, options.length - 1);
 			}
+			if (options[next]?.disabled) next = stepEnabled(options, rows, next, 1);
+			setFocused(next);
 		}
 	});
 	useKeyBindings("single-picker", bindings);
@@ -972,16 +1009,23 @@ const SinglePickerMenu = ({ message, options, centered = false, columns = 1, opt
 					return /* @__PURE__ */ jsxs(Box, {
 						gap: 1,
 						marginBottom: optionMarginBottom,
-						children: [/* @__PURE__ */ jsx(Text, {
-							color: isFocused ? Colors.accent : void 0,
-							dimColor: !isFocused,
-							children: isFocused ? Icons.triangleSmallRight : " "
-						}), /* @__PURE__ */ jsx(Text, {
-							color: isFocused ? Colors.accent : void 0,
-							bold: isFocused,
-							dimColor: !isFocused,
-							children: label
-						})]
+						children: [
+							/* @__PURE__ */ jsx(Text, {
+								color: isFocused ? Colors.accent : void 0,
+								dimColor: !isFocused,
+								children: isFocused ? Icons.triangleSmallRight : " "
+							}),
+							opt.icon && /* @__PURE__ */ jsx(Text, {
+								color: opt.icon.color,
+								children: opt.icon.glyph
+							}),
+							/* @__PURE__ */ jsx(Text, {
+								color: opt.disabled ? Colors.muted : isFocused ? Colors.accent : void 0,
+								bold: isFocused && !opt.disabled,
+								dimColor: !isFocused || opt.disabled,
+								children: label
+							})
+						]
 					}, flatIdx);
 				})
 			}, colIdx))
@@ -990,24 +1034,20 @@ const SinglePickerMenu = ({ message, options, centered = false, columns = 1, opt
 };
 /** Custom multi-select with checkbox glyphs and accent highlight. */
 const MultiPickerMenu = ({ message, options, centered = false, columns = 1, optionMarginBottom = 0, onSelect }) => {
-	const [focused, setFocused] = useState(0);
+	const [focused, setFocused] = useState(() => firstEnabled(options));
 	const [selected, setSelected] = useState(/* @__PURE__ */ new Set());
 	const rows = Math.ceil(options.length / columns);
+	useEffect(() => {
+		if (focused >= options.length || options[focused]?.disabled) setFocused(firstEnabled(options));
+	}, [options, focused]);
 	const bindings = [
 		{
 			match: ["upArrow", "downArrow"],
 			label: "↑↓",
 			action: "navigate",
 			handler: (_input, key) => {
-				const col = Math.floor(focused / rows);
-				const row = focused % rows;
-				if (key.upArrow) if (row > 0) setFocused(col * rows + row - 1);
-				else setFocused(Math.min(col * rows + rows - 1, options.length - 1));
-				if (key.downArrow) {
-					const next = col * rows + row + 1;
-					if (next < options.length && row + 1 < rows) setFocused(next);
-					else setFocused(col * rows);
-				}
+				if (key.upArrow) setFocused(stepEnabled(options, rows, focused, -1));
+				if (key.downArrow) setFocused(stepEnabled(options, rows, focused, 1));
 			}
 		},
 		{
@@ -1015,6 +1055,7 @@ const MultiPickerMenu = ({ message, options, centered = false, columns = 1, opti
 			label: "space",
 			action: "toggle",
 			handler: () => {
+				if (options[focused]?.disabled) return;
 				setSelected((prev) => {
 					const next = new Set(prev);
 					if (next.has(focused)) {
@@ -1035,7 +1076,7 @@ const MultiPickerMenu = ({ message, options, centered = false, columns = 1, opti
 			handler: () => {
 				if (selected.size === 0) {
 					const hovered = options[focused];
-					if (hovered) onSelect(hovered.value);
+					if (hovered && !hovered.disabled) onSelect(hovered.value);
 				} else onSelect([...selected].sort().map((i) => options[i].value));
 			}
 		}
@@ -1047,14 +1088,17 @@ const MultiPickerMenu = ({ message, options, centered = false, columns = 1, opti
 		handler: (_input, key) => {
 			const col = Math.floor(focused / rows);
 			const row = focused % rows;
+			let next = focused;
 			if (key.leftArrow) {
 				const prevCol = col > 0 ? col - 1 : columns - 1;
-				setFocused(Math.min(prevCol * rows + row, options.length - 1));
+				next = Math.min(prevCol * rows + row, options.length - 1);
 			}
 			if (key.rightArrow) {
 				const nextCol = col < columns - 1 ? col + 1 : 0;
-				setFocused(Math.min(nextCol * rows + row, options.length - 1));
+				next = Math.min(nextCol * rows + row, options.length - 1);
 			}
+			if (options[next]?.disabled) next = stepEnabled(options, rows, next, 1);
+			setFocused(next);
 		}
 	});
 	useKeyBindings("multi-picker", bindings);
@@ -1079,16 +1123,23 @@ const MultiPickerMenu = ({ message, options, centered = false, columns = 1, opti
 					return /* @__PURE__ */ jsxs(Box, {
 						gap: 1,
 						marginBottom: optionMarginBottom,
-						children: [/* @__PURE__ */ jsx(Text, {
-							color: isSelected ? "white" : Colors.muted,
-							dimColor: !isFocused && !isSelected,
-							children: checkbox
-						}), /* @__PURE__ */ jsx(Text, {
-							color: isFocused ? Colors.accent : void 0,
-							bold: isFocused,
-							dimColor: !isFocused,
-							children: label
-						})]
+						children: [
+							/* @__PURE__ */ jsx(Text, {
+								color: isSelected ? "white" : Colors.muted,
+								dimColor: !isFocused && !isSelected,
+								children: checkbox
+							}),
+							opt.icon && /* @__PURE__ */ jsx(Text, {
+								color: opt.icon.color,
+								children: opt.icon.glyph
+							}),
+							/* @__PURE__ */ jsx(Text, {
+								color: opt.disabled ? Colors.muted : isFocused ? Colors.accent : void 0,
+								bold: isFocused && !opt.disabled,
+								dimColor: !isFocused || opt.disabled,
+								children: label
+							})
+						]
 					}, flatIdx);
 				})
 			}, colIdx))
@@ -2330,6 +2381,12 @@ const TIPS = [
 		title: "Get way more detail using properties",
 		description: "Events and person records can have any properties you want. Track things like how they found your website, what subscription tier they choose, and much more."
 	},
+	{
+		id: "slack",
+		title: "Use PostHog in Slack",
+		description: "Connect the PostHog Slack app to analyze data and ship product changes — deploy flags, open PRs, run queries — just by tagging @PostHog:",
+		url: "https://posthog.com/slack-app"
+	},
 	{
 		id: "stripe",
 		title: "You can track Stripe revenue with PostHog",
@@ -3749,6 +3806,13 @@ var neutralCrossSell = [{
 	"prompt": "List the top errors my users hit this week.",
 	"description": "Built-in error tracking — no separate tool."
 }];
+var slackApp = {
+	"learnMoreUrl": "https://posthog.com/slack-app",
+	"setupUrl": "https://app.posthog.com/settings/project-integrations#integration-slack",
+	"headline": "Take PostHog to Slack",
+	"pitch": "You can also analyze product data and ship changes.",
+	"capabilities": ["Tag @PostHog with a bug, edit, or a feature idea. It will spin up a sandboxed environment, plan, edit files, run tests, and open a draft PR.", "Tag @PostHog with any data question. It's the same SQL-writing, statistically-minded assistant as PostHog AI, but it responds where you send work memes."]
+};
 //#endregion
 //#region src/lib/mcp-role-prompts.ts
 /**
@@ -3783,6 +3847,7 @@ const GENERIC_FOLLOW_UPS = genericFollowUps;
 const DEEP_DIVE_FOLLOW_UPS = deepDiveFollowUps;
 const CROSS_SELL_BY_ROLE = crossSellByRole;
 const NEUTRAL_CROSS_SELL = neutralCrossSell;
+const SLACK_APP = slackApp;
 const INTEGRATION_FAMILY = {
 	nextjs: "fullstack",
 	nuxt: "fullstack",
@@ -3896,6 +3961,20 @@ function getCrossSellPrompts(role) {
 	if (!isTailoredRole(role)) return NEUTRAL_CROSS_SELL;
 	return CROSS_SELL_BY_ROLE[role];
 }
+/**
+* Resolve the "Take PostHog to Slack" card. Role-independent — the Slack
+* agent's two capabilities (code/PR + data) describe the product itself,
+* not role-specific examples.
+*/
+function getSlackAppCard() {
+	return {
+		headline: SLACK_APP.headline,
+		pitch: SLACK_APP.pitch,
+		learnMoreUrl: SLACK_APP.learnMoreUrl,
+		setupUrl: SLACK_APP.setupUrl,
+		capabilities: SLACK_APP.capabilities
+	};
+}
 //#endregion
 //#region src/ui/tui/screens/McpSuggestedPromptsScreen.tsx
 /**
@@ -3936,6 +4015,25 @@ function getCrossSellPrompts(role) {
 * forces a successful login first). A defensive throw protects the
 * Running useEffect against a state-machine bug.
 */
+var Phase = /* @__PURE__ */ function(Phase) {
+	Phase["Choose"] = "choose";
+	Phase["Authenticating"] = "authenticating";
+	Phase["Greeting"] = "greeting";
+	Phase["PromptPicker"] = "prompt-picker";
+	Phase["Running"] = "running";
+	Phase["FollowUp"] = "follow-up";
+	/** Final beat on every dismissal — reminds the user how to keep
+	*  talking to PostHog after the tutorial ends. */
+	Phase["Goodbye"] = "goodbye";
+	Phase["Done"] = "done";
+	return Phase;
+}(Phase || {});
+var ChoiceValue = /* @__PURE__ */ function(ChoiceValue) {
+	ChoiceValue["Login"] = "login";
+	ChoiceValue["ConnectSlack"] = "connect-slack";
+	ChoiceValue["Exit"] = "exit";
+	return ChoiceValue;
+}(ChoiceValue || {});
 const MAX_PROMPT_RUNS = 5;
 const FOLLOW_UP_DELAY_MS = 3e3;
 const McpSuggestedPromptsScreen = ({ store, services }) => {
@@ -3944,8 +4042,9 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 	const kit = getRolePrompts(session.roleAtOrganization, session.integration);
 	const crossSell = useMemo(() => getCrossSellPrompts(session.roleAtOrganization), [session.roleAtOrganization]);
 	const greeting = useMemo(() => getRoleGreeting(session.roleAtOrganization), [session.roleAtOrganization]);
-	const [phase, setPhase] = useState("choose");
+	const [phase, setPhase] = useState(() => store.session.credentials ? "choose" : "authenticating");
 	const [loginError, setLoginError] = useState(null);
+	const startedTutorialRef = useRef(false);
 	const [runningPrompt, setRunningPrompt] = useState(null);
 	const [runChunks, setRunChunks] = useState([]);
 	const [runStartedAt, setRunStartedAt] = useState(null);
@@ -3967,7 +4066,7 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 				store.setRoleAtOrganization(roleAtOrganization);
 				store.setApiUser(user);
 				store.setLoginUrl(null);
-				setPhase("greeting");
+				setPhase(startedTutorialRef.current ? "greeting" : "choose");
 			} catch (err) {
 				if (cancelled) return;
 				const message = err instanceof Error ? err.message : String(err);
@@ -3985,6 +4084,28 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 		services,
 		store
 	]);
+	const credentials = session.credentials;
+	const slackConnected = session.slackConnected;
+	useEffect(() => {
+		if (!credentials || slackConnected !== null) return;
+		let cancelled = false;
+		const controller = new AbortController();
+		services.checkSlackConnected(credentials, controller.signal).then((connected) => {
+			if (!cancelled) store.setSlackConnected(connected);
+		}).catch((err) => {
+			if (cancelled) return;
+			analytics.captureException(err instanceof Error ? err : new Error(String(err)), { step: "slack_connected_check" });
+		});
+		return () => {
+			cancelled = true;
+			controller.abort();
+		};
+	}, [
+		credentials,
+		slackConnected,
+		services,
+		store
+	]);
 	useEffect(() => {
 		if (phase !== "running") return;
 		if (!runningPrompt) return;
@@ -4070,7 +4191,11 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 		setLoginError(null);
 		if (choice === "login") {
 			analytics.wizardCapture("mcp suggested prompts choose", { choice: "login" });
-			setPhase("authenticating");
+			startedTutorialRef.current = true;
+			setPhase(session.credentials ? "greeting" : "authenticating");
+		} else if (choice === "connect-slack") {
+			analytics.wizardCapture("mcp suggested prompts choose", { choice: "connect-slack" });
+			opn(getSlackAppCard().setupUrl, { wait: false }).catch(() => {});
 		} else {
 			analytics.wizardCapture("mcp suggested prompts choose", { choice: "exit" });
 			enterGoodbye();
@@ -4106,9 +4231,10 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 		{
 			match: "escape",
 			label: "esc",
-			action: phase === "goodbye" ? "close" : "exit",
+			action: phase === "goodbye" ? "close" : phase === "authenticating" ? "cancel" : "exit",
 			handler: () => {
 				if (phase === "goodbye") closeWizard();
+				else if (phase === "authenticating") setPhase("choose");
 				else if (phase === "running" || phase === "prompt-picker" || phase === "follow-up" || phase === "greeting") enterGoodbye();
 			}
 		},
@@ -4142,6 +4268,7 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 			children: [
 				phase === "choose" && /* @__PURE__ */ jsx(ChoosePhase, {
 					error: loginError,
+					slackConnected,
 					onSelect: handleChoice
 				}),
 				phase === "authenticating" && /* @__PURE__ */ jsx(AuthenticatingPhase, { loginUrl: session.loginUrl }),
@@ -4204,71 +4331,112 @@ const McpSuggestedPromptsScreen = ({ store, services }) => {
 		})
 	});
 };
-const ChoosePhase = ({ error, onSelect }) => /* @__PURE__ */ jsxs(Box, {
-	flexDirection: "column",
-	children: [
-		/* @__PURE__ */ jsx(Text, {
-			bold: true,
-			color: Colors.accent,
-			children: "PostHog MCP"
-		}),
-		/* @__PURE__ */ jsx(Box, {
-			marginTop: 1,
-			children: /* @__PURE__ */ jsx(Text, { children: "With MCP your agent works directly with the PostHog platform. You can prompt it to:" })
-		}),
-		/* @__PURE__ */ jsxs(Box, {
-			marginTop: 1,
-			flexDirection: "column",
-			children: [
-				/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
-					color: "cyan",
-					children: Icons.diamond
-				}), " Build dashboards"] }),
-				/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
-					color: "cyan",
-					children: Icons.diamond
-				}), " Run SQL queries"] }),
-				/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
-					color: "cyan",
-					children: Icons.diamond
-				}), " Deploy feature flags"] }),
-				/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
-					color: "cyan",
-					children: Icons.diamond
-				}), " Debug exceptions and errors"] }),
-				/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
-					color: "cyan",
-					children: Icons.diamond
-				}), " And lots more..."] })
-			]
-		}),
-		/* @__PURE__ */ jsx(Box, {
-			marginTop: 1,
-			children: /* @__PURE__ */ jsx(Text, { children: "Want a live demo using real data from your project?" })
-		}),
-		/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(PickerMenu, {
-			options: [{
-				label: "Start MCP tutorial",
-				value: "login"
-			}, {
-				label: "Exit",
-				value: "exit"
-			}],
-			onSelect
-		}) }),
-		error && /* @__PURE__ */ jsx(Box, {
-			marginTop: 1,
-			children: /* @__PURE__ */ jsxs(Text, {
-				color: "red",
+const ChoosePhase = ({ error, slackConnected, onSelect }) => {
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				color: Colors.accent,
+				children: "PostHog MCP"
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				marginTop: 1,
+				children: /* @__PURE__ */ jsx(Text, { children: "With MCP your agent works directly with the PostHog platform. You can prompt it to:" })
+			}),
+			/* @__PURE__ */ jsxs(Box, {
+				marginTop: 1,
+				flexDirection: "column",
 				children: [
-					"Login failed: ",
-					error,
-					". Try again or exit."
+					/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
+						color: "cyan",
+						children: Icons.diamond
+					}), " Build dashboards"] }),
+					/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
+						color: "cyan",
+						children: Icons.diamond
+					}), " Run SQL queries"] }),
+					/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
+						color: "cyan",
+						children: Icons.diamond
+					}), " Deploy feature flags"] }),
+					/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
+						color: "cyan",
+						children: Icons.diamond
+					}), " Debug exceptions and errors"] }),
+					/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
+						color: "cyan",
+						children: Icons.diamond
+					}), " And lots more..."] })
 				]
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				marginTop: 1,
+				flexDirection: "column",
+				children: slackConnected ? /* @__PURE__ */ jsxs(Text, { children: [
+					/* @__PURE__ */ jsx(Text, {
+						color: Colors.success,
+						children: Icons.check
+					}),
+					" Slack is connected — analyze data and ship product changes there by tagging",
+					" ",
+					/* @__PURE__ */ jsx(Text, {
+						bold: true,
+						children: "@PostHog"
+					}),
+					"."
+				] }) : /* @__PURE__ */ jsxs(Text, { children: [
+					"You can also connect PostHog to Slack, so you can analyze data and ship product changes there by tagging ",
+					/* @__PURE__ */ jsx(Text, {
+						bold: true,
+						children: "@PostHog"
+					}),
+					"."
+				] })
+			}),
+			/* @__PURE__ */ jsx(Box, {
+				marginTop: 1,
+				children: /* @__PURE__ */ jsx(Text, { children: "Want a live demo using real data from your project?" })
+			}),
+			/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(PickerMenu, {
+				options: [
+					{
+						label: "Start MCP tutorial",
+						value: "login"
+					},
+					slackConnected ? {
+						label: "Already connected to Slack",
+						value: "connect-slack",
+						icon: {
+							glyph: Icons.check,
+							color: Colors.success
+						},
+						disabled: true
+					} : {
+						label: "Connect Slack now",
+						value: "connect-slack"
+					},
+					{
+						label: "Exit",
+						value: "exit"
+					}
+				],
+				onSelect
+			}) }),
+			error && /* @__PURE__ */ jsx(Box, {
+				marginTop: 1,
+				children: /* @__PURE__ */ jsxs(Text, {
+					color: "red",
+					children: [
+						"Login failed: ",
+						error,
+						". Try again or exit."
+					]
+				})
 			})
-		})
-	]
-});
+		]
+	});
+};
 const AuthenticatingPhase = ({ loginUrl }) => /* @__PURE__ */ jsxs(Box, {
 	flexDirection: "column",
 	children: [/* @__PURE__ */ jsx(LoadingBox, { message: "Waiting for authentication..." }), loginUrl && /* @__PURE__ */ jsx(Box, {
@@ -4606,7 +4774,7 @@ const GoodbyePhase = ({ installedClients, role, integration, engaged, onClose })
 					label: "Close",
 					value: "close"
 				}],
-				onSelect: onClose
+				onSelect: () => onClose()
 			})
 		]
 	});
@@ -5472,6 +5640,6 @@ const AUDIT_3000_AREA_SLIDES = [
 	}
 ];
 //#endregion
-export { WizardStore as A, useStdoutDimensions as C, LoadingBox as D, ProgressList as E, SplitView as O, GroupedPickerMenu as S, useKeyBindings as T, ScreenContainer as _, McpSuggestedPromptsScreen as a, ModalOverlay as b, IssueTable as c, ServiceHealthList as d, TipsCard as f, TabContainer as g, HNViewer as h, AuditChecksViewer as i, CardLayout as k, SEVERITY_LABEL as l, ContentSequencer as m, AUDIT_AREA_SLIDES as n, TAILORED_ROLES as o, LearnCard as p, VisualBox as r, McpScreen as s, AUDIT_3000_AREA_SLIDES as t, SEVERITY_ORDER as u, EventPlanViewer as v, PickerMenu as w, ConfirmationInput as x, LogViewer as y };
+export { CardLayout as A, GroupedPickerMenu as C, ProgressList as D, useKeyBindings as E, LoadingBox as O, ConfirmationInput as S, PickerMenu as T, TabContainer as _, McpSuggestedPromptsScreen as a, LogViewer as b, McpScreen as c, SEVERITY_ORDER as d, ServiceHealthList as f, HNViewer as g, ContentSequencer as h, AuditChecksViewer as i, WizardStore as j, SplitView as k, IssueTable as l, LearnCard as m, AUDIT_AREA_SLIDES as n, TAILORED_ROLES as o, TipsCard as p, VisualBox as r, getSlackAppCard as s, AUDIT_3000_AREA_SLIDES as t, SEVERITY_LABEL as u, ScreenContainer as v, useStdoutDimensions as w, ModalOverlay as x, EventPlanViewer as y };
 
-//# sourceMappingURL=slides-mT2s9wM_.js.map
+//# sourceMappingURL=slides-BEshbXqG.js.map