From 249795c70b4a35e7e570621154149c5fe9cd8118 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Wed, 11 Sep 2024 21:53:41 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=F0=9F=92=84=20style:=20Optimize=20model=20?= =?UTF-8?q?token=20display=20method=20(#3697)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Update index.tsx * Update index.tsx * Update index.tsx * Update index.tsx * Update index.tsx * Update format.ts * Update format.test.ts * Update format.test.ts * Update format.ts * Update format.test.ts * Update format.test.ts --- src/components/ModelSelect/index.tsx | 10 +------ src/utils/format.test.ts | 43 +++++++++++++++++++++++++++- src/utils/format.ts | 11 +++++++ 3 files changed, 54 insertions(+), 10 deletions(-) diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index 12b61d5ee1a8..c963e3df5660 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next'; import { Center, Flexbox } from 'react-layout-kit'; import { ChatModelCard } from '@/types/llm'; +import { formatTokenNumber } from '@/utils/format'; const useStyles = createStyles(({ css, token }) => ({ custom: css` @@ -55,15 +56,6 @@ const useStyles = createStyles(({ css, token }) => ({ border-radius: 4px; `, })); -const formatTokenNumber = (num: number): string => { - if (num > 0 && num < 1024) return '1K'; - - let kiloToken = Math.floor(num / 1024); - if (num >= 128_000 && num < 1_024_000) { - kiloToken = Math.floor(num / 1000); - } - return kiloToken < 1000 ? `${kiloToken}K` : `${Math.floor(kiloToken / 1000)}M`; -}; interface ModelInfoTagsProps extends ChatModelCard { directionReverse?: boolean; diff --git a/src/utils/format.test.ts b/src/utils/format.test.ts index 58c1daa9c808..d70a9a296c61 100644 --- a/src/utils/format.test.ts +++ b/src/utils/format.test.ts @@ -1,6 +1,6 @@ import { describe, expect, it } from 'vitest'; -import { formatSize, formatSpeed, formatTime } from './format'; +import { formatSize, formatSpeed, formatTime, formatTokenNumber } from './format'; describe('formatSize', () => { it('should format bytes to KB correctly', () => { @@ -73,3 +73,44 @@ describe('formatTime', () => { expect(formatTime(3599.99)).toBe('60.0 min'); }); }); + +describe('formatTokenNumber', () => { + it('should return "1K" for numbers between 1 and 1023', () => { + expect(formatTokenNumber(500)).toBe('1K'); + expect(formatTokenNumber(1000)).toBe('1K'); + }); + + it('should format numbers between 1024 and 41,983 correctly', () => { + expect(formatTokenNumber(1024)).toBe('1K'); + expect(formatTokenNumber(2000)).toBe('2K'); + expect(formatTokenNumber(2048)).toBe('2K'); + expect(formatTokenNumber(4000)).toBe('4K'); + expect(formatTokenNumber(4096)).toBe('4K'); + expect(formatTokenNumber(32000)).toBe('32K'); + expect(formatTokenNumber(65536)).toBe('64K'); + }); + + it('should format numbers between 41,984 and 127,999 correctly', () => { + expect(formatTokenNumber(41984)).toBe('41K'); + expect(formatTokenNumber(100000)).toBe('97K'); + expect(formatTokenNumber(127999)).toBe('124K'); + }); + + it('should return "128K" for 131,072', () => { + expect(formatTokenNumber(131072)).toBe('128K'); // Qwen + }); + + it('should format numbers between 128,000 and 999,999 correctly', () => { + expect(formatTokenNumber(128000)).toBe('128K'); + expect(formatTokenNumber(200000)).toBe('200K'); // Claude + expect(formatTokenNumber(999999)).toBe('999K'); + }); + + it('should format numbers 1,000,000 and above correctly', () => { + expect(formatTokenNumber(1000000)).toBe('1M'); + expect(formatTokenNumber(1024000)).toBe('1M'); + expect(formatTokenNumber(1048576)).toBe('1M'); // Gemini Flash + expect(formatTokenNumber(2000000)).toBe('2M'); + expect(formatTokenNumber(2097152)).toBe('2M'); // Gemini Pro + }); +}); diff --git a/src/utils/format.ts b/src/utils/format.ts index 050919f25cc8..b3bd551dc0a9 100644 --- a/src/utils/format.ts +++ b/src/utils/format.ts @@ -54,3 +54,14 @@ export const formatTime = (timeInSeconds: number): string => { export const formatNumber = (num: any) => { return new Intl.NumberFormat('en-US').format(num); }; + +export const formatTokenNumber = (num: number): string => { + if (num > 0 && num < 1024) return '1K'; + + let kiloToken = Math.floor(num / 1024); + if (num >= 1024 && num < 1024 * 41 || num >= 128_000) { + kiloToken = Math.floor(num / 1000); + } + if (num === 131_072) return '128K'; + return kiloToken < 1000 ? `${kiloToken}K` : `${Math.floor(kiloToken / 1000)}M`; +}; From f542b5f49db4ddda608050652f15b4a56e5552c0 Mon Sep 17 00:00:00 2001 From: semantic-release-bot Date: Wed, 11 Sep 2024 14:00:32 +0000 Subject: [PATCH 2/3] :bookmark: chore(release): v1.16.7 [skip ci] MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ### [Version 1.16.7](https://github.com/lobehub/lobe-chat/compare/v1.16.6...v1.16.7) Released on **2024-09-11** #### 💄 Styles - **misc**: Optimize model token display method.
Improvements and Fixes #### Styles * **misc**: Optimize model token display method, closes [#3697](https://github.com/lobehub/lobe-chat/issues/3697) ([249795c](https://github.com/lobehub/lobe-chat/commit/249795c))
[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
--- CHANGELOG.md | 25 +++++++++++++++++++++++++ package.json | 2 +- 2 files changed, 26 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0e2cf6129986..cf4d6d1c8427 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,31 @@ # Changelog +### [Version 1.16.7](https://github.com/lobehub/lobe-chat/compare/v1.16.6...v1.16.7) + +Released on **2024-09-11** + +#### 💄 Styles + +- **misc**: Optimize model token display method. + +
+ +
+Improvements and Fixes + +#### Styles + +- **misc**: Optimize model token display method, closes [#3697](https://github.com/lobehub/lobe-chat/issues/3697) ([249795c](https://github.com/lobehub/lobe-chat/commit/249795c)) + +
+ +
+ +[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top) + +
+ ### [Version 1.16.6](https://github.com/lobehub/lobe-chat/compare/v1.16.5...v1.16.6) Released on **2024-09-11** diff --git a/package.json b/package.json index 68fe0c8f66d0..a488db36dcf0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@lobehub/chat", - "version": "1.16.6", + "version": "1.16.7", "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.", "keywords": [ "framework", From 38f6c345d9eb1eb43204535aa44e674843021d21 Mon Sep 17 00:00:00 2001 From: lobehubbot Date: Wed, 11 Sep 2024 14:01:24 +0000 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=93=9D=20docs(bot):=20Auto=20sync=20a?= =?UTF-8?q?gents=20&=20plugin=20to=20readme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 16 ++++++++-------- README.zh-CN.md | 16 ++++++++-------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index 11fe035756f4..014fb38ac964 100644 --- a/README.md +++ b/README.md @@ -285,14 +285,14 @@ Our marketplace is not just a showcase platform but also a collaborative space. -| Recent Submits | Description | -| ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| [AI Agent Generator](https://chat-preview.lobehub.com/market?agent=ai-agent-generator)
By **[xyftw](https://github.com/xyftw)** on **2024-09-10** | Skilled at creating AI Agent character descriptions that meet the needs.
`ai-agent` `character-creation` | -| [Desolate Friend](https://chat-preview.lobehub.com/market?agent=meu)
By **[adminewacc](https://github.com/adminewacc)** on **2024-09-10** | Skilled at comforting and supporting friends
`friendship` `sadness` `support` | -| [NetMaster](https://chat-preview.lobehub.com/market?agent=net-master)
By **[erhuoyan](https://github.com/erhuoyan)** on **2024-09-10** | Network Engineer: Professional network topology construction and management
`network-engineer` `network-configuration` `network-management` `network-topology` `network-security` | -| [HTML to React](https://chat-preview.lobehub.com/market?agent=web-react)
By **[xingwang02](https://github.com/xingwang02)** on **2024-09-10** | Input HTML snippets and convert them into React components
`react` `html` | - -> 📊 Total agents: [**327** ](https://github.com/lobehub/lobe-chat-agents) +| Recent Submits | Description | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Resume Analysis Expert](https://chat-preview.lobehub.com/market?agent=resume-analyzer)
By **[Pandurangmopgar](https://github.com/Pandurangmopgar)** on **2024-09-11** | Expert AI assistant for comprehensive resume analysis and job-specific optimization. Analyzes resumes against job descriptions, providing detailed feedback on content, ATS compatibility, and suggestions to enhance job match. Helps tailor your resume for maximum impact across industries and career levels.
`resume` `career` `job-search` `ats` `cv` `analysis` `optimization` `professional-development` `interview-prep` | +| [AI Agent Generator](https://chat-preview.lobehub.com/market?agent=ai-agent-generator)
By **[xyftw](https://github.com/xyftw)** on **2024-09-10** | Skilled at creating AI Agent character descriptions that meet the needs.
`ai-agent` `character-creation` | +| [Desolate Friend](https://chat-preview.lobehub.com/market?agent=meu)
By **[adminewacc](https://github.com/adminewacc)** on **2024-09-10** | Skilled at comforting and supporting friends
`friendship` `sadness` `support` | +| [NetMaster](https://chat-preview.lobehub.com/market?agent=net-master)
By **[erhuoyan](https://github.com/erhuoyan)** on **2024-09-10** | Network Engineer: Professional network topology construction and management
`network-engineer` `network-configuration` `network-management` `network-topology` `network-security` | + +> 📊 Total agents: [**328** ](https://github.com/lobehub/lobe-chat-agents) diff --git a/README.zh-CN.md b/README.zh-CN.md index f9dd646aed02..eb8f5873c623 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -273,14 +273,14 @@ LobeChat 的插件生态系统是其核心功能的重要扩展，它极大地 -| 最近新增 | 助手说明 | -| ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------- | -| [AI 代理生成器](https://chat-preview.lobehub.com/market?agent=ai-agent-generator)
By **[xyftw](https://github.com/xyftw)** on **2024-09-10** | 擅长创建满足需求的 AI 代理角色描述。
`ai-agent` `角色创建` | -| [孤独的朋友](https://chat-preview.lobehub.com/market?agent=meu)
By **[adminewacc](https://github.com/adminewacc)** on **2024-09-10** | 擅长安慰和支持朋友
`友谊` `悲伤` `支持` | -| [NetMaster](https://chat-preview.lobehub.com/market?agent=net-master)
By **[erhuoyan](https://github.com/erhuoyan)** on **2024-09-10** | 网络工程师：专业网络拓扑搭建与管理
`网络工程师` `网络配置` `网络管理` `网络拓扑` `网络安全` | -| [HTML to React](https://chat-preview.lobehub.com/market?agent=web-react)
By **[xingwang02](https://github.com/xingwang02)** on **2024-09-10** | 输入 HTML 片段，转化为 React 组件
`react、-html` | - -> 📊 Total agents: [**327** ](https://github.com/lobehub/lobe-chat-agents) +| 最近新增 | 助手说明 | +| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [简历分析专家](https://chat-preview.lobehub.com/market?agent=resume-analyzer)
By **[Pandurangmopgar](https://github.com/Pandurangmopgar)** on **2024-09-11** | 专家级 AI 助手，提供全面的简历分析和职位特定优化。根据职位描述分析简历，提供关于内容、ATS 兼容性和增强职位匹配的详细反馈。帮助您量身定制简历，以在各行业和职业层次上产生最大影响。
`简历` `职业` `求职` `ats` `cv` `分析` `优化` `职业发展` `面试准备` | +| [AI 代理生成器](https://chat-preview.lobehub.com/market?agent=ai-agent-generator)
By **[xyftw](https://github.com/xyftw)** on **2024-09-10** | 擅长创建满足需求的 AI 代理角色描述。
`ai-agent` `角色创建` | +| [孤独的朋友](https://chat-preview.lobehub.com/market?agent=meu)
By **[adminewacc](https://github.com/adminewacc)** on **2024-09-10** | 擅长安慰和支持朋友
`友谊` `悲伤` `支持` | +| [NetMaster](https://chat-preview.lobehub.com/market?agent=net-master)
By **[erhuoyan](https://github.com/erhuoyan)** on **2024-09-10** | 网络工程师：专业网络拓扑搭建与管理
`网络工程师` `网络配置` `网络管理` `网络拓扑` `网络安全` | + +> 📊 Total agents: [**328** ](https://github.com/lobehub/lobe-chat-agents)