import type { ExtensionAPI, ExtensionContext } from "@earendil-works/pi-coding-agent";
import { getSettingsListTheme } from "@earendil-works/pi-coding-agent";
import {
	type AutocompleteItem,
	Key,
	matchesKey,
	type SettingItem,
	SettingsList,
	type SettingsListTheme,
	truncateToWidth,
} from "@earendil-works/pi-tui";
import {
	type ColorSource,
	type ColorSourcesConfig,
	type ContextStyle,
	type ExtensionStatusColorMode,
	type ExtensionStatusPlacement,
	type FooterRowsConfig,
	type FooterSegmentsConfig,
	type GitBranchConfig,
	type GitBranchMaxLength,
	getExtensionStatusColorMode,
	getExtensionStatusPlacement,
	type IconMode,
	isExtensionStatusColorMode,
	isExtensionStatusPlacement,
	isSeparatorStyle,
	type PathDisplayConfig,
	type PathDisplayMode,
	type PolishedTuiConfig,
	type SeparatorStyle,
	type UiFeaturesConfig,
} from "../config/config.js";
import { sanitizeExtensionStatusText } from "../segments/extension-status.js";
import { isIconMode } from "../ui/icons.js";
import { safeThemeFg } from "../ui/style.js";

const colorSourceValues: ColorSource[] = ["theme", "terminal"];
const extensionStatusPlacementValues: ExtensionStatusPlacement[] = [
	"off",
	"left",
	"middle",
	"right",
];
const extensionStatusColorModeValues: ExtensionStatusColorMode[] = ["zentui", "original"];
const contextStyleValues: ContextStyle[] = ["text", "gauge", "text+gauge"];
const separatorStyleValues: SeparatorStyle[] = ["pipe", "dot", "chevron", "none"];
const pathDisplayModeValues: PathDisplayMode[] = ["basename", "full"];
const pathDepthValues = ["0", "1", "2", "3", "4", "5"] as const;
const branchLengthPresetValues = ["full", "10", "20", "30", "40", "50"] as const;
const iconModeValues: IconMode[] = ["auto", "nerd", "ascii"];
type FeatureState = "enabled" | "disabled";

const featureStateValues: FeatureState[] = ["enabled", "disabled"];
const settingsSections = [
	"coloring",
	"features",
	"layout",
	"builtinSegments",
	"extensionSegments",
] as const;

type ColorSettingId = "starship";
type FeatureSettingId = keyof UiFeaturesConfig;
type FooterSegmentSettingId = keyof FooterSegmentsConfig;
type SettingsSection = (typeof settingsSections)[number];
type LayoutSettingId =
	"contextStyle" | "separator" | "pathDisplay" | "pathDepth" | "branchLength" | "iconMode";

type SettingsCommandDeps = {
	getConfig: () => PolishedTuiConfig;
	setColorSources: (patch: Partial<ColorSourcesConfig>) => void;
	setUiFeatures: (patch: Partial<UiFeaturesConfig>, ctx: ExtensionContext) => void;
	setFooterRows: (patch: Partial<FooterRowsConfig>) => void;
	setFooterSegments: (patch: Partial<FooterSegmentsConfig>) => void;
	setFooterFormat: (value: string) => void;
	setIconMode: (mode: IconMode) => void;
	setContextStyle: (style: ContextStyle) => void;
	setSeparator: (separator: SeparatorStyle) => void;
	setPathDisplay: (patch: Partial<PathDisplayConfig>) => void;
	setGitBranch: (patch: Partial<GitBranchConfig>) => void;
	getActiveExtensionStatuses: () => ReadonlyMap<string, string>;
	setExtensionStatusPlacement: (key: string, placement: ExtensionStatusPlacement) => void;
	setExtensionStatusColorMode: (key: string, colorMode: ExtensionStatusColorMode) => void;
	requestRender: () => void;
	settingsListTheme?: SettingsListTheme;
};

const colorSettingLabels: Record<ColorSettingId, string> = {
	starship: "Footer colors",
};

const colorSettingDescriptions: Record<ColorSettingId, string> = {
	starship:
		"Choose whether footer runtime/git/context colors use Pi theme tokens or terminal palette styles.",
};

