dsh-plugin-subscriptions 0.5.2 → 0.5.3

package/lib/client.js

@@ -39,15 +39,19 @@ const en = {
 	unavailable: "Connection unavailable; subscription status cannot be loaded.",
 	checking: "Checking…",
 	loginInProgress: "Login in progress…",
-	loggedIn: "Logged in",
-	loggedInAccount: "Logged in as {account}",
-	loggedInExpires: "Logged in · expires {date}",
-	loggedInAccountExpires: "Logged in as {account} · expires {date}",
 	notLoggedIn: "Not logged in",
+	loggedInCount: "{count} account(s) connected",
+	accountExpires: "expires {date}",
+	defaultBadge: "Default",
+	setDefault: "Set as default",
+	addAccount: "Add account",
+	addAccountOAuth: "Browser authorization",
+	addAccountKeychain: "Import Claude Code",
+	addAccountHint: "Browser authorization signs in whichever account the browser currently uses — switch accounts there first (or use an incognito window with the manual code below) to add a different one.",
 	login: "Log in",
 	cancel: "Cancel",
 	logout: "Log out",
-	logoutConfirm: "Log out of {provider}?",
+	logoutAccountConfirm: "Log out {account} of {provider}?",
 	manualSummary: "Browser flow not working? Paste the callback URL or code",
 	manualPlaceholder: "Paste the callback URL or code",
 	submit: "Submit",
@@ -124,15 +128,19 @@ const zh = {
 	unavailable: "连接不可用，无法加载订阅状态。",
 	checking: "查询中…",
 	loginInProgress: "登录中…",
-	loggedIn: "已登录",
-	loggedInAccount: "已登录：{account}",
-	loggedInExpires: "已登录 · 过期时间 {date}",
-	loggedInAccountExpires: "已登录：{account} · 过期时间 {date}",
 	notLoggedIn: "未登录",
+	loggedInCount: "已连接 {count} 个账号",
+	accountExpires: "过期时间 {date}",
+	defaultBadge: "默认",
+	setDefault: "设为默认",
+	addAccount: "添加账号",
+	addAccountOAuth: "浏览器授权",
+	addAccountKeychain: "导入 Claude Code",
+	addAccountHint: "浏览器授权以浏览器当前登录的账号为准；要添加不同账号，请先在浏览器里切换账号，或用无痕窗口走下方手动授权码。",
 	login: "登录",
 	cancel: "取消",
 	logout: "退出登录",
-	logoutConfirm: "确定退出 {provider} 的登录吗？",
+	logoutAccountConfirm: "确定退出 {provider} 的账号 {account} 吗？",
 	manualSummary: "浏览器流程无法完成？粘贴回调 URL 或授权码",
 	manualPlaceholder: "粘贴回调 URL 或授权码",
 	submit: "提交",
@@ -252,6 +260,14 @@ async function callSubscriptionsAuth(rpc, endpoint, payload) {
 function messageOf(error) {
 	return error instanceof Error ? error.message : String(error);
 }
+/** Copy a keyed map without the entries whose key is not in `live`. */
+function dropStale(map, live) {
+	const stale = Object.keys(map).filter((key) => !live.has(key));
+	if (stale.length === 0) return map;
+	const next = { ...map };
+	for (const key of stale) delete next[key];
+	return next;
+}
 /**
 * English-dictionary fallback for a missing inject `t` (standalone renders);
 * the slot inject always supplies the locale-bound one.
@@ -399,6 +415,36 @@ const styles$4 = {
 		lineHeight: "18px",
 		color: "var(--dsw-alias-label-tertiary)"
 	},
+	accountRow: {
+		display: "flex",
+		flexDirection: "column",
+		gap: 6,
+		border: "1px solid var(--dsw-alias-border-l2)",
+		borderRadius: 8,
+		padding: "8px 10px",
+		marginTop: 4
+	},
+	accountHeader: {
+		display: "flex",
+		alignItems: "center",
+		gap: 8
+	},
+	accountName: {
+		fontSize: 13,
+		lineHeight: "20px",
+		color: "var(--dsw-alias-label-primary)",
+		userSelect: "all"
+	},
+	starButton: {
+		border: "none",
+		background: "transparent",
+		padding: 0,
+		font: "inherit",
+		fontSize: 14,
+		lineHeight: "20px",
+		cursor: "pointer",
+		color: "var(--dsw-alias-state-warn-label)"
+	},
 	usageTrack: {
 		height: 6,
 		borderRadius: 3,
@@ -541,7 +587,7 @@ const styles$4 = {
 /** Status dot color for one provider state. */
 function dotColor(status) {
 	if (status?.busy === true) return "var(--dsw-alias-state-warn-label)";
-	if (status?.loggedIn === true) return "var(--dsw-alias-state-success-primary)";
+	if ((status?.accounts.length ?? 0) > 0) return "var(--dsw-alias-state-success-primary)";
 	return "var(--dsw-alias-label-dimmed)";
 }
 /**
@@ -553,15 +599,7 @@ function dotColor(status) {
 function statusText(t, status) {
 	if (status === void 0) return t("checking");
 	if (status.busy) return t("loginInProgress");
-	if (status.loggedIn) {
-		const params = {};
-		if (status.account !== void 0) params.account = status.account;
-		if (status.expiresAt !== void 0) params.date = new Date(status.expiresAt).toLocaleString();
-		if (params.account !== void 0 && params.date !== void 0) return t("loggedInAccountExpires", params);
-		if (params.account !== void 0) return t("loggedInAccount", params);
-		if (params.date !== void 0) return t("loggedInExpires", params);
-		return t("loggedIn");
-	}
+	if (status.accounts.length > 0) return t("loggedInCount", { count: status.accounts.length });
 	return t("notLoggedIn");
 }
 /**
@@ -611,12 +649,13 @@ function SubscriptionsSection(props) {
 	/** Pending device-flow codes (copilot), shown while the attempt polls. */
 	const [deviceCodes, setDeviceCodes] = (0, react.useState)({});
 	const [copiedCode, setCopiedCode] = (0, react.useState)(void 0);
+	/** Usage snapshots keyed `${provider}:${accountKey}` — every account tracks its own windows. */
 	const [usages, setUsages] = (0, react.useState)({});
 	const [usageErrors, setUsageErrors] = (0, react.useState)({});
 	const [usageLoading, setUsageLoading] = (0, react.useState)({});
 	const mountedRef = (0, react.useRef)(true);
 	const pollersRef = (0, react.useRef)(/* @__PURE__ */ new Map());
-	/** Providers with a `usage` call in flight; guards the auto-fetch effect against re-entry. */
+	/** Accounts with a `usage` call in flight; guards the auto-fetch effect against re-entry. */
 	const usageInflightRef = (0, react.useRef)(/* @__PURE__ */ new Set());
 	/** Proxy config as last answered by `proxyGet`/`proxySet`. */
 	const [proxy, setProxy] = (0, react.useState)(void 0);
@@ -662,7 +701,7 @@ function SubscriptionsSection(props) {
 		setStatuses(response.providers);
 		for (const { id } of PROVIDERS) {
 			const status = response.providers[id];
-			if (status.loggedIn || !status.busy) {
+			if (status.accounts.length > 0 || !status.busy) {
 				stopPolling(id);
 				setDeviceCodes((prev) => {
 					if (prev[id] === void 0) return prev;
@@ -694,68 +733,65 @@ function SubscriptionsSection(props) {
 			pollersRef.current.clear();
 		};
 	}, [refresh, startPolling]);
-	const loadUsage = (0, react.useCallback)(async (provider) => {
-		if (rpc === void 0 || usageInflightRef.current.has(provider)) return;
-		usageInflightRef.current.add(provider);
+	const loadUsage = (0, react.useCallback)(async (provider, account) => {
+		const key = `${provider}:${account}`;
+		if (rpc === void 0 || usageInflightRef.current.has(key)) return;
+		usageInflightRef.current.add(key);
 		setUsageLoading((prev) => ({
 			...prev,
-			[provider]: true
+			[key]: true
 		}));
 		try {
-			const usage = await callSubscriptionsAuth(rpc, "usage", { provider });
+			const usage = await callSubscriptionsAuth(rpc, "usage", {
+				provider,
+				account
+			});
 			if (!mountedRef.current) return;
 			setUsages((prev) => ({
 				...prev,
-				[provider]: usage
+				[key]: usage
 			}));
 			setUsageErrors((prev) => {
 				const next = { ...prev };
-				delete next[provider];
+				delete next[key];
 				return next;
 			});
 		} catch (error) {
 			if (mountedRef.current) setUsageErrors((prev) => ({
 				...prev,
-				[provider]: messageOf(error)
+				[key]: messageOf(error)
 			}));
 		} finally {
-			usageInflightRef.current.delete(provider);
+			usageInflightRef.current.delete(key);
 			if (mountedRef.current) setUsageLoading((prev) => ({
 				...prev,
-				[provider]: false
+				[key]: false
 			}));
 		}
 	}, [rpc]);
 	(0, react.useEffect)(() => {
-		for (const { id } of PROVIDERS) {
-			const status = statuses[id];
-			if (status === void 0) continue;
-			if (status.loggedIn) {
-				if (usages[id] === void 0 && usageErrors[id] === void 0) loadUsage(id);
-			} else if (usages[id] !== void 0 || usageErrors[id] !== void 0) {
-				setUsages((prev) => {
-					const next = { ...prev };
-					delete next[id];
-					return next;
-				});
-				setUsageErrors((prev) => {
-					const next = { ...prev };
-					delete next[id];
-					return next;
-				});
-			}
+		const live = /* @__PURE__ */ new Set();
+		for (const { id } of PROVIDERS) for (const account of statuses[id]?.accounts ?? []) {
+			const key = `${id}:${account.key}`;
+			live.add(key);
+			if (usages[key] === void 0 && usageErrors[key] === void 0) loadUsage(id, account.key);
 		}
+		setUsages((prev) => dropStale(prev, live));
+		setUsageErrors((prev) => dropStale(prev, live));
 	}, [
 		statuses,
 		usages,
 		usageErrors,
 		loadUsage
 	]);
-	const login = (0, react.useCallback)(async (provider) => {
+	const login = (0, react.useCallback)(async (provider, method) => {
 		if (rpc === void 0) return;
 		setProviderError(provider, void 0);
 		try {
-			const response = await callSubscriptionsAuth(rpc, "login", { provider });
+			const response = await callSubscriptionsAuth(rpc, "login", {
+				provider,
+				...method === void 0 ? {} : { method }
+			});
 			if (typeof response.authorizeUrl === "string" && response.authorizeUrl === "") {
 				await refresh();
 				return;
@@ -765,9 +801,9 @@ function SubscriptionsSection(props) {
 			setStatuses((prev) => ({
 				...prev,
 				[provider]: {
+					accounts: prev[provider]?.accounts ?? [],
 					...prev[provider],
-					busy: true,
-					loggedIn: false
+					busy: true
 				}
 			}));
 			if (typeof response.userCode === "string" && response.userCode.length > 0) setDeviceCodes((prev) => ({
@@ -827,12 +863,18 @@ function SubscriptionsSection(props) {
 		setProviderError,
 		refresh
 	]);
-	const logout = (0, react.useCallback)(async (provider, name) => {
+	const logout = (0, react.useCallback)(async (provider, account, display, name) => {
 		if (rpc === void 0) return;
-		if (!window.confirm(t("logoutConfirm", { provider: name }))) return;
+		if (!window.confirm(t("logoutAccountConfirm", {
+			provider: name,
+			account: display
+		}))) return;
 		setProviderError(provider, void 0);
 		try {
-			await callSubscriptionsAuth(rpc, "logout", { provider });
+			await callSubscriptionsAuth(rpc, "logout", {
+				provider,
+				account
+			});
 		} catch (error) {
 			setProviderError(provider, messageOf(error));
 		}
@@ -843,6 +885,23 @@ function SubscriptionsSection(props) {
 		setProviderError,
 		refresh
 	]);
+	const setDefault = (0, react.useCallback)(async (provider, account) => {
+		if (rpc === void 0) return;
+		setProviderError(provider, void 0);
+		try {
+			await callSubscriptionsAuth(rpc, "setDefault", {
+				provider,
+				account
+			});
+		} catch (error) {
+			setProviderError(provider, messageOf(error));
+		}
+		await refresh();
+	}, [
+		rpc,
+		setProviderError,
+		refresh
+	]);
 	const copyDeviceCode = (0, react.useCallback)((provider, userCode) => {
 		navigator.clipboard?.writeText(userCode).then(() => {
 			if (!mountedRef.current) return;
@@ -993,9 +1052,7 @@ function SubscriptionsSection(props) {
 				const status = statuses[id];
 				const busy = status?.busy === true;
 				const deviceCode = deviceCodes[id];
-				const usage = usages[id];
-				const usageError = usageErrors[id];
-				const showUsage = status?.loggedIn === true && usage?.supported !== false && (usage !== void 0 || usageError !== void 0 || usageLoading[id] === true);
+				const accounts = status?.accounts ?? [];
 				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					style: styles$4.card,
 					children: [
@@ -1021,10 +1078,119 @@ function SubscriptionsSection(props) {
 							style: styles$4.errorLine,
 							children: errors[id]
 						}),
+						accounts.map((account) => {
+							const usageKey = `${id}:${account.key}`;
+							const usage = usages[usageKey];
+							const usageError = usageErrors[usageKey];
+							const display = account.account ?? account.key;
+							const showUsage = usage?.supported !== false && (usage !== void 0 || usageError !== void 0 || usageLoading[usageKey] === true);
+							return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								style: styles$4.accountRow,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									style: styles$4.accountHeader,
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											style: styles$4.starButton,
+											title: account.isDefault ? t("defaultBadge") : t("setDefault"),
+											onClick: () => {
+												if (!account.isDefault) setDefault(id, account.key);
+											},
+											children: account.isDefault ? "★" : "☆"
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											style: styles$4.accountName,
+											children: display
+										}),
+										account.plan !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											style: styles$4.usagePlan,
+											children: account.plan
+										}),
+										account.expiresAt !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+											style: styles$4.statusLine,
+											children: t("accountExpires", { date: new Date(account.expiresAt).toLocaleString() })
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+											type: "button",
+											style: {
+												...styles$4.button,
+												marginLeft: "auto",
+												flexShrink: 0
+											},
+											onClick: () => {
+												logout(id, account.key, display, name);
+											},
+											children: t("logout")
+										})
+									]
+								}), showUsage && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									style: styles$4.usage,
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+											style: styles$4.usageHeader,
+											children: [
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+													style: styles$4.usageTitle,
+													children: t("usageTitle")
+												}),
+												usage?.plan !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+													style: styles$4.usagePlan,
+													children: t("usagePlan", { plan: usage.plan })
+												}),
+												/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+													type: "button",
+													style: {
+														...styles$4.usageRefresh,
+														...usageLoading[usageKey] === true ? {
+															opacity: .5,
+															cursor: "default"
+														} : {}
+													},
+													disabled: usageLoading[usageKey] === true,
+													onClick: () => {
+														loadUsage(id, account.key);
+													},
+													children: t("usageRefresh")
+												})
+											]
+										}),
+										usage === void 0 && usageError === void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+											style: styles$4.statusLine,
+											children: t("usageLoading")
+										}),
+										usageError !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+											style: styles$4.errorLine,
+											children: t("usageError", { message: usageError })
+										}),
+										usage?.windows !== void 0 && usage.windows.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+											style: styles$4.statusLine,
+											children: t("usageEmpty")
+										}),
+										(usage?.windows ?? []).map((window$1, index) => {
+											const percent = Math.min(100, Math.max(0, window$1.usedPercent));
+											return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+												style: styles$4.usageRow,
+												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+													style: styles$4.usageMeta,
+													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: usageWindowLabel(t, window$1) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [`${String(Math.round(percent))}%`, window$1.resetsAt !== void 0 && ` · ${t("usageResets", { date: new Date(window$1.resetsAt).toLocaleString() })}`] })]
+												}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+													style: styles$4.usageTrack,
+													children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { style: {
+														...styles$4.usageFill,
+														width: `${String(percent)}%`,
+														background: usageBarColor(percent)
+													} })
+												})]
+											}, index);
+										})
+									]
+								})]
+							}, account.key);
+						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							style: styles$4.actions,
 							children: [
-								!busy && status?.loggedIn !== true && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								!busy && accounts.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									style: styles$4.button,
 									onClick: () => {
@@ -1032,85 +1198,42 @@ function SubscriptionsSection(props) {
 									},
 									children: t("login")
 								}),
