dsh-plugin-subscription-oauth 0.11.0 → 0.12.2

package/lib/client.js

@@ -91,6 +91,7 @@ const en = {
 	modelsDrag: "Drag to re-order (or press ↑ / ↓ here)",
 	modelsAutoChainOff: "Take out of Auto",
 	modelsAutoChainEmpty: "No model is enabled, so Auto has nothing to try.",
+	autoSwitchLabel: "Offer Auto in the model picker",
 	modelsPinned: "pinned",
 	usageTitle: "Plan and usage",
 	usagePlan: "Plan: {plan}",
@@ -186,6 +187,7 @@ const zh = {
 	modelsDrag: "拖动调整顺序（也可在此按 ↑ / ↓）",
 	modelsAutoChainOff: "从自动中移除",
 	modelsAutoChainEmpty: "没有启用任何模型，自动没有可尝试的模型。",
+	autoSwitchLabel: "在模型选择器中提供 Auto",
 	modelsPinned: "固定",
 	usageTitle: "套餐与额度",
 	usagePlan: "套餐：{plan}",
@@ -936,7 +938,16 @@ const styles = {
 		height: 8,
 		borderRadius: "50%",
 		flexShrink: 0,
-		boxShadow: "0 0 0 3px var(--dsw-alias-state-success-primary, transparent)"
+		border: "1.5px solid var(--dsw-alias-label-dimmed)",
+		background: "transparent"
+	},
+	dotLive: {
+		borderColor: "var(--dsw-alias-state-success-primary, #067647)",
+		background: "var(--dsw-alias-state-success-primary, #067647)"
+	},
+	dotBusy: {
+		borderColor: "var(--dsw-alias-state-warn-primary, #f5a524)",
+		background: "var(--dsw-alias-state-warn-primary, #f5a524)"
 	},
 	name: {
 		fontWeight: 600,
@@ -944,15 +955,6 @@ const styles = {
 		lineHeight: "22px",
 		color: "var(--dsw-alias-label-primary)"
 	},
-	providerId: {
-		fontSize: 11,
-		lineHeight: "16px",
-		color: "var(--dsw-alias-label-dimmed)",
-		padding: "1px 6px",
-		borderRadius: 999,
-		background: "var(--dsw-alias-bg-layer-3, var(--dsw-alias-bg-layer-1))",
-		fontFamily: "monospace"
-	},
 	statusLine: {
 		margin: 0,
 		fontSize: 12,
@@ -1183,6 +1185,18 @@ const styles = {
 		background: "var(--dsw-alias-bg-layer-1)",
 		border: "0.5px solid var(--dsw-alias-border-l2)"
 	},
+	usageInline: {
+		display: "flex",
+		flexDirection: "column",
+		gap: 6,
+		marginTop: 4
+	},
+	autoSwitchRow: {
+		display: "flex",
+		alignItems: "center",
+		gap: 8,
+		justifyContent: "space-between"
+	},
 	modelRow: {
 		display: "flex",
 		alignItems: "flex-start",
@@ -1291,11 +1305,11 @@ const styles = {
 	},
 	divider: { borderTop: "0.5px solid var(--dsw-alias-border-l2)" }
 };
-/** Status dot color for one provider's connection state. */
-function dotColor(status) {
-	if (status.busy) return "var(--dsw-alias-state-warn-label)";
-	if (status.loggedIn) return "var(--dsw-alias-state-success-primary)";
-	return "var(--dsw-alias-label-dimmed)";
+/** Status dot style for one provider's connection state. */
+function dotStyle(status) {
+	if (status.busy) return styles.dotBusy;
+	if (status.loggedIn) return styles.dotLive;
+	return {};
 }
 /** Localized label for one provider-owned detail row. */
 function detailLabel(t, row) {
@@ -1313,70 +1327,38 @@ function windowAmount(window$1) {
 	if (window$1.used !== void 0 && window$1.limit !== void 0) return `${String(window$1.used)}/${String(window$1.limit)}`;
 	return "—";
 }
-/** One account's plan and metered allowances. */
-function UsageBlock(props) {
-	const { usage, error, t, busyAction, onRefresh } = props;
+/** One account's metered windows, rendered under its account row. */
+function AccountUsage(props) {
+	const { entry, t } = props;
+	if (entry === void 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		style: styles.usage,
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				style: styles.usageHeader,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					style: styles.catalogTitle,
-					children: t("usageTitle")
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-					type: "button",
-					className: "dsh-subscription-quiet",
-					style: styles.pushRight,
-					disabled: busyAction,
-					onClick: onRefresh,
-					children: busyAction ? t("refreshing") : t("usageRefresh")
+		style: styles.usageInline,
+		children: [entry.windows.map((window$1) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			style: styles.usageRow,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				style: styles.usageLine,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					style: styles.modelName,
+					children: [
+						windowLabel(t, window$1),
+						" · ",
+						windowAmount(window$1)
+					]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles.modelMeta,
+					children: window$1.resetsAt === void 0 ? "" : formatReset$1(window$1.resetsAt, t)
 				})]
-			}),
-			error !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "dsh-subscription-error",
-				children: t("usageError", { message: error })
-			}),
-			usage.length === 0 && error === void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				style: styles.statusLine,
-				children: t("usageNone")
-			}),
-			usage.map((entry) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				style: styles.usageAccount,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					style: styles.usageLine,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-						style: styles.modelMeta,
-						children: [entry.plan === void 0 ? entry.account : t("usagePlan", { plan: entry.plan }), entry.renewsAt === void 0 ? "" : ` · ${t("usageRenews", { time: formatTime(entry.renewsAt) })}`]
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						style: styles.modelMeta,
-						children: t("usageFetched", { time: formatTime(entry.fetchedAt) })
-					})]
-				}), entry.windows.map((window$1) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					style: styles.usageRow,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						style: styles.usageLine,
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-							style: styles.modelName,
-							children: [
-								windowLabel(t, window$1),
-								" · ",
-								windowAmount(window$1)
-							]
-						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							style: styles.modelMeta,
-							children: window$1.resetsAt === void 0 ? "" : formatReset$1(window$1.resetsAt, t)
-						})]
-					}), window$1.usedPercent !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "dsh-subscription-meter",
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							style: { width: `${String(Math.min(100, Math.max(0, window$1.usedPercent)))}%` },
-							"data-exhausted": window$1.usedPercent >= 90 ? "true" : "false"
-						})
-					})]
-				}, `${entry.account}-${window$1.label}`))]
-			}, entry.account))
-		]
+			}), window$1.usedPercent !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-subscription-meter",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: { width: `${String(Math.min(100, Math.max(0, window$1.usedPercent)))}%` },
+					"data-exhausted": window$1.usedPercent >= 90 ? "true" : "false"
+				})
+			})]
+		}, `${entry.account}-${window$1.label}`)), entry.windows.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			style: styles.statusLine,
+			children: t("usageNone")
+		})]
 	});
 }
 /** The pending-login block: a device code, or a link to the sign-in page. */
