Add Hermes Agent package fallback and xAI OAuth (#808)

packages/client/src/api/hermes/xai-auth.ts

@@ -0,0 +1,29 @@
+import { request } from '../client'
+
+export interface XaiStartResult {
+  session_id: string
+  authorization_url: string
+  expires_in: number
+}
+
+export interface XaiPollResult {
+  status: 'pending' | 'approved' | 'expired' | 'error'
+  error: string | null
+}
+
+export interface XaiStatusResult {
+  authenticated: boolean
+  last_refresh?: string
+}
+
+export async function startXaiLogin(): Promise<XaiStartResult> {
+  return request<XaiStartResult>('/api/hermes/auth/xai/start', { method: 'POST' })
+}
+
+export async function pollXaiLogin(sessionId: string): Promise<XaiPollResult> {
+  return request<XaiPollResult>(`/api/hermes/auth/xai/poll/${sessionId}`)
+}
+
+export async function getXaiAuthStatus(): Promise<XaiStatusResult> {
+  return request<XaiStatusResult>('/api/hermes/auth/xai/status')
+}

packages/client/src/components/hermes/models/ProviderFormModal.vue

@@ -6,6 +6,7 @@ import { useI18n } from 'vue-i18n'
 import CodexLoginModal from './CodexLoginModal.vue'
 import NousLoginModal from './NousLoginModal.vue'
 import CopilotLoginModal from './CopilotLoginModal.vue'
+import XaiOAuthLoginModal from './XaiOAuthLoginModal.vue'
 import { checkCopilotToken, enableCopilot, type CopilotTokenSource } from '@/api/hermes/copilot-auth'
 import { fetchProviderModels } from '@/api/hermes/system'
 
@@ -26,6 +27,7 @@ const fetchingModels = ref(false)
 const showCodexLogin = ref(false)
 const showNousLogin = ref(false)
 const showCopilotLogin = ref(false)
+const showXaiLogin = ref(false)
 const copilotChecking = ref(false)
 
 const providerType = ref<'preset' | 'custom'>('preset')
@@ -44,6 +46,7 @@ const CODEX_KEY = 'openai-codex'
 const NOUS_KEY = 'nous'
 const COPILOT_KEY = 'copilot'
 const CLIPROXYAPI_KEY = 'cliproxyapi'
+const XAI_OAUTH_KEY = 'xai-oauth'
 const ALIBABA_CODING_KEY = 'alibaba-coding-plan'
 const ALIBABA_CODING_REGIONS = {
   intl: 'https://coding-intl.dashscope.aliyuncs.com/v1',
@@ -54,6 +57,7 @@ const isCodex = computed(() => selectedPreset.value === CODEX_KEY)
 const isNous = computed(() => selectedPreset.value === NOUS_KEY)
 const isCopilot = computed(() => selectedPreset.value === COPILOT_KEY)
 const isCliproxyApi = computed(() => selectedPreset.value === CLIPROXYAPI_KEY)
+const isXaiOAuth = computed(() => selectedPreset.value === XAI_OAUTH_KEY)
 const isAlibabaCoding = computed(() => selectedPreset.value === ALIBABA_CODING_KEY)
 const alibabaCodingRegion = ref<'intl' | 'cn'>('intl')
 
@@ -93,6 +97,8 @@ watch(selectedPreset, (val) => {
     if (val === COPILOT_KEY) {
       // 判断是否已能解析到 token：有 → 弹简单确认；无 → 走 in-app device flow
       void triggerCopilotAdd()
+    } else if (val === XAI_OAUTH_KEY) {
+      showXaiLogin.value = true
     }
   }
 })
@@ -170,11 +176,16 @@ async function handleSave() {
     return
   }
 
+  if (isXaiOAuth.value) {
+    showXaiLogin.value = true
+    return
+  }
+
   if (!formData.value.base_url.trim()) {
     message.warning(t('models.baseUrlRequired'))
     return
   }
-  if (!formData.value.api_key.trim() && !isCliproxyApi.value) {
+  if (!formData.value.api_key.trim() && !isCliproxyApi.value && !isXaiOAuth.value) {
     message.warning(t('models.apiKeyRequired'))
     return
   }
@@ -225,6 +236,12 @@ async function handleCopilotSuccess() {
   emit('saved')
 }
 
+async function handleXaiSuccess() {
+  showXaiLogin.value = false
+  message.success(t('models.providerAdded'))
+  emit('saved')
+}
+
 function copilotSourceLabel(source: CopilotTokenSource): string {
   if (source === 'env') return t('models.copilotAddSourceEnv')
   if (source === 'gh-cli') return t('models.copilotAddSourceGhCli')
@@ -281,6 +298,11 @@ function handleCopilotClose() {
   selectedPreset.value = null
 }
 
+function handleXaiClose() {
+  showXaiLogin.value = false
+  selectedPreset.value = null
+}
+
 function handleClose() {
   showModal.value = false
   setTimeout(() => emit('close'), 200)
@@ -293,7 +315,7 @@ function handleClose() {
     preset="card"
     :title="t('models.addProvider')"
     :style="{ width: 'min(520px, calc(100vw - 32px))' }"
-    :mask-closable="!loading && !showCodexLogin && !showNousLogin && !showCopilotLogin"
+    :mask-closable="!loading && !showCodexLogin && !showNousLogin && !showCopilotLogin && !showXaiLogin"
     @after-leave="emit('close')"
   >
     <NForm label-placement="top">
@@ -353,7 +375,7 @@ function handleClose() {
         />
       </NFormItem>
 
-      <NFormItem v-if="!isCodex && !isNous" :label="t('models.apiKey')" :required="!isCliproxyApi">
+      <NFormItem v-if="!isCodex && !isNous" :label="t('models.apiKey')" :required="!isCliproxyApi && !isXaiOAuth">
         <NInput
           v-model:value="formData.api_key"
           type="password"
@@ -420,6 +442,12 @@ function handleClose() {
       @close="handleCopilotClose"
       @success="handleCopilotSuccess"
     />
+
+    <XaiOAuthLoginModal
+      v-if="showXaiLogin"
+      @close="handleXaiClose"
+      @success="handleXaiSuccess"
+    />
   </NModal>
 </template>
 

packages/client/src/components/hermes/models/XaiOAuthLoginModal.vue

@@ -0,0 +1,176 @@
+<script setup lang="ts">
+import { ref, onUnmounted } from 'vue'
+import { NModal, NButton, NSpin, useMessage } from 'naive-ui'
+import { useI18n } from 'vue-i18n'
+import { startXaiLogin, pollXaiLogin } from '@/api/hermes/xai-auth'
+
+const { t } = useI18n()
+const emit = defineEmits<{ close: []; success: [] }>()
+const message = useMessage()
+
+const showModal = ref(true)
+const status = ref<'idle' | 'loading' | 'waiting' | 'approved' | 'expired' | 'error'>('idle')
+const authorizationUrl = ref('')
+const sessionId = ref('')
+const errorMessage = ref('')
+let pollTimer: ReturnType<typeof setTimeout> | null = null
+
+async function startLogin() {
+  status.value = 'loading'
+  errorMessage.value = ''
+  try {
+    const data = await startXaiLogin()
+    authorizationUrl.value = data.authorization_url
+    sessionId.value = data.session_id
+    status.value = 'waiting'
+    window.open(authorizationUrl.value, '_blank')
+    startPolling()
+  } catch (err: any) {
+    status.value = 'error'
+    errorMessage.value = err?.message || String(err)
+    message.error(errorMessage.value)
+  }
+}
+
+function startPolling() {
+  stopPolling()
+  pollTimer = setTimeout(async () => {
+    try {
+      const result = await pollXaiLogin(sessionId.value)
+      if (result.status === 'pending') {
+        startPolling()
+      } else if (result.status === 'approved') {
+        status.value = 'approved'
+        message.success(t('models.xaiApproved'))
+        setTimeout(() => {
+          showModal.value = false
+          setTimeout(() => emit('success'), 200)
+        }, 1000)
+      } else if (result.status === 'expired') {
+        status.value = 'expired'
+      } else if (result.status === 'error') {
+        status.value = 'error'
+        errorMessage.value = result.error || 'Unknown error'
+      }
+    } catch {
+      startPolling()
+    }
+  }, 2000)
+}
+
+function stopPolling() {
+  if (pollTimer) clearTimeout(pollTimer)
+  pollTimer = null
+}
+
+function handleClose() {
+  stopPolling()
+  showModal.value = false
+  setTimeout(() => emit('close'), 200)
+}
+
+function openLink() {
+  window.open(authorizationUrl.value, '_blank')
+}
+
+function retry() {
+  status.value = 'idle'
+  authorizationUrl.value = ''
+  sessionId.value = ''
+  errorMessage.value = ''
+  startLogin()
+}
+
+onUnmounted(stopPolling)
+startLogin()
+</script>
+
+<template>
+  <NModal
+    v-model:show="showModal"
+    preset="card"
+    :title="t('models.xaiLoginTitle')"
+    :style="{ width: 'min(440px, calc(100vw - 32px))' }"
+    :mask-closable="status !== 'waiting'"
+    @after-leave="emit('close')"
+  >
+    <div class="xai-login">
+      <div v-if="status === 'idle' || status === 'loading'" class="xai-login__state">
+        <NSpin size="small" />
+      </div>
+
+      <div v-else-if="status === 'waiting'" class="xai-login__state">
+        <p class="xai-login__hint">{{ t('models.xaiWaiting') }}</p>
+        <NButton type="primary" block @click="openLink">
+          {{ t('models.xaiOpenLink') }}
+        </NButton>
+      </div>
+
+      <div v-else-if="status === 'approved'" class="xai-login__state xai-login__state--success">
+        <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
+        <p>{{ t('models.xaiApproved') }}</p>
+      </div>
+
+      <div v-else-if="status === 'expired'" class="xai-login__state">
+        <p class="xai-login__error">{{ t('models.xaiExpired') }}</p>
+        <NButton size="small" @click="retry">{{ t('common.retry') }}</NButton>
+      </div>
+
+      <div v-else-if="status === 'error'" class="xai-login__state">
+        <p class="xai-login__error">{{ errorMessage }}</p>
+        <NButton size="small" @click="retry">{{ t('common.retry') }}</NButton>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="modal-footer">
+        <NButton :disabled="status === 'waiting'" @click="handleClose">{{ t('common.cancel') }}</NButton>
+      </div>
+    </template>
+  </NModal>
+</template>
+
+<style scoped lang="scss">
+.xai-login {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 8px 0;
+}
+
+.xai-login__state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  min-height: 120px;
+  justify-content: center;
+  width: 100%;
+}
+
+.xai-login__hint {
+  font-size: 14px;
+  color: var(--n-text-color, inherit);
+  text-align: center;
+  line-height: 1.6;
+}
+
+.xai-login__state--success {
+  color: #18a058;
+
+  svg {
+    stroke: #18a058;
+  }
+}
+
+.xai-login__error {
+  color: #d03050;
+  text-align: center;
+  word-break: break-word;
+}
+
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>

packages/client/src/i18n/locales/en.ts

@@ -573,6 +573,11 @@ export default {
     copilotDeleteHintEnv: 'This will clear COPILOT_GITHUB_TOKEN in ~/.hermes/.env. Other tools are not affected.',
     copilotDeleteHintGhCli: 'Copilot will be hidden from Hermes. Your gh CLI login is not affected — `gh auth status` will still show you signed in.',
     copilotDeleteHintAppsJson: 'Copilot will be hidden from Hermes. Your VS Code Copilot extension login is not affected.',
+    xaiLoginTitle: 'xAI Grok OAuth Login',
+    xaiWaiting: 'Complete authorization in the opened xAI page. This window will close automatically once approved.',
+    xaiOpenLink: 'Open xAI authorization page',
+    xaiApproved: 'Sign-in succeeded!',
+    xaiExpired: 'The authorization link has expired. Please retry.',
     customBadge: 'CUSTOM',
     previewBadge: 'PREVIEW',
     disabledBadge: 'UNAVAILABLE',

packages/client/src/i18n/locales/zh.ts

@@ -573,6 +573,11 @@ export default {
     copilotDeleteHintEnv: '此操作会清除 ~/.hermes/.env 中的 COPILOT_GITHUB_TOKEN，不影响其他工具。',
     copilotDeleteHintGhCli: 'Copilot 将从 Hermes 列表移除。不会影响 gh CLI —— `gh auth status` 仍显示已登录。',
     copilotDeleteHintAppsJson: 'Copilot 将从 Hermes 列表移除。不会影响 VS Code Copilot 插件的登录。',
+    xaiLoginTitle: 'xAI Grok OAuth 登录',
+    xaiWaiting: '请在打开的 xAI 页面完成授权。授权完成后窗口会自动关闭。',
+    xaiOpenLink: '打开 xAI 授权页',
+    xaiApproved: '登录成功！',
+    xaiExpired: '授权链接已过期，请重试。',
     customBadge: '自定义',
     previewBadge: '预览',
     disabledBadge: '不可用',