-								busy && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								!busy && accounts.length > 0 && id === "claude" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									style: styles$4.button,
 									onClick: () => {
-										cancel(id);
+										login(id, "oauth");
 									},
-									children: t("cancel")
+									children: t("addAccountOAuth")
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									style: styles$4.button,
+									onClick: () => {
+										login(id, "keychain");
+									},
+									children: t("addAccountKeychain")
+								})] }),
+								!busy && accounts.length > 0 && id !== "claude" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									style: styles$4.button,
+									onClick: () => {
+										login(id);
+									},
+									children: t("addAccount")
 								}),
-								status?.loggedIn === true && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								busy && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									style: styles$4.button,
 									onClick: () => {
-										logout(id, name);
+										cancel(id);
 									},
-									children: t("logout")
+									children: t("cancel")
 								})
 							]
 						}),
-						showUsage && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							style: styles$4.usage,
-							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									style: styles$4.usageHeader,
-									children: [
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											style: styles$4.usageTitle,
-											children: t("usageTitle")
-										}),
-										usage?.plan !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-											style: styles$4.usagePlan,
-											children: t("usagePlan", { plan: usage.plan })
-										}),
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-											type: "button",
-											style: {
-												...styles$4.usageRefresh,
-												...usageLoading[id] === true ? {
-													opacity: .5,
-													cursor: "default"
-												} : {}
-											},
-											disabled: usageLoading[id] === true,
-											onClick: () => {
-												loadUsage(id);
-											},
-											children: t("usageRefresh")
-										})
-									]
-								}),
-								usage === void 0 && usageError === void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-									style: styles$4.statusLine,
-									children: t("usageLoading")
-								}),
-								usageError !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-									style: styles$4.errorLine,
-									children: t("usageError", { message: usageError })
-								}),
-								usage?.windows !== void 0 && usage.windows.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-									style: styles$4.statusLine,
-									children: t("usageEmpty")
-								}),
-								(usage?.windows ?? []).map((window$1, index) => {
-									const percent = Math.min(100, Math.max(0, window$1.usedPercent));
-									return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-										style: styles$4.usageRow,
-										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-											style: styles$4.usageMeta,
-											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: usageWindowLabel(t, window$1) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [`${String(Math.round(percent))}%`, window$1.resetsAt !== void 0 && ` · ${t("usageResets", { date: new Date(window$1.resetsAt).toLocaleString() })}`] })]
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-											style: styles$4.usageTrack,
-											children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { style: {
-												...styles$4.usageFill,
-												width: `${String(percent)}%`,
-												background: usageBarColor(percent)
-											} })
-										})]
-									}, index);
-								})
-							]
+						!busy && accounts.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							style: styles$4.statusLine,
+							children: t("addAccountHint")
 						}),
 						busy && deviceCode !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							style: styles$4.deviceCode,