@dsh-plus/secret-env 0.1.0

package/src/api.ts

@@ -0,0 +1,154 @@
+/**
+ * secret-env HTTP 端点：GET list / POST global.set / global.unset / session.set / session.unset。
+ * 与 dsh web 同源（webServer 默认 loopback / 反代信任域），无独立鉴权
+ * （与 usage-panel/notify-email 自定义端点同一暴露面约定）。
+ * 值只在「浏览器 → 本端点 → 服务」链路出现，响应永不回显值。
+ * @module secret-env/api
+ */
+import type { IncomingMessage, ServerResponse } from 'node:http'
+
+import type { Context } from '@deepseek-ai/cordis'
+import type {} from '@deepseek-ai/dsh-host-webserver'
+import { SecretEnvError } from './errors.ts'
+import { normalizeSuffix, validateSuffix } from './names.ts'
+import type { SecretEnvService } from './service.ts'
+
+const ROUTE = '/dsh-plus/secret-env'
+
+function sendJson(res: ServerResponse, status: number, body: unknown): void {
+  res.writeHead(status, { 'content-type': 'application/json; charset=utf-8' })
+  res.end(JSON.stringify(body))
+}
+
+function readBody(req: IncomingMessage): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const chunks: Buffer[] = []
+    req.on('data', (chunk: Buffer) => chunks.push(chunk))
+    req.on('end', () => resolve(Buffer.concat(chunks).toString('utf8')))
+    req.on('error', reject)
+  })
+}
+
+/** 解析并校验请求里的变量名后缀；失败抛 SecretEnvError。 */
+function readSuffix(raw: unknown): string {
+  if (typeof raw !== 'string') throw new SecretEnvError('invalid-name', 'name must be a string')
+  const suffix = normalizeSuffix(raw)
+  const failure = validateSuffix(suffix)
+  if (failure !== null) throw new SecretEnvError('invalid-name', `invalid name: ${failure}`)
+  return suffix
+}
+
+function readString(raw: unknown): string {
+  return typeof raw === 'string' ? raw : ''
+}
+
+/** 错误 → HTTP 映射（值类错误 400，遮蔽/冲突 409，其余 500；均只带错误码与消息）。 */
+function sendError(res: ServerResponse, error: unknown): void {
+  if (error instanceof SecretEnvError) {
+    const status = error.code === 'shadowed' || error.code === 'conflict' ? 409 : 400
+    sendJson(res, status, { ok: false, error: error.code, message: error.message })
+    return
+  }
+  sendJson(res, 500, { ok: false, error: 'internal' })
+}
+
+/** 注册端点（webServer 缺席时由调用方保证不调用）。 */
+export function registerSecretEnvApi(ctx: Context, service: SecretEnvService): void {
+  const logger = ctx.logger('secret-env')
+  const guard = (label: string, run: () => Promise<void>, res: ServerResponse): void => {
+    run().catch((error: unknown) => {
+      if (!(error instanceof SecretEnvError)) {
+        logger.warn(`${label} failed: ${error instanceof Error ? error.message : String(error)}`)
+      }
+      sendError(res, error)
+    })
+  }
+
+  ctx.webServer.register({
+    kind: 'prefix',
+    path: `${ROUTE}/list`,
+    handler: async (req, res) => {
+      const url = new URL(req.url ?? '', 'http://localhost')
+      const sessionId = url.searchParams.get('sessionId') ?? undefined
+      guard('list', async () => sendJson(res, 200, await service.list(sessionId)), res)
+    },
+  })
+
+  ctx.webServer.register({
+    kind: 'prefix',
+    path: `${ROUTE}/global/set`,
+    handler: async (req, res) => {
+      guard(
+        'global/set',
+        async () => {
+          if (req.method !== 'POST') throw new SecretEnvError('method', 'POST only')
+          const body = JSON.parse(await readBody(req)) as Record<string, unknown>
+          await service.setGlobal(
+            readSuffix(body.name),
+            readString(body.value),
+            readString(body.description),
+          )
+          sendJson(res, 200, { ok: true })
+        },
+        res,
+      )
+    },
+  })
+
+  ctx.webServer.register({
+    kind: 'prefix',
+    path: `${ROUTE}/global/unset`,
+    handler: async (req, res) => {
+      guard(
+        'global/unset',
+        async () => {
+          if (req.method !== 'POST') throw new SecretEnvError('method', 'POST only')
+          const body = JSON.parse(await readBody(req)) as Record<string, unknown>
+          await service.unsetGlobal(readSuffix(body.name))
+          sendJson(res, 200, { ok: true })
+        },
+        res,
+      )
+    },
+  })
+
+  ctx.webServer.register({
+    kind: 'prefix',
+    path: `${ROUTE}/session/set`,
+    handler: async (req, res) => {
+      guard(
+        'session/set',
+        async () => {
+          if (req.method !== 'POST') throw new SecretEnvError('method', 'POST only')
+          const body = JSON.parse(await readBody(req)) as Record<string, unknown>
+          service.setSession(
+            readString(body.sessionId),
+            readSuffix(body.name),
+            readString(body.value),
+            readString(body.description),
+            body.once === true,
+          )
+          sendJson(res, 200, { ok: true })
+        },
+        res,
+      )
+    },
+  })
+
+  ctx.webServer.register({
+    kind: 'prefix',
+    path: `${ROUTE}/session/unset`,
+    handler: async (req, res) => {
+      guard(
+        'session/unset',
+        async () => {
+          if (req.method !== 'POST') throw new SecretEnvError('method', 'POST only')
+          const body = JSON.parse(await readBody(req)) as Record<string, unknown>
+          service.unsetSession(readString(body.sessionId), readSuffix(body.name))
+          sendJson(res, 200, { ok: true })
+        },
+        res,
+      )
+    },
+  })
+}