const featureSettingLabels: Record<FeatureSettingId, string> = {
	statusLine: "Status line",
};

const featureSettingDescriptions: Record<FeatureSettingId, string> = {
	statusLine: "Enable or disable Zentui's custom footer/status line.",
};

const footerRowLabels: Record<keyof FooterRowsConfig, string> = {
	project: "Project row",
	session: "Session row",
	activity: "Activity row",
	usage: "Usage row",
};

const footerSegmentSettingLabels: Record<FooterSegmentSettingId, string> = {
	cwd: "Current directory",
	gitBranch: "Git branch",
	gitStatus: "Git status",
	gitState: "Git operation state",
	gitCounts: "Git counts",
	gitCommit: "Git commit",
	gitMetrics: "Git line metrics",
	runtime: "Runtime",
	packageVersion: "Package version",
	configCounts: "Config counts",
	os: "OS icon",
	username: "Username@host",
	sessionName: "Session name",
	model: "Model",
	thinking: "Thinking level",
	turnCount: "Turn count",
	sessionDuration: "Session duration",
	runningTools: "Running tools",
	toolCounts: "Completed tool counts",
	activeAgents: "Active agents",
	agentIdle: "Agent idle status",
	skills: "Skill activity",
	mcp: "MCP connections",
	context: "Context usage",
	inputTokens: "Input tokens",
	outputTokens: "Output tokens",
	cacheDetails: "Cache details",
	cost: "Session cost",
	codexUsage: "Codex subscription",
	time: "Current time",
};

const footerSegmentSettingDescriptions: Record<FooterSegmentSettingId, string> = {
	cwd: "Show or hide the current working directory on the project row.",
	gitBranch: "Show or hide the git branch name on the project row.",
	gitStatus: "Show or hide git status icons and ahead/behind markers on the project row.",
	gitState: "Show or hide Git operation states such as MERGING and REBASING.",
	gitCounts:
		"Show numeric ahead/behind and stash counts (requires the Git status segment to be enabled).",
	sessionDuration: "Show session running time on the session row.",
	username: "Show user@hostname on the project row.",
	time: "Show the current time (HH:MM) on the usage row.",
	os: "Show an operating-system icon on the project row.",
	runtime: "Show or hide the detected runtime/language on the project row.",
	context: "Show or hide context usage on the usage row.",
	inputTokens: "Show or hide cumulative input tokens on the usage row.",
	outputTokens: "Show or hide cumulative output tokens on the usage row.",
	cost: "Show or hide session cost on the usage row.",
	packageVersion:
		"Show the project’s own manifest version (package.json, Cargo.toml, pyproject.toml, …) on the project row. Distinct from the installed toolchain version.",
	gitCommit:
		"Show the current commit hash and optional exact-match tag on the project row. Starship `git_commit`-style; default off.",
	gitMetrics:
		"Show aggregate added/deleted line counts (e.g. `+ 12 − 3`) on the project row via `git diff HEAD --numstat`; default off.",
	sessionName: "Show the current Pi session name on the session row.",
	model: "Show provider/model information on the session row.",
	thinking: "Show the selected thinking level on the session row for reasoning-capable models.",
	turnCount: "Show the current turn index on the session row.",
	cacheDetails: "Show cumulative cache read/write token totals on the usage row.",
	codexUsage: "Show OpenAI Codex subscription rate limits on the usage row when available.",
	configCounts: "Show instruction-file and installed Pi package counts on the project row.",
	skills: "Show active/available Pi skill counts on the activity row.",
	mcp: "Show parsed MCP connected/total server counts on the activity row.",
	runningTools: "Show currently running native tools and their elapsed time.",
	toolCounts: "Show cumulative completed native-tool counts.",
	activeAgents: "Show active main agent runs on the activity row (not subagent count).",
	agentIdle: "Show Agent idle when no main agent run is active.",
};

const directCommandSuggestions = [
	"statusline enable",
	"statusline disable",
	"statusline toggle",
	...Object.keys(footerRowLabels).flatMap((row) => [
		`row ${row} enable`,
		`row ${row} disable`,
		`row ${row} toggle`,
	]),
	"format clear",
	"format $cwd on $git_branch $fill $context",
	"format $cwd( on $git_branch)($git_status)$fill($context)( | $cost)",
];

