feat(ui): better infinite context (#8021)

* feat(上下文): 添加最大上下文数量限制及显示组件

- 在常量配置中添加 MAX_CONTEXT_COUNT
- 创建 MaxContextCount 组件用于显示无限上下文标识
- 在相关组件中替换硬编码的上下文最大值
- 优化 TokenCount 组件的上下文计数显示样式

* refactor(常量): 添加UNLIMITED_CONTEXT_COUNT常量并替换硬编码值

使用UNLIMITED_CONTEXT_COUNT常量替代多处硬编码的100000值，提高代码可维护性

* refactor(Inputbar): 使用 SlashSeparatorSpan 组件替换内联样式

将 TokenCount.tsx 中的斜杠分隔符内联样式替换为 SlashSeparatorSpan 组件，提高代码可维护性

* fix: 为 InfinityIcon 添加 aria-label 并统一样式

src/renderer/src/components/MaxContextCount.tsx

@@ -0,0 +1,17 @@
+import { MAX_CONTEXT_COUNT } from '@renderer/config/constant'
+import { Infinity as InfinityIcon } from 'lucide-react'
+import { CSSProperties } from 'react'
+
+type Props = {
+  maxContext: number
+  style?: CSSProperties
+  size?: number
+}
+
+export default function MaxContextCount({ maxContext, style, size = 14 }: Props) {
+  return maxContext === MAX_CONTEXT_COUNT ? (
+    <InfinityIcon size={size} style={style} aria-label="infinity" />
+  ) : (
+    <span style={style}>{maxContext.toString()}</span>
+  )
+}

src/renderer/src/config/constant.ts

@@ -33,3 +33,6 @@ export const THEME_COLOR_PRESETS = [
   '#0EA5E9', // Sky Blue
   '#0284C7' // Light Blue
 ]
+
+export const MAX_CONTEXT_COUNT = 100
+export const UNLIMITED_CONTEXT_COUNT = 100000

src/renderer/src/pages/home/Inputbar/TokenCount.tsx

@@ -1,5 +1,6 @@
 import { ArrowUpOutlined, MenuOutlined } from '@ant-design/icons'
 import { HStack, VStack } from '@renderer/components/Layout'
+import MaxContextCount from '@renderer/components/MaxContextCount'
 import { useSettings } from '@renderer/hooks/useSettings'
 import { Divider, Popover } from 'antd'
 import { FC } from 'react'
@@ -21,17 +22,17 @@ const TokenCount: FC<Props> = ({ estimateTokenCount, inputTokenCount, contextCou
     return null
   }
 
-  const formatMaxCount = (max: number) => {
-    return max.toString()
-  }
-
   const PopoverContent = () => {
     return (
       <VStack w="185px" background="100%">
         <HStack justifyContent="space-between" w="100%">
           <Text>{t('chat.input.context_count.tip')}</Text>
           <Text>
-            {contextCount.current} / {contextCount.max}
+            <HStack style={{ alignItems: 'center' }}>
+              {contextCount.current}
+              <SlashSeparatorSpan>/</SlashSeparatorSpan>
+              <MaxContextCount maxContext={contextCount.max} />
+            </HStack>
           </Text>
         </HStack>
         <Divider style={{ margin: '5px 0' }} />
@@ -46,10 +47,20 @@ const TokenCount: FC<Props> = ({ estimateTokenCount, inputTokenCount, contextCou
   return (
     <Container>
       <Popover content={PopoverContent} arrow={false}>
-        <MenuOutlined /> {contextCount.current} / {formatMaxCount(contextCount.max)}
-        <Divider type="vertical" style={{ marginTop: 0, marginLeft: 5, marginRight: 5 }} />
-        <ArrowUpOutlined />
-        {inputTokenCount} / {estimateTokenCount}
+        <HStack>
+          <HStack style={{ alignItems: 'center' }}>
+            <MenuOutlined /> {contextCount.current}
+            <SlashSeparatorSpan>/</SlashSeparatorSpan>
+            <MaxContextCount maxContext={contextCount.max} />
+          </HStack>
+          <Divider type="vertical" style={{ marginTop: 0, marginLeft: 5, marginRight: 5 }} />
+          <HStack style={{ alignItems: 'center' }}>
+            <ArrowUpOutlined />
+            {inputTokenCount}
+            <SlashSeparatorSpan>/</SlashSeparatorSpan>
+            {estimateTokenCount}
+          </HStack>
+        </HStack>
       </Popover>
     </Container>
   )
@@ -80,4 +91,9 @@ const Text = styled.div`
   color: var(--color-text-1);
 `
 
+const SlashSeparatorSpan = styled.span`
+  margin-left: 2px;
+  margin-right: 2px;
+`
+
 export default TokenCount

src/renderer/src/pages/settings/AssistantSettings/AssistantModelSettings.tsx

@@ -4,7 +4,7 @@ import EditableNumber from '@renderer/components/EditableNumber'
 import { HStack } from '@renderer/components/Layout'
 import SelectModelPopup from '@renderer/components/Popups/SelectModelPopup'
 import Selector from '@renderer/components/Selector'
-import { DEFAULT_CONTEXTCOUNT, DEFAULT_TEMPERATURE } from '@renderer/config/constant'
+import { DEFAULT_CONTEXTCOUNT, DEFAULT_TEMPERATURE, MAX_CONTEXT_COUNT } from '@renderer/config/constant'
 import { SettingRow } from '@renderer/pages/settings'
 import { Assistant, AssistantSettingCustomParameters, AssistantSettings } from '@renderer/types'
 import { modalConfirm } from '@renderer/utils'
@@ -312,7 +312,7 @@ const AssistantModelSettings: FC<Props> = ({ assistant, updateAssistant, updateA
         <Col span={4}>
           <EditableNumber
             min={0}
-            max={20}
+            max={MAX_CONTEXT_COUNT}
             step={1}
             value={contextCount}
             changeOnBlur
@@ -330,7 +330,7 @@ const AssistantModelSettings: FC<Props> = ({ assistant, updateAssistant, updateA
         <Col span={24}>
           <Slider
             min={0}
-            max={100}
+            max={MAX_CONTEXT_COUNT}
             onChange={setContextCount}
             onChangeComplete={onContextCountChange}
             value={typeof contextCount === 'number' ? contextCount : 0}

src/renderer/src/services/AssistantService.ts

@@ -1,4 +1,10 @@
-import { DEFAULT_CONTEXTCOUNT, DEFAULT_MAX_TOKENS, DEFAULT_TEMPERATURE } from '@renderer/config/constant'
+import {
+  DEFAULT_CONTEXTCOUNT,
+  DEFAULT_MAX_TOKENS,
+  DEFAULT_TEMPERATURE,
+  MAX_CONTEXT_COUNT,
+  UNLIMITED_CONTEXT_COUNT
+} from '@renderer/config/constant'
 import i18n from '@renderer/i18n'
 import store from '@renderer/store'
 import { addAssistant } from '@renderer/store/assistants'
@@ -108,7 +114,7 @@ export const getAssistantSettings = (assistant: Assistant): AssistantSettings =>
   }
 
   return {
-    contextCount: contextCount === 100 ? 100000 : contextCount,
+    contextCount: contextCount === MAX_CONTEXT_COUNT ? UNLIMITED_CONTEXT_COUNT : contextCount,
     temperature: assistant?.settings?.temperature ?? DEFAULT_TEMPERATURE,
     topP: assistant?.settings?.topP ?? 1,
     enableMaxTokens: assistant?.settings?.enableMaxTokens ?? false,

src/renderer/src/services/MessagesService.ts

@@ -1,5 +1,5 @@
 import SearchPopup from '@renderer/components/Popups/SearchPopup'
-import { DEFAULT_CONTEXTCOUNT } from '@renderer/config/constant'
+import { DEFAULT_CONTEXTCOUNT, MAX_CONTEXT_COUNT, UNLIMITED_CONTEXT_COUNT } from '@renderer/config/constant'
 import { getTopicById } from '@renderer/hooks/useTopic'
 import i18n from '@renderer/i18n'
 import { fetchMessagesSummary } from '@renderer/services/ApiService'
@@ -41,7 +41,7 @@ export {
 
 export function getContextCount(assistant: Assistant, messages: Message[]) {
   const rawContextCount = assistant?.settings?.contextCount ?? DEFAULT_CONTEXTCOUNT
-  const maxContextCount = rawContextCount === 100 ? 100000 : rawContextCount
+  const maxContextCount = rawContextCount === MAX_CONTEXT_COUNT ? UNLIMITED_CONTEXT_COUNT : rawContextCount
 
   const _messages = takeRight(messages, maxContextCount)