package/src/client/api.ts

@@ -0,0 +1,76 @@
+/**
+ * 数据端点通道：GET list / POST set/unset（同源 fetch，值不上行到任何对话通道）。
+ * @module secret-env/client/api
+ */
+import { getJson, postJson } from '@dsh-plus/shared/client'
+
+export interface GlobalWireEntry {
+  name: string
+  envName: string
+  description: string
+  configured: boolean
+  source?: string
+  writable: boolean
+}
+
+export interface SessionWireEntry {
+  name: string
+  envName: string
+  description: string
+  once: boolean
+  createdAt: string
+}
+
+export interface SecretList {
+  global: GlobalWireEntry[]
+  session: SessionWireEntry[]
+}
+
+interface WriteResult {
+  ok: boolean
+  error?: string
+  message?: string
+}
+
+/** 端点错误：携带结构化错误码，UI 按码映射文案。 */
+export class ApiError extends Error {
+  constructor(readonly code: string) {
+    super(code)
+  }
+}
+
+export async function fetchSecrets(sessionId?: string): Promise<SecretList> {
+  const query = sessionId === undefined ? '' : `?sessionId=${encodeURIComponent(sessionId)}`
+  return getJson<SecretList>(`/dsh-plus/secret-env/list${query}`)
+}
+
+async function write(path: string, body: Record<string, unknown>): Promise<void> {
+  try {
+    // 非 2xx 时 postJson 抛 Error(body.error)，message 即结构化错误码。
+    await postJson<WriteResult>(`/dsh-plus/secret-env/${path}`, body)
+  } catch (error) {
+    throw new ApiError(error instanceof Error ? error.message : 'internal')
+  }
+}
+
+export function setGlobal(name: string, value: string, description: string): Promise<void> {
+  return write('global/set', { name, value, description })
+}
+
+export function unsetGlobal(name: string): Promise<void> {
+  return write('global/unset', { name })
+}
+
+export function setSession(
+  sessionId: string,
+  name: string,
+  value: string,
+  description: string,
+  once: boolean,
+): Promise<void> {
+  return write('session/set', { sessionId, name, value, description, once })
+}
+
+export function unsetSession(sessionId: string, name: string): Promise<void> {
+  return write('session/unset', { sessionId, name })
+}

package/src/client/client.ts