const sectionLabels: Record<SettingsSection, string> = {
	coloring: "Coloring",
	features: "Features",
	layout: "Layout",
	builtinSegments: "Built-in segments",
	extensionSegments: "Extension segments",
};

const thirdPartyStatusSettingPrefix = "thirdPartyStatus:";
const footerSegmentSettingPrefix = "footerSegment:";
type ThirdPartyStatusSettingKind = "placement" | "colorMode";

function isColorSource(value: string): value is ColorSource {
	return value === "theme" || value === "terminal";
}

function isColorSettingId(value: string): value is ColorSettingId {
	return value === "starship";
}

function isFeatureSettingId(value: string): value is FeatureSettingId {
	return value === "statusLine";
}

function isFooterSegmentSettingId(value: string): value is FooterSegmentSettingId {
	return (
		value === "cwd" ||
		value === "gitBranch" ||
		value === "gitStatus" ||
		value === "gitState" ||
		value === "gitCounts" ||
		value === "sessionDuration" ||
		value === "runtime" ||
		value === "context" ||
		value === "inputTokens" ||
		value === "outputTokens" ||
		value === "cost" ||
		value === "username" ||
		value === "time" ||
		value === "os" ||
		value === "packageVersion" ||
		value === "gitCommit" ||
		value === "gitMetrics" ||
		value === "sessionName" ||
		value === "model" ||
		value === "thinking" ||
		value === "turnCount" ||
		value === "cacheDetails" ||
		value === "codexUsage" ||
		value === "configCounts" ||
		value === "skills" ||
		value === "mcp" ||
		value === "runningTools" ||
		value === "toolCounts" ||
		value === "activeAgents" ||
		value === "agentIdle"
	);
}

function isFeatureState(value: string): value is FeatureState {
	return value === "enabled" || value === "disabled";
}

function isContextStyle(value: string): value is ContextStyle {
	return value === "text" || value === "gauge" || value === "text+gauge";
}

function isPathDisplayMode(value: string): value is PathDisplayMode {
	return value === "basename" || value === "full";
}

function isPathDepthValue(value: string): boolean {
	return (pathDepthValues as readonly string[]).includes(value);
}

function parseGitBranchLengthValue(value: string): GitBranchMaxLength | undefined {
	if (value === "full") return value;
	const parsed = Number(value);
	return Number.isInteger(parsed) && parsed > 0 ? parsed : undefined;
}

function branchLengthValues(maxLength: GitBranchMaxLength): string[] {
	const current = String(maxLength);
	return (branchLengthPresetValues as readonly string[]).includes(current)
		? [...branchLengthPresetValues]
		: [current, ...branchLengthPresetValues];
}

function isLayoutSettingId(value: string): value is LayoutSettingId {
	return (
		value === "contextStyle" ||
		value === "separator" ||
		value === "pathDisplay" ||
		value === "pathDepth" ||
		value === "branchLength" ||
		value === "iconMode"
	);
}

function patchForSetting(_id: ColorSettingId, value: ColorSource): Partial<ColorSourcesConfig> {
	return { starship: value };
}

function featureValue(enabled: boolean): FeatureState {
	return enabled ? "enabled" : "disabled";
}

function featurePatch(id: FeatureSettingId, value: FeatureState): Partial<UiFeaturesConfig> {
	return { [id]: value === "enabled" } as Partial<UiFeaturesConfig>;
}

function footerSegmentSettingId(key: FooterSegmentSettingId): string {
	return `${footerSegmentSettingPrefix}${key}`;
}

function footerSegmentSettingFromId(id: string): FooterSegmentSettingId | undefined {
	if (!id.startsWith(footerSegmentSettingPrefix)) return undefined;
	const key = id.slice(footerSegmentSettingPrefix.length);
	return isFooterSegmentSettingId(key) ? key : undefined;
}

function footerSegmentPatch(
	id: FooterSegmentSettingId,
	value: FeatureState,
): Partial<FooterSegmentsConfig> {
	return { [id]: value === "enabled" } as Partial<FooterSegmentsConfig>;
}

