Merge pull request #1823 from QwenLM/mingholy/fix/text-color

Fix auth UI to use semantic theme colors and correct selection sync
This commit is contained in:
Mingholy 2026-02-13 21:39:54 +08:00 committed by GitHub
commit e8259092c6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 16 additions and 15 deletions

View file

@ -10,7 +10,6 @@ import { AuthType } from '@qwen-code/qwen-code-core';
import { Box, Text } from 'ink';
import Link from 'ink-link';
import { theme } from '../semantic-colors.js';
import { Colors } from '../colors.js';
import { useKeypress } from '../hooks/useKeypress.js';
import { RadioButtonSelect } from '../components/shared/RadioButtonSelect.js';
import { ApiKeyInput } from '../components/ApiKeyInput.js';
@ -160,6 +159,8 @@ export function AuthDialog(): React.JSX.Element {
if (viewLevel === 'api-key-sub') {
setViewLevel('main');
// Reset selectedIndex to ensure UI syncs with initialAuthIndex
setSelectedIndex(null);
} else if (viewLevel === 'api-key-input' || viewLevel === 'custom-info') {
setViewLevel('api-key-sub');
}
@ -215,7 +216,7 @@ export function AuthDialog(): React.JSX.Element {
/>
</Box>
<Box marginTop={1} paddingLeft={2}>
<Text color={Colors.Gray}>
<Text color={theme.text.secondary}>
{currentSelectedAuthType === AuthType.QWEN_OAUTH
? t('Login with QwenChat account to use daily free quota.')
: t('Use coding plan credentials or your own api-keys/providers.')}
@ -244,7 +245,7 @@ export function AuthDialog(): React.JSX.Element {
/>
</Box>
<Box marginTop={1} paddingLeft={2}>
<Text color={Colors.Gray}>
<Text color={theme.text.secondary}>
{apiKeySubItems[apiKeySubModeIndex]?.value === 'coding-plan'
? t("Paste your api key of Bailian Coding Plan and you're all set!")
: t(
@ -282,12 +283,12 @@ export function AuthDialog(): React.JSX.Element {
<Text>{t('Please configure your models in settings.json:')}</Text>
</Box>
<Box marginTop={1} paddingLeft={2}>
<Text color={Colors.AccentYellow}>
<Text color={theme.status.warning}>
1. {t('Set API key via environment variable (e.g., OPENAI_API_KEY)')}
</Text>
</Box>
<Box marginTop={0} paddingLeft={2}>
<Text color={Colors.AccentYellow}>
<Text color={theme.status.warning}>
2.{' '}
{t(
"Add model configuration to modelProviders['openai'] (or other auth types)",
@ -295,7 +296,7 @@ export function AuthDialog(): React.JSX.Element {
</Text>
</Box>
<Box marginTop={0} paddingLeft={2}>
<Text color={Colors.AccentYellow}>
<Text color={theme.status.warning}>
3.{' '}
{t(
'Each provider needs: id, envKey (required), plus optional baseUrl, generationConfig',
@ -303,7 +304,7 @@ export function AuthDialog(): React.JSX.Element {
</Text>
</Box>
<Box marginTop={0} paddingLeft={2}>
<Text color={Colors.AccentYellow}>
<Text color={theme.status.warning}>
4.{' '}
{t(
'Use /model command to select your preferred model from the configured list',
@ -324,7 +325,7 @@ export function AuthDialog(): React.JSX.Element {
</Box>
<Box marginTop={0}>
<Link url={MODEL_PROVIDERS_DOCUMENTATION_URL} fallback={false}>
<Text color={Colors.AccentGreen} underline>
<Text color={theme.status.success} underline>
{MODEL_PROVIDERS_DOCUMENTATION_URL}
</Text>
</Link>
@ -369,14 +370,14 @@ export function AuthDialog(): React.JSX.Element {
{(authError || errorMessage) && (
<Box marginTop={1}>
<Text color={Colors.AccentRed}>{authError || errorMessage}</Text>
<Text color={theme.status.error}>{authError || errorMessage}</Text>
</Box>
)}
{viewLevel === 'main' && (
<>
<Box marginTop={1}>
<Text color={Colors.AccentPurple}>
<Text color={theme.text.accent}>
{t('(Use Enter to Set Auth)')}
</Text>
</Box>
@ -395,7 +396,7 @@ export function AuthDialog(): React.JSX.Element {
</Text>
</Box>
<Box marginTop={1}>
<Text color={Colors.AccentBlue}>
<Text color={theme.text.link}>
{
'https://qwenlm.github.io/qwen-code-docs/en/users/support/tos-privacy/'
}

View file

@ -8,7 +8,7 @@ import type React from 'react';
import { useState } from 'react';
import { Box, Text } from 'ink';
import { TextInput } from './shared/TextInput.js';
import { Colors } from '../colors.js';
import { theme } from '../semantic-colors.js';
import { useKeypress } from '../hooks/useKeypress.js';
import { t } from '../../i18n/index.js';
import Link from 'ink-link';
@ -52,7 +52,7 @@ export function ApiKeyInput({
<TextInput value={apiKey} onChange={setApiKey} placeholder="sk-sp-..." />
{error && (
<Box marginTop={1}>
<Text color={Colors.AccentRed}>{error}</Text>
<Text color={theme.status.error}>{error}</Text>
</Box>
)}
<Box marginTop={1}>
@ -60,13 +60,13 @@ export function ApiKeyInput({
</Box>
<Box marginTop={0}>
<Link url={CODING_PLAN_API_KEY_URL} fallback={false}>
<Text color={Colors.AccentGreen} underline>
<Text color={theme.status.success} underline>
{CODING_PLAN_API_KEY_URL}
</Text>
</Link>
</Box>
<Box marginTop={1}>
<Text color={Colors.Gray}>
<Text color={theme.text.secondary}>
{t('(Press Enter to submit, Escape to cancel)')}
</Text>
</Box>