dsh-plugin-subscription-oauth 0.3.0 → 0.5.0

package/lib/client/styles.js

@@ -243,7 +243,13 @@ ${scope} .dsh-subscription-disclosure:hover:not(:disabled) {
 ${scope} .dsh-subscription-meter {
   height: 6px;
   border-radius: 999px;
-  background: var(--dsw-alias-bg-layer-3, var(--dsw-alias-bg-layer-2));
+  /* The track must stay visible when nothing is spent — a 0 % window otherwise reads as
+     "no meter at all", which is the opposite of "nothing used". The layer token falls
+     back to the card's own colour on a host that does not define it, so the neutral is
+     explicit and translucent, and the inset ring keeps the empty track visible on a
+     light theme as well as a dark one. */
+  background: #8a8f9826;
+  box-shadow: inset 0 0 0 1px #8a8f9833;
   overflow: hidden;
 }
 ${scope} .dsh-subscription-meter > span {
@@ -255,3 +261,124 @@ ${scope} .dsh-subscription-meter > span[data-exhausted="true"] {
   background: var(--dsw-alias-state-error-primary, #b42318);
 }
 `;
+/**
+ * The composer usage chip's stylesheet.
+ *
+ * Separate from the page's, because the chip renders in the composer's own bar rather
+ * than inside either page container — the page stylesheet is scoped to those
+ * containers on purpose, so nothing here may leak into the shell.
+ *
+ * The chip inherits the bar's type and only draws a meter, so it sits beside the shell's
+ * own stats pills without looking like a second design. The trigger is a bare control:
+ * the host gives plugin markup no control classes, and a default `<button>` would
+ * otherwise read as a raised chip. Every token carries a fallback for hosts that do not
+ * define it.
+ */
+export const usageChipCss = `
+.dsh-subscription-usage-chip {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  /* The bar is a centred flex row whose children are this slot's entries followed by the
+     shell's context meter, and a list slot renders its entries as bare children (no
+     wrapper). So the chip is itself a flex item: a higher order places it after the
+     context meter, and no auto margin is set, so it sits immediately beside it rather
+     than being pushed to the edge of the bar. */
+  order: 1;
+  min-width: 0;
+  font-family: inherit;
+  font-size: 12px;
+  line-height: 1;
+}
+.dsh-subscription-usage-chip-trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  margin: 0;
+  padding: 2px 6px;
+  border: 0;
+  border-radius: var(--dsw-radius-sm, 6px);
+  background: transparent;
+  color: var(--dsw-alias-label-secondary, #8a8f98);
+  font: inherit;
+  cursor: pointer;
+}
+.dsh-subscription-usage-chip-trigger:hover {
+  background: var(--dsw-alias-interactive-bg-hover, #ffffff14);
+}
+.dsh-subscription-usage-chip-trigger:focus-visible {
+  outline: 2px solid var(--dsw-alias-border-focus, #4d6bfe);
+  outline-offset: 1px;
+}
+.dsh-subscription-usage-chip-label {
+  overflow: hidden;
+  max-width: 6ch;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.dsh-subscription-usage-chip-cell {
+  display: inline-flex;
+  align-items: baseline;
+  gap: 2px;
+}
+.dsh-subscription-usage-chip-window {
+  opacity: 0.75;
+}
+.dsh-subscription-usage-chip-value {
+  color: var(--dsw-alias-label-primary, #e8e8e8);
+  font-variant-numeric: tabular-nums;
+}
+.dsh-subscription-usage-chip-panel {
+  position: absolute;
+  bottom: calc(100% + 6px);
+  right: 0;
+  z-index: 20;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  min-width: 168px;
+  padding: 10px 12px;
+  border: 1px solid var(--dsw-alias-border-secondary, #ffffff1f);
+  border-radius: var(--dsw-radius-md, 10px);
+  background: var(--dsw-alias-bg-layer-2, #26262a);
+  box-shadow: var(--dsw-elevation-prominent, 0 12px 32px #0007);
+  color: var(--dsw-alias-label-primary, #e8e8e8);
+  white-space: nowrap;
+}
+.dsh-subscription-usage-chip-full {
+  font-size: 11px;
+  color: var(--dsw-alias-label-secondary, #8a8f98);
+}
+.dsh-subscription-usage-chip-meter {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.dsh-subscription-usage-chip-meterHead {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+  font-size: 12px;
+}
+.dsh-subscription-usage-chip-detail {
+  color: var(--dsw-alias-label-secondary, #8a8f98);
+  font-variant-numeric: tabular-nums;
+}
+.dsh-subscription-usage-chip-track {
+  display: block;
+  width: 100%;
+  height: 5px;
+  border-radius: 999px;
+  /* As on the settings meter: an unspent window has to show its track, so the neutral and
+     its ring are explicit rather than a layer token that may match the panel. */
+  background: #8a8f9826;
+  box-shadow: inset 0 0 0 1px #8a8f9833;
+  overflow: hidden;
+}
+.dsh-subscription-usage-chip-fill {
+  display: block;
+  height: 100%;
+  background: var(--dsw-alias-state-success-primary, #067647);
+}
+`;

package/lib/client/subscriptions-rpc.d.ts

@@ -8,7 +8,7 @@
  * @module dsh-plugin-subscription-oauth/client/subscriptions-rpc
  */
 import type { ConnectionHandle } from '@deepseek-ai/dsh-api-remotes/client';
-import type { RpcEndpoint, RpcMap } from '../protocol.js';
+import type { CcSwitchBalanceResult, RpcEndpoint, RpcMap } from '../protocol.js';
 /** A failed call: either the transport rejected or the endpoint answered `ok: false`. */
 export declare class SubscriptionsRpcError extends Error {
     readonly code: string;
@@ -16,9 +16,61 @@ export declare class SubscriptionsRpcError extends Error {
 }
 /** Call one endpoint, unwrapping the transport result. */
 export type SubscriptionsCall = <K extends RpcEndpoint>(endpoint: K, payload: RpcMap[K]['payload']) => Promise<RpcMap[K]['value']>;
+/** A caller for one manually added provider's cc-switch balance. */
+export interface CcSwitchBalanceCall {
+    (credentialRef: string): Promise<CcSwitchBalanceResult>;
+}
 /**
  * Bind a caller to one connection's RPC transport.
  * @param rpc - the browser connection's RPC caller.
  * @returns a typed caller for this plugin's endpoints.
  */
 export declare function createSubscriptionsCall(rpc: ConnectionHandle['rpc']): SubscriptionsCall;
+/**
+ * The DeepSeek account's wallet balances, as the host's account controller reports them.
+ *
+ * The controller answers `null` when the account is signed out, `{ status: 'failed' }`
+ * when the read did not complete, and `{ status: 'ready', value: <normal wallets>,
+ * bonusWallets: <bonus wallets> }` on success.
+ */
+export interface HostAccountBalance {
+    /** Normal (topped-up) wallets, one per currency. */
+    value: readonly {
+        currency: string;
+        balance: string;
+    }[];
+    /** Bonus / promotional wallets, one per currency. */
+    bonusWallets?: readonly {
+        currency: string;
+        balance: string;
+    }[];
+}
+/** A narrow caller for the host's own account controller. */
+export interface AccountBalanceCall {
+    (): Promise<HostAccountBalance | {
+        status: 'failed';
+    } | null>;
+}
+/**
+ * Read the DeepSeek account's balance through the host's own account controller.
+ *
+ * The host owns the DeepSeek OAuth grant and the platform endpoint, so this asks it
+ * rather than re-deriving either. It returns `null` when the account is signed out or
+ * the read fails, so a chip can simply not render in that case.
+ *
+ * @param rpc - the browser connection's RPC caller.
+ * @returns the balance, or null when there is nothing to show.
+ */
+export declare function createAccountBalanceCall(rpc: ConnectionHandle['rpc']): AccountBalanceCall;
+/**
+ * Read a manually added provider's balance through the plugin's cc-switch endpoint.
+ *
+ * The caller names the credential reference the provider's profile uses (its
+ * `apiKeyEnv`), and the host's credential service resolves it to the API key. The result
+ * is `undefined` when there is no key or the provider did not answer — never a wrong
+ * figure.
+ *
+ * @param rpc - the browser connection's RPC caller.
+ * @returns a narrow caller taking the credential reference.
+ */
+export declare function createCcSwitchBalanceCall(rpc: ConnectionHandle['rpc']): CcSwitchBalanceCall;

package/lib/client/subscriptions-rpc.js

@@ -10,6 +10,9 @@
 import { RPC_PREFIX } from '../protocol.js';
 /** The shared channel the node half's routes are mounted on. */
 const CHANNEL = '/api';
+/** The host's own DeepSeek account controller, from which the chip reads a balance. */
+const ACCOUNT_CHANNEL = '/api';
+const ACCOUNT_NAMESPACE = 'account';
 /** A failed call: either the transport rejected or the endpoint answered `ok: false`. */
 export class SubscriptionsRpcError extends Error {
     code;
@@ -42,3 +45,56 @@ export function createSubscriptionsCall(rpc) {
         return result.value;
     };
 }
+/**
+ * Read the DeepSeek account's balance through the host's own account controller.
+ *
+ * The host owns the DeepSeek OAuth grant and the platform endpoint, so this asks it
+ * rather than re-deriving either. It returns `null` when the account is signed out or
+ * the read fails, so a chip can simply not render in that case.
+ *
+ * @param rpc - the browser connection's RPC caller.
+ * @returns the balance, or null when there is nothing to show.
+ */
+export function createAccountBalanceCall(rpc) {
+    return async function call() {
+        let result;
+        try {
+            result = await rpc.call(ACCOUNT_CHANNEL, 'account/getBalance', {
+                version: '1',
+                locale: Intl.DateTimeFormat().resolvedOptions().locale ?? 'en-US',
+                timezoneOffsetSeconds: -new Date().getTimezoneOffset(),
+            });
+        }
+        catch (error) {
+            throw new SubscriptionsRpcError(messageOf(error), 'RPC_TRANSPORT');
+        }
+        if (!result.ok)
+            throw new SubscriptionsRpcError(result.error.message, result.error.code);
+        return result.value;
+    };
+}
+/**
+ * Read a manually added provider's balance through the plugin's cc-switch endpoint.
+ *
+ * The caller names the credential reference the provider's profile uses (its
+ * `apiKeyEnv`), and the host's credential service resolves it to the API key. The result
+ * is `undefined` when there is no key or the provider did not answer — never a wrong
+ * figure.
+ *
+ * @param rpc - the browser connection's RPC caller.
+ * @returns a narrow caller taking the credential reference.
+ */
+export function createCcSwitchBalanceCall(rpc) {
+    return async function call(credentialRef) {
+        let result;
+        try {
+            result = await rpc.call(CHANNEL, `${RPC_PREFIX}ccswitch-balance`, { credentialRef });
+        }
+        catch (error) {
+            throw new SubscriptionsRpcError(messageOf(error), 'RPC_TRANSPORT');
+        }
+        if (!result.ok)
+            throw new SubscriptionsRpcError(result.error.message, result.error.code);
+        return result.value;
+    };
+}