function usageText(): string {
	return 'Usage: /zentui statusline [enable|disable|toggle], /zentui row [project|session|activity|usage] [enable|disable|toggle], or /zentui format "<template>"';
}

function isFooterRow(value: string): value is keyof FooterRowsConfig {
	return value === "project" || value === "session" || value === "activity" || value === "usage";
}

function parseDirectRowCommand(
	args: string,
	config: PolishedTuiConfig,
): { row: keyof FooterRowsConfig; enabled: boolean } | undefined {
	const normalized = args.trim().toLowerCase().replaceAll(/[_-]+/g, " ");
	const [command, row, action, ...rest] = normalized.split(/\s+/g);
	if (command !== "row" || !row || !isFooterRow(row) || !action || rest.length > 0) {
		return undefined;
	}
	if (action !== "enable" && action !== "disable" && action !== "toggle") return undefined;

	return {
		row,
		enabled: action === "toggle" ? !config.footerRows[row] : action === "enable",
	};
}

function parseDirectFeatureCommand(
	args: string,
	config: PolishedTuiConfig,
): { feature: FeatureSettingId; enabled: boolean } | undefined {
	const normalized = args.trim().toLowerCase().replaceAll(/[_-]+/g, " ");
	if (!normalized) return undefined;

	const words = normalized.split(/\s+/g).filter(Boolean);
	const hasWord = (value: string) => words.includes(value);
	const feature =
		hasWord("footer") || hasWord("statusline") || hasWord("status") ? "statusLine" : undefined;
	const action = hasWord("toggle")
		? "toggle"
		: hasWord("enable") || hasWord("enabled") || hasWord("on")
			? "enable"
			: hasWord("disable") || hasWord("disabled") || hasWord("off")
				? "disable"
				: undefined;

	if (!feature || !action) return undefined;

	return {
		feature,
		enabled: action === "toggle" ? !config.features[feature] : action === "enable",
	};
}

function parseFormatCommand(args: string): { value: string | undefined } | undefined {
	const trimmed = args.trim();
	if (!trimmed.toLowerCase().startsWith("format")) return undefined;

	const rest = trimmed.slice("format".length).trim();
	if (!rest || rest.toLowerCase() === "clear") return { value: undefined };

	const unquoted =
		rest.startsWith('"') && rest.endsWith('"') && rest.length >= 2 ? rest.slice(1, -1) : rest;
	return { value: unquoted };
}

function argumentCompletions(prefix: string): AutocompleteItem[] | null {
	const trimmedPrefix = prefix.trimStart().toLowerCase();
	const items = directCommandSuggestions.map((value) => ({ value, label: value }));
	const matches = items.filter((item) => item.value.startsWith(trimmedPrefix));
	return matches.length > 0 ? matches : null;
}

function thirdPartyStatusSettingId(key: string, kind: ThirdPartyStatusSettingKind): string {
	return `${thirdPartyStatusSettingPrefix}${kind}:${key}`;
}

function thirdPartyStatusSettingFromId(
	id: string,
): { kind: ThirdPartyStatusSettingKind; key: string } | undefined {
	if (!id.startsWith(thirdPartyStatusSettingPrefix)) return undefined;
	const rest = id.slice(thirdPartyStatusSettingPrefix.length);
	const separatorIndex = rest.indexOf(":");
	if (separatorIndex < 0) return undefined;

	const kind = rest.slice(0, separatorIndex);
	if (kind !== "placement" && kind !== "colorMode") return undefined;

	return { kind, key: rest.slice(separatorIndex + 1) };
}