@@ -0,0 +1,77 @@
+/**
+ * 浏览器半入口：
+ * - settings.section 官方插槽注册「密钥变量」独立设置页（全局管理）；
+ * - conversation.input.right session 作用域插槽注册 composer 钥匙胶囊
+ *   （会话级密钥面板；会话 id 由插槽 inject 工厂直接供给）。
+ * 数据均经同源 HTTP 端点（值不上行经任何对话通道）。
+ * @module @dsh-plus/secret-env/client
+ */
+import type { Context } from '@deepseek-ai/cordis'
+
+import { ComposerSecret } from './composer.tsx'
+import { en, NS, zh } from './i18n.ts'
+import { SecretsSection } from './section.tsx'
+import { injectSecretEnvStyle } from './styles.ts'
+
+export const name = 'dsh-plus-secret-env'
+
+/** 浏览器半需要的 cordis 服务 key（loader 据此注入；package.json 的 dsh.client.inject 管包加载顺序）。 */
+export const inject = ['slots', 'locale'] as const
+
+interface SlotsLike {
+  inject(key: string, callback: () => unknown): unknown
+  register(options: Record<string, unknown>, component: unknown): () => void
+}
+
+interface LocaleLike {
+  register(ns: string, dict: { zh: Record<string, string>; en: Record<string, string> }): () => void
+  bind(ns: string): (key: string) => string
+}
+
+interface ClientContext {
+  slots: SlotsLike
+  locale: LocaleLike
+  effect(execute: () => () => void, label?: string): unknown
+}
+
+export function apply(ctx: Context): void {
+  const c = ctx as unknown as ClientContext
+  const styleTag = injectSecretEnvStyle('@dsh-plus/secret-env')
+  c.effect(
+    () => () => {
+      styleTag?.remove()
+    },
+    'secret-env: style',
+  )
+  c.effect(() => c.locale.register(NS, { zh, en }), 'secret-env: locale')
+
+  const t = c.locale.bind(NS)
+  // 独立设置页（settings.section：官方设置导航；order 16 排在用量统计之后）。
+  c.slots.inject('settings.section', () =>
+    c.slots.register(
+      {
+        name: 'settings.section',
+        id: 'dsh-plus-secret-env',
+        order: 16,
+        label: () => t('nav'),
+        inject: () => ({ t }),
+      },
+      SecretsSection,
+    ),
+  )
+
+  // composer 工具行钥匙胶囊（conversation.input.right：session 作用域 list 槽，
+  // inject 工厂收框架解析的 sessionId）。
+  c.slots.inject('conversation.input.right', () =>
+    c.slots.register(
+      {
+        name: 'conversation.input.right',
+        id: 'dsh-plus-secret-env',
+        order: 40,
+        locale: NS,
+        inject: (sessionId: string) => ({ sessionId }),
+      },
+      ComposerSecret,
+    ),
+  )
+}

package/src/client/common.ts

@@ -0,0 +1,32 @@
+/**
+ * 浏览器半共享小件：错误码文案映射与复制助手（设置页与会话控件共用）。
+ * @module secret-env/client/common
+ */
+import { ApiError } from './api.ts'
+
+/** 端点错误 → 本地化文案（未知码回落 internal）。 */
+export function errorText(t: (key: string) => string, error: unknown): string {
+  const code = error instanceof ApiError ? error.code : 'internal'
+  const text = t(`error.${code}`)
+  // locale.bind 对缺失键原样回显键名，据此判断回落。
+  return text === `error.${code}` ? t('error.internal') : text
+}
+
+/** 复制文本到剪贴板（clipboard API 缺席时退 execCommand）。 */
+export async function copyText(text: string): Promise<boolean> {
+  try {
+    await navigator.clipboard.writeText(text)
+    return true
+  } catch {
+    // 回落：非安全上下文（如非 localhost 直连）无 clipboard API。
+    const area = document.createElement('textarea')
+    area.value = text
+    area.style.position = 'fixed'
+    area.style.opacity = '0'
+    document.body.appendChild(area)
+    area.select()
+    const ok = document.execCommand('copy')
+    area.remove()
+    return ok
+  }
+}

package/src/client/composer.tsx