@@ -1601,7 +1583,7 @@ function ProviderCard(props) {
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						style: {
 							...styles.dot,
-							background: dotColor(status)
+							...dotStyle(status)
 						},
 						"aria-hidden": "true"
 					}),
@@ -1609,10 +1591,6 @@ function ProviderCard(props) {
 						style: styles.name,
 						children: status.displayName
 					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						style: styles.providerId,
-						children: status.provider
-					}),
 					status.loggedIn && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						style: styles.badgeDefault,
 						children: t("badgeLive")
@@ -1658,52 +1636,77 @@ function ProviderCard(props) {
 						className: "dsh-subscription-success",
 						children: message.text
 					}),
-					accounts.map((account) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						style: styles.accountRow,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							style: styles.accountHeader,
-							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-									type: "button",
-									style: styles.starButton,
-									title: account.isDefault ? t("defaultBadge") : t("makeDefault"),
-									"aria-label": account.isDefault ? t("defaultBadge") : t("makeDefault"),
-									disabled: busyAction || account.isDefault,
-									onClick: () => {
-										props.onSetDefault(account.account);
-									},
-									children: account.isDefault ? "★" : "☆"
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									style: styles.accountName,
-									children: account.label
-								}),
-								account.isDefault && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									style: styles.badgeDefault,
-									children: t("defaultBadge")
-								}),
-								account.needsLogin === true && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									style: styles.badgeWarn,
-									title: t("accountNeedsLoginHint"),
-									children: t("accountNeedsLogin")
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-									style: styles.statusLine,
-									children: account.expired ? t("accountExpired") : t("accountExpires", { time: formatTime(account.expiresAt) })
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-									type: "button",
-									className: "dsh-subscription-quiet",
-									style: styles.pushRight,
-									disabled: busyAction,
-									onClick: () => {
-										props.onLogout(account.account);
-									},
-									children: t("logout")
-								})
-							]
-						})
-					}, account.account)),
+					status.provider === "auto" && props.onSetAutoOn !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+						style: styles.autoSwitchRow,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: styles.modelName,
+							children: t("autoSwitchLabel")
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							type: "checkbox",
+							className: "dsh-subscription-switch",
+							checked: props.autoOn ?? true,
+							disabled: busyAction,
+							onChange: (event) => {
+								props.onSetAutoOn?.(event.target.checked);
+							}
+						})]
+					}),
+					accounts.map((account) => {
+						const usageEntry = (status.usage ?? []).find((entry) => entry.account === account.account);
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							style: styles.accountRow,
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								style: styles.accountHeader,
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										style: styles.starButton,
+										title: account.isDefault ? t("defaultBadge") : t("makeDefault"),
+										"aria-label": account.isDefault ? t("defaultBadge") : t("makeDefault"),
+										disabled: busyAction || account.isDefault,
+										onClick: () => {
+											props.onSetDefault(account.account);
+										},
+										children: account.isDefault ? "★" : "☆"
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										style: styles.accountName,
+										children: account.label
+									}),
+									account.isDefault && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										style: styles.badgeDefault,
+										children: t("defaultBadge")
+									}),
+									account.needsLogin === true && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										style: styles.badgeWarn,
+										title: t("accountNeedsLoginHint"),
+										children: t("accountNeedsLogin")
+									}),
+									usageEntry?.plan !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										style: styles.badge,
+										children: t("usagePlan", { plan: usageEntry.plan })
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										style: styles.statusLine,
+										children: account.expired ? t("accountExpired") : t("accountExpires", { time: formatTime(account.expiresAt) })
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: "dsh-subscription-quiet",
+										style: styles.pushRight,
+										disabled: busyAction,
+										onClick: () => {
+											props.onLogout(account.account);
+										},
+										children: t("logout")
+									})
+								]
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccountUsage, {
+								entry: usageEntry,
+								t
+							})]
+						}, account.account);
+					}),
 					status.loggedIn && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						style: styles.catalog,
 						children: [
@@ -1894,13 +1897,6 @@ function ProviderCard(props) {
 							})
 						]
 					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(UsageBlock, {
-						usage: status.usage ?? [],
-						...status.usageError === void 0 ? {} : { error: status.usageError },
-						t,
-						busyAction,
-						onRefresh: props.onRefreshUsage
-					}),
 					connectable && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						style: styles.actions,
 						children: [
@@ -2071,8 +2067,20 @@ function SubscriptionsSection(props) {
 	const [error, setError] = (0, react.useState)(void 0);
 	const [messages, setMessages] = (0, react.useState)({});
 	const [busyAction, setBusyAction] = (0, react.useState)(false);
+	const [autoOn, setAutoOn] = (0, react.useState)(true);
 	const mounted = (0, react.useRef)(true);
 	const timer = (0, react.useRef)(void 0);
+	/** Read whether the `auto` provider is offered, so its card can render the switch. */
+	(0, react.useEffect)(() => {
+		if (call === void 0) return;
+		let live = true;
+		call("auto-state", void 0).then((result) => {
+			if (live) setAutoOn(result.enabled);
+		}).catch(() => {});
+		return () => {
+			live = false;
+		};
+	}, [call]);
 	/** Fetch the current state; a failure is shown rather than swallowed. */
 	const refresh = (0, react.useCallback)(async () => {
 		if (call === void 0) return;
@@ -2085,6 +2093,25 @@ function SubscriptionsSection(props) {
 			if (mounted.current) setError(t("actionFailed", { message: messageOf(caught) }));
 		}
 	}, [call, t]);
+	/** Flip the `auto` provider on or off. */
+	const setAuto = (0, react.useCallback)(async (enabled) => {
+		if (call === void 0) return;
+		setBusyAction(true);
+		try {
+			const result = await call("setAutoOn", { enabled });
+			if (!mounted.current) return;
+			setAutoOn(result.enabled);
+			await refresh();
+		} catch (caught) {
+			if (mounted.current) setError(t("actionFailed", { message: messageOf(caught) }));
+		} finally {
+			if (mounted.current) setBusyAction(false);
+		}
+	}, [
+		call,
+		refresh,
+		t
+	]);
 	const stopPolling = (0, react.useCallback)(() => {
 		if (timer.current !== void 0) {
 			clearInterval(timer.current);
@@ -2398,6 +2425,12 @@ function SubscriptionsSection(props) {
 				},
 				onReload: () => {
 					reload(provider.provider);
+				},
+				...provider.provider !== "auto" ? {} : {
+					autoOn,
+					onSetAutoOn: (enabled) => {
+						setAuto(enabled);
+					}
 				}
 			}, provider.provider))
 		]
@@ -2566,10 +2599,16 @@ function mergeAccountWindows(readings) {
 		const withPercent = list.filter((window$1) => window$1.usedPercent !== void 0);
 		if (withPercent.length === 0) continue;
 		const usedPercent = withPercent.reduce((sum, window$1) => sum + (window$1.usedPercent ?? 0), 0) / withPercent.length;
+		const used = list.reduce((sum, window$1) => sum + (window$1.used ?? 0), 0);
+		const limit = list.reduce((sum, window$1) => sum + (window$1.limit ?? 0), 0);
 		const resets = list.map((window$1) => window$1.resetsAt).filter((at) => typeof at === "number");
 		merged.push({
 			label,
 			usedPercent: Math.max(0, Math.min(100, usedPercent)),
+			...limit > 0 ? {
+				used,
+				limit
+			} : {},
 			...resets.length === 0 ? {} : { resetsAt: Math.min(...resets) }
 		});
 	}
@@ -2826,7 +2865,7 @@ function UsageChip({ call, t, isOwnProvider, accountBalance, ccSwitchBalance, us
 						children: shortWindow(window$1.label)
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 						className: "dsh-subscription-usage-chip-value",
-						children: `${String(Math.round(window$1.usedPercent ?? 0))}%`
+						children: window$1.used !== void 0 && window$1.limit !== void 0 ? `${String(window$1.used)}/${String(window$1.limit)}` : `${String(Math.round(window$1.usedPercent ?? 0))}%`
 					})]
 				}, window$1.label))]
 			}),