function buildItems(
	section: SettingsSection,
	config: PolishedTuiConfig,
	activeStatuses: ReadonlyMap<string, string>,
): SettingItem[] {
	if (section === "coloring") {
		return (Object.keys(colorSettingLabels) as ColorSettingId[]).map((key) => ({
			id: key,
			label: colorSettingLabels[key],
			description: colorSettingDescriptions[key],
			currentValue: config.colorSources.starship,
			values: colorSourceValues,
		}));
	}

	if (section === "features") {
		return (Object.keys(featureSettingLabels) as FeatureSettingId[]).map((key) => ({
			id: key,
			label: featureSettingLabels[key],
			description: featureSettingDescriptions[key],
			currentValue: featureValue(config.features[key]),
			values: featureStateValues,
		}));
	}
	if (section === "layout") {
		return [
			{
				id: "contextStyle",
				label: "Context style",
				description: "Render context as text, a gauge bar, or both.",
				currentValue: config.contextStyle,
				values: contextStyleValues,
			},
			{
				id: "separator",
				label: "Separator",
				description: "Choose the separator between default footer segments.",
				currentValue: config.separator,
				values: separatorStyleValues,
			},
			{
				id: "pathDisplay",
				label: "Path display",
				description: "Show cwd as basename or full path (home contracted to ~).",
				currentValue: config.pathDisplay.mode,
				values: pathDisplayModeValues,
			},
			{
				id: "pathDepth",
				label: "Path depth",
				description:
					"In full mode, trailing directories to show (0 = all, max 5). Ignored for basename.",
				currentValue: String(config.pathDisplay.depth),
				values: [...pathDepthValues],
			},
			{
				id: "branchLength",
				label: "Branch length",
				description: "Show the full branch name or truncate it to a preset visible width.",
				currentValue: String(config.gitBranch.maxLength),
				values: branchLengthValues(config.gitBranch.maxLength),
			},
			{
				id: "iconMode",
				label: "Icon mode",
				description: "auto/nerd use Nerd Font glyphs; ascii uses plain fallbacks.",
				currentValue: config.icons.mode,
				values: iconModeValues,
			},
		];
	}

	if (section === "builtinSegments") {
		return (Object.keys(footerSegmentSettingLabels) as FooterSegmentSettingId[]).map((key) => ({
			id: footerSegmentSettingId(key),
			label: footerSegmentSettingLabels[key],
			description: footerSegmentSettingDescriptions[key],
			currentValue: featureValue(config.footerSegments[key]),
			values: featureStateValues,
		}));
	}

	const statuses = Array.from(activeStatuses.entries()).sort(([a], [b]) =>
		a < b ? -1 : a > b ? 1 : 0,
	);
	if (statuses.length === 0) {
		return [
			{
				id: "noThirdPartyStatuses",
				label: "No active statuses",
				description: "This tab only lists statuses currently published through ctx.ui.setStatus().",
				currentValue: "—",
			},
		];
	}

	return statuses.flatMap(([key, value]) => {
		const sanitizedText = sanitizeExtensionStatusText(value);
		const description = sanitizedText ? `Current status: ${sanitizedText}` : undefined;
		return [
			{
				id: thirdPartyStatusSettingId(key, "placement"),
				label: `${key} placement`,
				description,
				currentValue: getExtensionStatusPlacement(config, key),
				values: extensionStatusPlacementValues,
			},
			{
				id: thirdPartyStatusSettingId(key, "colorMode"),
				label: `${key} color`,
				description,
				currentValue: getExtensionStatusColorMode(config, key),
				values: extensionStatusColorModeValues,
			},
		];
	});
}

function nextSection(section: SettingsSection): SettingsSection {
	const currentIndex = settingsSections.indexOf(section);
	return settingsSections[(currentIndex + 1) % settingsSections.length] ?? "coloring";
}

function previousSection(section: SettingsSection): SettingsSection {
	const currentIndex = settingsSections.indexOf(section);
	return (
		settingsSections[(currentIndex - 1 + settingsSections.length) % settingsSections.length] ??
		"coloring"
	);
}

function formatSectionTabs(
	activeSection: SettingsSection,
	theme: ExtensionContext["ui"]["theme"],
): string {
	const rendered = settingsSections.map((section) => {
		const label = sectionLabels[section];
		return section === activeSection ? theme.bold(label) : safeThemeFg(theme, "muted", label);
	});
	return `  ${rendered.join(safeThemeFg(theme, "muted", " / "))}`;
}

function withSectionFooter(lines: string[], theme: ExtensionContext["ui"]["theme"]): string[] {
	const next = [...lines];
	for (let index = next.length - 1; index >= 0; index -= 1) {
		if (next[index]?.includes("Enter/Space")) {
			next[index] = safeThemeFg(
				theme,
				"muted",
				"  Enter/Space to change · Tab/Shift+Tab to switch sections · Esc to close",
			);
			break;
		}
	}
	return next;
}