@@ -0,0 +1,260 @@
+/**
+ * 会话注入控件（conversation.input.right 官方插槽，session 作用域）：
+ * composer 工具行的钥匙胶囊，弹出本会话的会话级密钥面板（列表 + 增删）。
+ * 会话 id 由插槽 inject 工厂直接供给（框架解析的严格 session 作用域）。
+ * 窄屏（≤767px）popover 转底部抽屉；桌面点外部或 Esc 关闭。
+ * @module secret-env/client/composer
+ */
+import { type ReactElement, useEffect, useRef, useState } from 'react'
+
+import { fetchSecrets, type SessionWireEntry, setSession, unsetSession } from './api.ts'
+import { copyText, errorText } from './common.ts'
+
+export interface ComposerSecretProps {
+  /** 插槽 inject 工厂注入的当前会话 id（严格 session 作用域，必存在）。 */
+  sessionId: string
+  t(key: string): string
+}
+
+interface FormState {
+  name: string
+  value: string
+  description: string
+  once: boolean
+}
+
+const EMPTY_FORM: FormState = { name: '', value: '', description: '', once: false }
+
+function SessionRow(props: {
+  t: ComposerSecretProps['t']
+  sessionId: string
+  entry: SessionWireEntry
+  onDeleted(): void
+  onError(text: string): void
+}): ReactElement {
+  const { t, entry } = props
+  const [copied, setCopied] = useState(false)
+  const timer = useRef<ReturnType<typeof setTimeout> | null>(null)
+
+  useEffect(
+    () => () => {
+      if (timer.current !== null) clearTimeout(timer.current)
+    },
+    [],
+  )
+
+  return (
+    <div className="dse-row">
+      <div className="dse-rowMain">
+        <div className="dse-env">
+          <span className="dse-envName">${entry.envName}</span>
+          <button
+            type="button"
+            className="dse-iconBtn"
+            title={t('copy')}
+            aria-label={t('copy')}
+            onClick={() => {
+              void copyText(`$${entry.envName}`).then((ok) => {
+                if (!ok) return
+                setCopied(true)
+                if (timer.current !== null) clearTimeout(timer.current)
+                timer.current = setTimeout(() => setCopied(false), 1500)
+              })
+            }}
+          >
+            {copied ? '✓' : '⧉'}
+          </button>
+        </div>
+        {entry.description !== '' ? <span className="dse-note">{entry.description}</span> : null}
+      </div>
+      <div className="dse-badges">
+        {entry.once ? <span className="dse-badge">{t('scopeOnce')}</span> : null}
+        <button
+          type="button"
+          className="dse-iconBtn dse-delBtn"
+          title={t('delete')}
+          aria-label={t('delete')}
+          onClick={() => {
+            unsetSession(props.sessionId, entry.name)
+              .then(() => props.onDeleted())
+              .catch((error: unknown) => props.onError(errorText(t, error)))
+          }}
+        >
+          ✕
+        </button>
+      </div>
+    </div>
+  )
+}
+
+export function ComposerSecret(props: ComposerSecretProps): ReactElement {
+  const { sessionId, t } = props
+  const [open, setOpen] = useState(false)
+  const [items, setItems] = useState<SessionWireEntry[] | null>(null)
+  const [form, setForm] = useState<FormState>(EMPTY_FORM)
+  const [saving, setSaving] = useState(false)
+  const [status, setStatus] = useState<string | null>(null)
+  const wrapRef = useRef<HTMLSpanElement | null>(null)
+
+  const load = (): void => {
+    fetchSecrets(sessionId)
+      .then((list) => setItems(list.session))
+      .catch(() => setStatus(errorText(t, new Error('internal'))))
+  }
+
+  // 打开面板与会话切换时拉取；闭合计时清零。
+  // biome-ignore lint/correctness/useExhaustiveDependencies: load 为闭包稳定函数，仅需随 open/sessionId 触发
+  useEffect(() => {
+    if (!open) return
+    load()
+  }, [open, sessionId])
+
+  // 桌面：点外部 / Esc 关闭。
+  useEffect(() => {
+    if (!open) return
+    const onDown = (event: MouseEvent): void => {
+      if (wrapRef.current !== null && !wrapRef.current.contains(event.target as Node)) {
+        setOpen(false)
+      }
+    }
+    const onKey = (event: KeyboardEvent): void => {
+      if (event.key === 'Escape') setOpen(false)
+    }
+    document.addEventListener('mousedown', onDown)
+    document.addEventListener('keydown', onKey)
+    return () => {
+      document.removeEventListener('mousedown', onDown)
+      document.removeEventListener('keydown', onKey)
+    }
+  }, [open])
+
+  const onSave = (): void => {
+    setSaving(true)
+    setStatus(null)
+    setSession(sessionId, form.name, form.value, form.description, form.once)
+      .then(() => {
+        setForm(EMPTY_FORM)
+        load()
+      })
+      .catch((error: unknown) => setStatus(errorText(t, error)))
+      .finally(() => setSaving(false))
+  }
+
+  const count = items?.length ?? 0
+  const canSave = form.name.trim() !== '' && form.value !== '' && !saving
+
+  return (
+    <span className="dse-wrap" ref={wrapRef}>
+      <button
+        type="button"
+        className="dse-chip"
+        aria-expanded={open}
+        aria-label={t('sessionSecrets')}
+        title={t('sessionSecrets')}
+        onClick={() => setOpen(!open)}
+      >
+        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" aria-hidden="true">
+          <path
+            d="M14.5 2a7.5 7.5 0 0 0-7.36 9.04L2 20.19V22h1.81l1.5-1.5v-1.81h1.81v-1.81h1.81l1.22-1.22A7.5 7.5 0 1 0 14.5 2Zm2 5.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Z"
+            fill="currentColor"
+          />
+        </svg>
+        {count > 0 ? <span className="dse-count">{count}</span> : null}
+      </button>
+      {open ? (
+        <div className="dse-pop" role="dialog" aria-label={t('sessionSecrets')}>
+          <div className="dse-popHead">
+            <p className="dse-popTitle">{t('sessionSecrets')}</p>
+            <button
+              type="button"
+              className="dse-iconBtn"
+              title={t('refresh')}
+              aria-label={t('refresh')}
+              onClick={load}
+            >
+              ⟳
+            </button>
+            <button
+              type="button"
+              className="dse-iconBtn"
+              title={t('close')}
+              aria-label={t('close')}
+              onClick={() => setOpen(false)}
+            >
+              ✕
+            </button>
+          </div>
+          <p className="dse-popHint">{t('sessionHint')}</p>
+          <div className="dse-popList">
+            {items === null || items.length === 0 ? (
+              <p className="dse-empty">{t('sessionEmpty')}</p>
+            ) : (
+              items.map((entry) => (
+                <SessionRow
+                  key={entry.name}
+                  t={t}
+                  sessionId={sessionId}
+                  entry={entry}
+                  onDeleted={load}
+                  onError={(text) => setStatus(text === '' ? null : text)}
+                />
+              ))
+            )}
+          </div>
+          <div className="dse-popForm">
+            <div className="dse-field">
+              <div className="dse-head">
+                <label className="dse-label" htmlFor="dse-s-name">
+                  {t('addSession')}
+                </label>
+              </div>
+              <input
+                id="dse-s-name"
+                className="dse-input"
+                placeholder="API_TOKEN"
+                value={form.name}
+                onChange={(event) => setForm({ ...form, name: event.target.value })}
+              />
+              <input
+                className="dse-input"
+                type="password"
+                autoComplete="off"
+                placeholder={t('valueLabel')}
+                value={form.value}
+                onChange={(event) => setForm({ ...form, value: event.target.value })}
+              />
+              <input
+                className="dse-input"
+                placeholder={t('descLabel')}
+                value={form.description}
+                onChange={(event) => setForm({ ...form, description: event.target.value })}
+              />
+              <div className="dse-checkRow">
+                <input
+                  id="dse-s-once"
+                  type="checkbox"
+                  role="switch"
+                  aria-checked={form.once}
+                  checked={form.once}
+                  onChange={(event) => setForm({ ...form, once: event.target.checked })}
+                />
+                <label htmlFor="dse-s-once">{t('onceLabel')}</label>
+              </div>
+            </div>
+            <div className="dse-foot">
+              {status !== null ? <p className="dse-status dse-statusError">{status}</p> : null}
+              <button
+                type="button"
+                className="dse-btn dse-btnPrimary"
+                disabled={!canSave}
+                onClick={onSave}
+              >
+                {saving ? t('saving') : t('save')}
+              </button>
+            </div>
+          </div>
+        </div>
+      ) : null}
+    </span>
+  )
+}