@underactive/pi-topping 0.12.0 → 0.13.0

package/src/prompt-decorator.ts

@@ -1,18 +1,16 @@
 import type { EntryRenderer, MessageRenderer, Theme, ThemeColor } from "@earendil-works/pi-coding-agent";
 import { truncateToWidth, visibleWidth, wrapTextWithAnsi, type Component } from "@earendil-works/pi-tui";
-import { getThinkingLevelColorizer, isThinkingLevel, type ThinkingLevel } from "./format.ts";
+import { thinkingLevelColorizer } from "@underactive/pi-topping-primitives/activity-tui";
+import { BOX_STYLES, type BoxGlyphs } from "@underactive/pi-topping-primitives/glyphs";
+import { isThinkingLevel, type ThinkingLevel } from "./format.ts";
 import { DEFAULT_SETTINGS, isBorderStyle, isPromptBorderColor, type BorderStyle, type DoneMarkerBorderColor, type DoneMarkerBorderStyle, type DoneMarkerStyle, type PromptBorderColor } from "./settings.ts";
 import { stripControlChars } from "./util.ts";
 
 export const PROMPT_BOX_TYPE = "pi-topping-prompt";
 export const PROMPT_BOX_ENTRY_TYPE = "pi-topping-prompt-entry";
 
-const BORDER_GLYPHS: Record<BorderStyle, { tl: string; tr: string; bl: string; br: string; h: string; v: string }> = {
-	double: { tl: "╔", tr: "╗", bl: "╚", br: "╝", h: "═", v: "║" },
-	single: { tl: "┌", tr: "┐", bl: "└", br: "┘", h: "─", v: "│" },
-	rounded: { tl: "╭", tr: "╮", bl: "╰", br: "╯", h: "─", v: "│" },
-	heavy: { tl: "┏", tr: "┓", bl: "┗", br: "┛", h: "━", v: "┃" },
-};
+// Typed against this repo's BorderStyle, so a style added to settings.ts without a glyph set fails the typecheck.
+const BORDER_GLYPHS: Readonly<Record<BorderStyle, BoxGlyphs>> = BOX_STYLES;
 
 /**
  * False visibility options hide each corresponding part; present provider and
@@ -79,12 +77,12 @@ export function buildCompletionMarkerLine(
 	if (borderStyle === "none") return truncateToWidth(content, safeWidth);
 
 	const g = BORDER_GLYPHS[borderStyle];
-	const border = getThinkingLevelColorizer(theme, borderColor, thinkingLevel);
-	const prefix = `${g.bl}${g.h.repeat(2)} `;
+	const border = thinkingLevelColorizer(theme, borderColor, thinkingLevel);
+	const prefix = `${g.bottomLeft}${g.horizontal.repeat(2)} `;
 
 	const suffix = markerStyle === "bookend"
-		? ` ${g.h.repeat(Math.max(0, safeWidth - visibleWidth(prefix) - visibleWidth(content) - 2))}${g.br}`
-		: ` ${COMPLETION_MARKER_TRAIL_RUNS.map(length => g.h.repeat(length)).join(" ")}`;
+		? ` ${g.horizontal.repeat(Math.max(0, safeWidth - visibleWidth(prefix) - visibleWidth(content) - 2))}${g.bottomRight}`
+		: ` ${COMPLETION_MARKER_TRAIL_RUNS.map(length => g.horizontal.repeat(length)).join(" ")}`;
 	const line = `${border(prefix)}${content}${border(suffix)}`;
 	return visibleWidth(line) > safeWidth ? truncateToWidth(line, safeWidth) : line;
 }
@@ -103,7 +101,7 @@ export function buildPromptBoxLines(
 	const g = BORDER_GLYPHS[borderStyle];
 	const borderColor = isPromptBorderColor(options.borderColor) ? options.borderColor : DEFAULT_SETTINGS.decorations.borderColor;
 	const thinkingLevel = isThinkingLevel(options.thinkingLevel) ? options.thinkingLevel : undefined;
-	const border = getThinkingLevelColorizer(theme, borderColor, thinkingLevel);
+	const border = thinkingLevelColorizer(theme, borderColor, thinkingLevel);
 	const iconColor = (text: string) => theme.fg("text", text);
 	const muted = (text: string) => theme.fg("dim", text);
 	const bodyText = (text: string) => theme.fg("customMessageText", text);
@@ -131,12 +129,12 @@ export function buildPromptBoxLines(
 	const labelText = combinedLabel
 		? truncateToWidth(combinedLabel, Math.max(0, innerWidth - 3)).replace(/\x1b\[0m/g, "")
 		: "";
-	const titleLength = icon ? visibleWidth(`${g.h}${g.h} ${icon} `) : 0;
+	const titleLength = icon ? visibleWidth(`${g.horizontal}${g.horizontal} ${icon} `) : 0;
 	const timeLength = time ? time.length + 3 : 0; // time + right-side " ═"
 	const topFill = Math.max(0, innerWidth - titleLength - timeLength);
-	const iconSeg = icon ? `${border(`${g.h}${g.h} `)}${iconColor(icon)}${border(" ")}` : "";
-	const timeSeg = time ? `${border(" ")}${muted(time)}${border(` ${g.h}`)}` : "";
-	const topLine = border(g.tl) + iconSeg + border(g.h.repeat(topFill)) + timeSeg + border(g.tr);
+	const iconSeg = icon ? `${border(`${g.horizontal}${g.horizontal} `)}${iconColor(icon)}${border(" ")}` : "";
+	const timeSeg = time ? `${border(" ")}${muted(time)}${border(` ${g.horizontal}`)}` : "";
+	const topLine = border(g.topLeft) + iconSeg + border(g.horizontal.repeat(topFill)) + timeSeg + border(g.topRight);
 	const lines = [visibleWidth(topLine) > width ? truncateToWidth(topLine, width) : topLine];
 
 	if (content) {
@@ -144,14 +142,14 @@ export function buildPromptBoxLines(
 		for (const rawLine of wrapTextWithAnsi(content, textWidth)) {
 			const displayLine = rawLine || " ";
 			const padded = `${displayLine}${" ".repeat(Math.max(0, textWidth - visibleWidth(displayLine)))}`;
-			const line = `${border(g.v)}${bodyText(` ${padded} `)}${border(g.v)}`;
+			const line = `${border(g.vertical)}${bodyText(` ${padded} `)}${border(g.vertical)}`;
 			lines.push(visibleWidth(line) > width ? truncateToWidth(line, width) : line);
 		}
 	}
 
 	const labelLength = labelText ? visibleWidth(labelText) + 3 : 0; // label + right-side " ═"
-	const labelSeg = labelText ? `${border(" ")}${muted(labelText)}${border(` ${g.h}`)}` : "";
-	const bottomLine = `${border(g.bl)}${border(g.h.repeat(Math.max(0, innerWidth - labelLength)))}${labelSeg}${border(g.br)}`;
+	const labelSeg = labelText ? `${border(" ")}${muted(labelText)}${border(` ${g.horizontal}`)}` : "";
+	const bottomLine = `${border(g.bottomLeft)}${border(g.horizontal.repeat(Math.max(0, innerWidth - labelLength)))}${labelSeg}${border(g.bottomRight)}`;
 	lines.push(visibleWidth(bottomLine) > width ? truncateToWidth(bottomLine, width) : bottomLine);
 	return lines;
 }

package/src/session.ts

@@ -15,16 +15,26 @@ import type {
 	Theme,
 } from "@earendil-works/pi-coding-agent";
 import { VERSION } from "@earendil-works/pi-coding-agent";
+import { CHANNELS, PI_VIRTUAL_MODEL_API, WORKING_STATUS_SLIDE_MS, subscribe } from "@underactive/pi-topping-primitives/contracts";
 import { Text, type Component } from "@earendil-works/pi-tui";
-import { ActivityMeter, rateToLevel, TokRateTracker } from "./activity-meter.ts";
-import { ROUTED_MODEL_CHANNEL, routedModelAnnouncement } from "./routesense-feed.ts";
+import {
+	ActivityMeter,
+	FADE_SHADE_COUNT,
+	formatElapsedUnits,
+	RateHoldFade,
+	rateToLevel,
+	slideOutTail,
+	StreamingWordCounter,
+} from "@underactive/pi-topping-primitives/activity";
 import {
 	dimAttribute,
-	getThinkingLevelColorizer,
+	fadeThemeColorString,
+	renderMeter,
+	thinkingLevelColorizer,
+} from "@underactive/pi-topping-primitives/activity-tui";
+import {
 	isThinkingLevel,
 	ELAPSED_INTERVAL_MS,
-	fadeThemeColorString,
-	formatElapsed,
 	formatTokenRate,
 	formatTokens,
 	isFullyDefaultAppearance,
@@ -32,22 +42,17 @@ import {
 	RESPONSE_MODEL_FADE_MS,
 	RESPONSE_MODEL_HOLD_MS,
 	RESPONSE_MODEL_SLIDE_FRAME_MS,
-	RESPONSE_MODEL_SLIDE_MS,
 	SHIMMER_INTERVAL_MS,
-	slideOutTail,
 	SPINNER_FRAME_MS,
 	SPINNER_FRAMES,
-	TOKEN_RATE_FADE_SHADE_COUNT,
-	StreamingWordCounter,
 	type ThinkingLevel,
 } from "./format.ts";
 import { buildLoaderMessage } from "./loader-message.ts";
-import { showMenu } from "./menu.ts";
+import { showMenu } from "@underactive/pi-topping-primitives/menu";
 import { applyOutputStyle, OUTPUT_STYLES } from "./output-style.ts";
 import { getResponseModelColorizer } from "./nvidia-green.ts";
 import { registerSetupCommand } from "./setup-command.ts";
 import { applyMenuResult, buildMenuSections, loadSettings, saveSettings, type ThinkingLevelColor } from "./settings.ts";
-import { announcesEmbedded, STATUSLINE_EMBED_CHANNEL } from "./statusline-embed.ts";
 import { announceMissingToppingsOnce, type MissingToppingsEntryData, renderMissingToppingsEntry, SETUP_ENTRY_TYPE } from "./toppings.ts";
 import { PreviewRenderer } from "./preview.ts";
 import {
@@ -81,8 +86,6 @@ type UIPromptKind = UIPromptStartEvent["kind"];
 export const MIN_HOST_VERSION = "1.2.0";
 const DONE_ENTRY_TYPE = "pi-topping-done";
 const RESPONSE_MODEL_STATUS_KEY = "pi-topping-response-model";
-/** Pi's `VIRTUAL_MODEL_API` for extension-registered virtual models; Pi does not export it from its public index. */
-const VIRTUAL_MODEL_API = "pi-virtual";
 const WAITING_LABELS: Record<UIPromptKind, string> = {
 	select: "Waiting for selection",
 	confirm: "Waiting for confirmation",
@@ -129,9 +132,7 @@ interface SessionState {
 	liveTokens: number;
 	shimmerOrigin: number;
 	activityMeter: ActivityMeter;
-	rateTracker: TokRateTracker;
-	lastTokenRateSampledAt: number;
-	lastTokenRateTotal: number;
+	tokenRate: RateHoldFade;
 	responseModel: string;
 	served: { model: string; backend: string; routedId: string } | null;
 	/** The backend companion to the last raw response-model report. */
@@ -147,8 +148,6 @@ interface SessionState {
 	/** When the response model appeared in the loader and began sliding out; 0 if it never slid. */
 	responseModelShownAt: number;
 	responseModelSlideTimer: ReturnType<typeof setInterval> | null;
-	tokenRateText: string;
-	tokenRateFadeStartsAt: number;
 	timer: ReturnType<typeof setInterval> | null;
 	busy: boolean;
 	waiting: { kind: UIPromptKind; title?: string } | null;
@@ -160,15 +159,6 @@ interface SessionState {
 /** Sentinel distinguishing "never called setWorkingMessage()" from an explicit `undefined` message. */
 const NOT_SENT = Symbol("not-sent");
 
-/** Reset all token-rate tracking fields on `state` to their fresh-turn values. */
-function resetTokenRateState(state: SessionState): void {
-	state.rateTracker.reset();
-	state.lastTokenRateSampledAt = 0;
-	state.lastTokenRateTotal = 0;
-	state.tokenRateText = "";
-	state.tokenRateFadeStartsAt = 0;
-}
-
 function makeFreshState(): SessionState {
 	return {
 		startTime: 0,
@@ -177,9 +167,12 @@ function makeFreshState(): SessionState {
 		liveTokens: 0,
 		shimmerOrigin: 0,
 		activityMeter: new ActivityMeter(),
-		rateTracker: new TokRateTracker(),
-		lastTokenRateSampledAt: 0,
-		lastTokenRateTotal: 0,
+		tokenRate: new RateHoldFade({
+			holdMs: TOKEN_RATE_HOLD_MS,
+			fadeMs: TOKEN_RATE_FADE_MS,
+			shadeCount: FADE_SHADE_COUNT,
+			sampleIntervalMs: METER_INTERVAL_MS,
+		}),
 		responseModel: "",
 		served: null,
 		lastResponseModelBackend: NOT_SENT,
@@ -191,8 +184,6 @@ function makeFreshState(): SessionState {
 		responseModelFadeGeneration: 0,
 		responseModelShownAt: 0,
 		responseModelSlideTimer: null,
-		tokenRateText: "",
-		tokenRateFadeStartsAt: 0,
 		timer: null,
 		busy: false,
 		waiting: null,
@@ -334,11 +325,9 @@ export class SessionManager {
 			typeof rawTokens === "number" && Number.isFinite(rawTokens) && rawTokens >= 0 ? rawTokens : undefined;
 		this.#state.confirmTokens += exactTokens ?? this.#state.liveTokens;
 		if (exactTokens !== undefined) {
-			// Only reset the sampling state here, not tokenRateText/tokenRateFadeStartsAt:
+			// Only restart the sampling here, not the held rate or its fade:
 			// those must keep holding/fading across message boundaries to avoid flicker.
-			this.#state.rateTracker.reset();
-			this.#state.lastTokenRateSampledAt = 0;
-			this.#state.lastTokenRateTotal = this.#state.confirmTokens;
+			this.#state.tokenRate.resetSampling(this.#state.confirmTokens);
 		}
 		this.#state.liveTokens = 0;
 		this.#counter.reset();
@@ -407,7 +396,7 @@ export class SessionManager {
 		ctx.ui.setWorkingMessage();
 		if (responseModel) this.startResponseModelFade(ctx, responseModel, responseModelColor, responseModelDimmed);
 		this.#state.activityMeter.reset();
-		resetTokenRateState(this.#state);
+		this.#state.tokenRate.reset();
 		this.#state.lastMessage = NOT_SENT;
 		if (this.#settings.features.doneMarker && hadPrompt) {
 			const aborted = e.aborted === true;
@@ -451,10 +440,10 @@ export class SessionManager {
 		const thinkingLevel = isThinkingLevel(entry.data.thinkingLevel) ? entry.data.thinkingLevel : undefined;
 		const rawModel = sanitizedText(entry.data.model);
 		const modelColored = features.doneMarkerModel && rawModel
-			? getThinkingLevelColorizer(theme, this.#settings.decorations.doneMarkerModelColor, thinkingLevel)(rawModel)
+			? thinkingLevelColorizer(theme, this.#settings.decorations.doneMarkerModelColor, thinkingLevel)(rawModel)
 			: "";
 		const model = modelColored && this.#settings.decorations.doneMarkerModelDimmed ? dimAttribute(modelColored) : modelColored;
-		const markerContent = buildCompletionMarkerContent(theme, icon, word, formatElapsed(elapsedMs), details, model, aborted ? "warning" : "dim");
+		const markerContent = buildCompletionMarkerContent(theme, icon, word, formatElapsedUnits(elapsedMs), details, model, aborted ? "warning" : "dim");
 		const borderStyle = this.#settings.decorations.doneMarkerBorderStyle;
 		const borderColor = aborted ? "warning" : this.#settings.decorations.doneMarkerBorderColor;
 		const markerStyle = this.#settings.decorations.doneMarkerStyle;
@@ -491,14 +480,13 @@ export class SessionManager {
 		this.#pi.on("ui_prompt_start", this.#onUIPromptStart);
 		this.#pi.on("ui_prompt_end", this.#onUIPromptEnd);
 		this.#pi.on("session_shutdown", this.#onSessionShutdown);
-		this.#pi.events.on(STATUSLINE_EMBED_CHANNEL, (data) => {
-			this.#loaderInStatusline = announcesEmbedded(data);
+		subscribe(this.#pi.events, CHANNELS.workingStatusEmbedded, ({ embedded }) => {
+			this.#loaderInStatusline = embedded;
 		});
-		this.#pi.events.on(ROUTED_MODEL_CHANNEL, (data) => {
+		subscribe(this.#pi.events, CHANNELS.routedModel, (announcement) => {
 			// Direct routes serve compaction and other extensions' side requests; a route while idle
 			// is such a background request too, and must not leave a stale model for the next turn.
-			const announcement = routedModelAnnouncement(data);
-			if (!announcement || announcement.reason === "direct" || !this.#state.busy) return;
+			if (announcement.reason === "direct" || !this.#state.busy) return;
 			this.updateResponseModel({ raw: announcement.modelId, weak: true, provider: announcement.provider, routedId: announcement.modelId });
 		});
 		this.#pi.registerEntryRenderer<DoneEntryData>(DONE_ENTRY_TYPE, (entry, _o, theme) => this.#renderDoneEntry(entry, theme));
@@ -597,7 +585,7 @@ export class SessionManager {
 
 		const color = this.#settings.decorations.spinnerColor;
 		ctx.ui.setWorkingIndicator({
-			frames: SPINNER_FRAMES.map((frame) => getThinkingLevelColorizer(ctx.ui.theme, color, ctx.thinkingLevel)(frame)),
+			frames: SPINNER_FRAMES.map((frame) => thinkingLevelColorizer(ctx.ui.theme, color, ctx.thinkingLevel)(frame)),
 		});
 	}
 
@@ -618,7 +606,7 @@ export class SessionManager {
 		if (message.responseModel !== undefined) {
 			return { raw: message.responseModel, weak: false, routedId: sanitizedText(message.model) || undefined };
 		}
-		if (this.#currentCtx?.model?.api !== VIRTUAL_MODEL_API) return undefined;
+		if (this.#currentCtx?.model?.api !== PI_VIRTUAL_MODEL_API) return undefined;
 		return { raw: message.model, weak: true, provider: typeof message.provider === "string" ? message.provider : undefined };
 	}
 
@@ -632,7 +620,7 @@ export class SessionManager {
 	private restatesSelection(report: ResponseModelReport, responseModel: string): boolean {
 		const selected = this.#currentCtx?.model;
 		if (!selected) return false;
-		if (selected.api === VIRTUAL_MODEL_API) return report.provider === selected.provider && responseModel === selected.id;
+		if (selected.api === PI_VIRTUAL_MODEL_API) return report.provider === selected.provider && responseModel === selected.id;
 		return modelsResemble(selected.id, responseModel) || modelsSpelledAlike(selected, responseModel);
 	}
 
@@ -684,7 +672,7 @@ export class SessionManager {
 		state.responseModelShownAt = Date.now();
 		state.responseModelSlideTimer = setInterval(() => {
 			this.tick();
-			if (Date.now() - state.responseModelShownAt >= RESPONSE_MODEL_SLIDE_MS) this.stopResponseModelSlide();
+			if (Date.now() - state.responseModelShownAt >= WORKING_STATUS_SLIDE_MS) this.stopResponseModelSlide();
 		}, RESPONSE_MODEL_SLIDE_FRAME_MS);
 	}
 
@@ -737,12 +725,12 @@ export class SessionManager {
 			render(shade++);
 			this.#state.responseModelFadeTimer = setInterval(() => {
 				if (this.#state.responseModelFadeGeneration !== generation) return;
-				if (shade >= TOKEN_RATE_FADE_SHADE_COUNT) {
+				if (shade >= FADE_SHADE_COUNT) {
 					this.cancelResponseModelFade(ctx);
 					return;
 				}
 				render(shade++);
-			}, RESPONSE_MODEL_FADE_MS / TOKEN_RATE_FADE_SHADE_COUNT);
+			}, RESPONSE_MODEL_FADE_MS / FADE_SHADE_COUNT);
 		}, RESPONSE_MODEL_HOLD_MS);
 	}
 
@@ -779,7 +767,7 @@ export class SessionManager {
 		state.lastResponseModelRaw = NOT_SENT;
 		state.lastResponseModelBackend = NOT_SENT;
 		state.activityMeter.reset();
-		resetTokenRateState(state);
+		state.tokenRate.reset();
 		state.midTurnInputs = 0;
 		state.lastMessage = NOT_SENT;
 		this.#counter.reset();
@@ -802,27 +790,15 @@ export class SessionManager {
 		const total = state.confirmTokens + state.liveTokens;
 		const features = this.#settings.features;
 		const decorations = this.#settings.decorations;
-		let hasNewTokenCount = false;
-		if ((decorations.tokenActivityMonitor || features.tokenRate) && now - state.lastTokenRateSampledAt >= METER_INTERVAL_MS) {
-			// Do not reset the fade for an EMA-only decay while output is quiet.
-			hasNewTokenCount = total > state.lastTokenRateTotal;
-			state.lastTokenRateTotal = total;
-			const tokenRate = state.rateTracker.sample(total, now);
-			if (decorations.tokenActivityMonitor) state.activityMeter.push(rateToLevel(tokenRate, decorations.meterUpperBoundTps));
-			state.lastTokenRateSampledAt = now;
+		// RateHoldFade samples at most once per METER_INTERVAL_MS and holds a rate only when the
+		// total grew, so an EMA-only decay while output is quiet does not reset the fade.
+		if ((decorations.tokenActivityMonitor || features.tokenRate) && state.tokenRate.sample(total, now) && decorations.tokenActivityMonitor) {
+			state.activityMeter.push(rateToLevel(state.tokenRate.tracker.tokenRate, decorations.meterUpperBoundTps));
 		}
 		const responseModelShown = features.responseModel && state.responseModel
 			? slideOutTail(state.responseModel, now - state.responseModelShownAt)
 			: "";
-		if (features.tokenRate) {
-			const latestTokenRate = formatTokenRate(state.rateTracker.tokenRate);
-			if (latestTokenRate && hasNewTokenCount) {
-				state.tokenRateText = latestTokenRate;
-				state.tokenRateFadeStartsAt = now + TOKEN_RATE_HOLD_MS;
-			} else if (now >= state.tokenRateFadeStartsAt + TOKEN_RATE_FADE_MS) {
-				state.tokenRateText = "";
-			}
-		}
+		const tokenRate = state.tokenRate.display(now);
 		const showSpinner = this.spinnerInMessage();
 		const msg = isFullyDefaultAppearance(features, decorations) && !showSpinner && !responseModelShown
 			? undefined
@@ -837,15 +813,11 @@ export class SessionManager {
 					spinnerAtMs: showSpinner ? now : undefined,
 					word: state.workingText.text,
 					shimmerAtMs: now - state.shimmerOrigin,
-					renderMeter: (colorizer, dimmed) => state.activityMeter.render((level, char) =>
-						ActivityMeter.colorizeCell(level, char, ctx.ui.theme, colorizer, dimmed),
-					),
+					renderMeter: (colorizer, dimmed) => renderMeter(state.activityMeter, ctx.ui.theme, colorizer, dimmed),
 					elapsedMs: now - state.startTime,
 					outputTokens: total,
-					tokenRateText: state.tokenRateText,
-					tokenRateShade: now < state.tokenRateFadeStartsAt
-						? undefined
-						: Math.floor((now - state.tokenRateFadeStartsAt) / (TOKEN_RATE_FADE_MS / TOKEN_RATE_FADE_SHADE_COUNT)),
+					tokenRateText: features.tokenRate && tokenRate.rate !== null ? formatTokenRate(tokenRate.rate) : "",
+					tokenRateShade: tokenRate.phase === "fading" ? tokenRate.fadeShade : undefined,
 					responseModel: responseModelShown,
 				},
 			);
@@ -866,19 +838,17 @@ export class SessionManager {
 		const before = this.indicatorFingerprint();
 		const styleBefore = this.#settings.outputStyle;
 		const preview = new PreviewRenderer(ctx, this.#allPacks);
-		const result = await showMenu<Record<string, boolean | string>>(ctx, {
+		const result = await showMenu(ctx, {
 			title: "Pi Topping: Settings",
-			maxHeight: "75%",
+			layout: { maxHeight: "75%" },
 			sections: buildMenuSections(this.#settings, this.#bundledPacks, this.#userPacks),
 			hints: ["↑↓ move", "PgUp/PgDn page", "←→ select", "␣ toggle", "⏎ apply", "esc cancel"],
-			preview: preview.render.bind(preview),
+			preview,
 		});
 		if (!result.applied) return;
 
 		const updatedSettings = applyMenuResult(this.#settings, result.values);
-		try {
-			saveSettings(updatedSettings);
-		} catch {
+		if (!saveSettings(updatedSettings).ok) {
 			ctx.ui.notify("Failed to save Pi Topping settings", "error");
 			return;
 		}