export function registerZentuiSettingsCommand(pi: ExtensionAPI, deps: SettingsCommandDeps): void {
	pi.registerCommand("zentui", {
		description: "Configure Zentui",
		getArgumentCompletions: argumentCompletions,
		handler: async (_args, ctx) => {
			const args = typeof _args === "string" ? _args : "";

			const formatCommand = parseFormatCommand(args);
			if (formatCommand) {
				try {
					deps.setFooterFormat(formatCommand.value ?? "");
					deps.requestRender();
					if (ctx.hasUI) {
						if (formatCommand.value === undefined) {
							ctx.ui.notify("Footer format cleared (using default layout)", "info");
						} else {
							ctx.ui.notify(`Footer format: ${formatCommand.value}`, "info");
						}
					}
				} catch (error) {
					const message = error instanceof Error ? error.message : String(error);
					if (ctx.hasUI) ctx.ui.notify(`Could not update footer format: ${message}`, "error");
				}
				return;
			}

			const directRowCommand = parseDirectRowCommand(args, deps.getConfig());
			if (directRowCommand) {
				try {
					deps.setFooterRows({ [directRowCommand.row]: directRowCommand.enabled });
					deps.requestRender();
					if (ctx.hasUI) {
						ctx.ui.notify(
							`${footerRowLabels[directRowCommand.row]}: ${featureValue(directRowCommand.enabled)}`,
							"info",
						);
					}
				} catch (error) {
					const message = error instanceof Error ? error.message : String(error);
					if (ctx.hasUI) ctx.ui.notify(`Could not update Zentui settings: ${message}`, "error");
				}
				return;
			}

			const directCommand = parseDirectFeatureCommand(args, deps.getConfig());
			if (directCommand) {
				try {
					deps.setUiFeatures({ [directCommand.feature]: directCommand.enabled }, ctx);
					deps.requestRender();
					if (ctx.hasUI) {
						ctx.ui.notify(
							`${featureSettingLabels[directCommand.feature]}: ${featureValue(directCommand.enabled)}`,
							"info",
						);
					}
				} catch (error) {
					const message = error instanceof Error ? error.message : String(error);
					if (ctx.hasUI) ctx.ui.notify(`Could not update Zentui settings: ${message}`, "error");
				}
				return;
			}

			if (args.trim()) {
				if (ctx.hasUI) ctx.ui.notify(usageText(), "warning");
				return;
			}

			const mode = (ctx as typeof ctx & { mode?: string }).mode;
			if (!ctx.hasUI || (mode !== undefined && mode !== "tui")) return;

			await ctx.ui.custom<void>((tui, theme, _keybindings, done) => {
				const settingsListTheme = deps.settingsListTheme ?? getSettingsListTheme();
				let activeSection: SettingsSection = "coloring";
				const applyFeatureChange = (id: FeatureSettingId, newValue: FeatureState) => {
					deps.setUiFeatures(featurePatch(id, newValue), ctx);
					deps.requestRender();
					ctx.ui.notify(`${featureSettingLabels[id]}: ${newValue}`, "info");
					tui.requestRender();
				};
				let settingsList: SettingsList;
				const makeSettingsList = () =>
					new SettingsList(
						buildItems(activeSection, deps.getConfig(), deps.getActiveExtensionStatuses()),
						8,
						settingsListTheme,
						(id, newValue) => {
							try {
								if (isColorSettingId(id) && isColorSource(newValue)) {
									deps.setColorSources(patchForSetting(id, newValue));
									settingsList.updateValue(id, newValue);
									deps.requestRender();
									ctx.ui.notify(`${colorSettingLabels[id]}: ${newValue}`, "info");
									tui.requestRender();
									return;
								}

								if (isFeatureSettingId(id) && isFeatureState(newValue)) {
									applyFeatureChange(id, newValue);
									settingsList.updateValue(id, newValue);
									return;
								}

								if (isLayoutSettingId(id)) {
									if (id === "contextStyle" && isContextStyle(newValue)) {
										deps.setContextStyle(newValue);
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Context style: ${newValue}`, "info");
										tui.requestRender();
										return;
									}

									if (id === "separator" && isSeparatorStyle(newValue)) {
										deps.setSeparator(newValue);
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Separator: ${newValue}`, "info");
										tui.requestRender();
										return;
									}

									if (id === "pathDisplay" && isPathDisplayMode(newValue)) {
										deps.setPathDisplay({ mode: newValue });
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Path display: ${newValue}`, "info");
										tui.requestRender();
										return;
									}

									if (id === "pathDepth" && isPathDepthValue(newValue)) {
										deps.setPathDisplay({ depth: Number(newValue) });
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Path depth: ${newValue}`, "info");
										tui.requestRender();
										return;
									}

									if (id === "branchLength") {
										const maxLength = parseGitBranchLengthValue(newValue);
										if (maxLength === undefined) return;
										deps.setGitBranch({ maxLength });
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Branch length: ${newValue}`, "info");
										tui.requestRender();
										return;
									}

									if (id === "iconMode" && isIconMode(newValue)) {
										deps.setIconMode(newValue);
										settingsList.updateValue(id, newValue);
										deps.requestRender();
										ctx.ui.notify(`Icon mode: ${newValue}`, "info");
										tui.requestRender();
									}
									return;
								}

								const footerSegmentSetting = footerSegmentSettingFromId(id);
								if (footerSegmentSetting && isFeatureState(newValue)) {
									deps.setFooterSegments(footerSegmentPatch(footerSegmentSetting, newValue));
									settingsList.updateValue(id, newValue);
									deps.requestRender();
									ctx.ui.notify(
										`${footerSegmentSettingLabels[footerSegmentSetting]}: ${newValue}`,
										"info",
									);
									tui.requestRender();
									return;
								}

								const thirdPartyStatusSetting = thirdPartyStatusSettingFromId(id);
								if (
									thirdPartyStatusSetting?.kind === "placement" &&
									isExtensionStatusPlacement(newValue)
								) {
									deps.setExtensionStatusPlacement(thirdPartyStatusSetting.key, newValue);
									settingsList.updateValue(id, newValue);
									deps.requestRender();
									ctx.ui.notify(
										`Third-party status ${thirdPartyStatusSetting.key} placement: ${newValue}`,
										"info",
									);
									tui.requestRender();
									return;
								}

								if (
									thirdPartyStatusSetting?.kind === "colorMode" &&
									isExtensionStatusColorMode(newValue)
								) {
									deps.setExtensionStatusColorMode(thirdPartyStatusSetting.key, newValue);
									settingsList.updateValue(id, newValue);
									deps.requestRender();
									ctx.ui.notify(
										`Third-party status ${thirdPartyStatusSetting.key} color: ${newValue}`,
										"info",
									);
									tui.requestRender();
								}
							} catch (error) {
								settingsList = makeSettingsList();
								tui.requestRender();
								const message = error instanceof Error ? error.message : String(error);
								ctx.ui.notify(`Could not update Zentui settings: ${message}`, "error");
							}
						},
						() => done(undefined),
					);
				settingsList = makeSettingsList();
				const switchSection = (direction: "forward" | "backward") => {
					activeSection =
						direction === "forward" ? nextSection(activeSection) : previousSection(activeSection);
					settingsList = makeSettingsList();
					tui.requestRender();
				};

				return {
					render(width: number) {
						const border = safeThemeFg(theme, "borderMuted", "─".repeat(Math.max(0, width)));
						return [
							truncateToWidth(border, width, ""),
							truncateToWidth(formatSectionTabs(activeSection, theme), width, ""),
							truncateToWidth(border, width, ""),
							...withSectionFooter(settingsList.render(width), theme).map((line) =>
								truncateToWidth(line, width, ""),
							),
							truncateToWidth(border, width, ""),
						];
					},
					invalidate() {
						settingsList.invalidate();
					},
					handleInput(data: string) {
						if (matchesKey(data, Key.tab)) {
							switchSection("forward");
							return;
						}
						if (matchesKey(data, Key.shift("tab"))) {
							switchSection("backward");
							return;
						}
						settingsList.handleInput(data);
					},
				};
			});
		},
	});
}