From e3804ade3ccebab1bf7b7e04f03d089f5322daaa Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 07:16:18 +0000 Subject: [PATCH 01/14] Update MaxTokenSlider --- .../ProviderModelList/MaxTokenSlider.tsx | 26 +++++++++++-------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index 628ddbc66f88f..d844a10c7917f 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -7,7 +7,7 @@ const exponent = (num: number) => Math.log2(num); const getRealValue = (num: number) => Math.round(Math.pow(2, num)); const marks: SliderSingleProps['marks'] = { - [exponent(1)]: '1k', + [exponent(1)]: '0', [exponent(2)]: '2k', [exponent(4)]: '4k', [exponent(8)]: '8k', @@ -15,8 +15,8 @@ const marks: SliderSingleProps['marks'] = { [exponent(32)]: '32k', [exponent(64)]: '64k', [exponent(128)]: '128k', - [exponent(200)]: '200k', - [exponent(1000)]: '1M', + [exponent(256)]: '256k', + [exponent(1024)]: '1M', }; interface MaxTokenSliderProps { @@ -34,14 +34,15 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu const [powValue, setPowValue] = useMergeState(0, { defaultValue: exponent(typeof defaultValue === 'undefined' ? 0 : defaultValue / 1000), - value: exponent(typeof value === 'undefined' ? 0 : value / 1000), + value: exponent(typeof value === 'undefined' ? 0 : value / 1024), }); const updateWithPowValue = (value: number) => { setPowValue(value); - setTokens(getRealValue(value) * 1024); + setTokens(getRealValue(value) === 1 ? 0 : getRealValue(value) * 1024); }; + const updateWithRealValue = (value: number) => { setTokens(value); @@ -53,19 +54,21 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu { if (typeof x === 'undefined') return; + if (x === 0) return '无限制'; + const value = getRealValue(x); - if (value < 1000) return value.toFixed(0) + 'K'; + if (value < 1024) return value.toFixed(0) + 'K'; - return (value / 1000).toFixed(0) + 'M'; + return (value / 1024).toFixed(0) + 'M'; }, }} value={powValue} @@ -73,12 +76,13 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu
{ - if (!e) return; + if (!e && e !== 0) return; updateWithRealValue(e); }} - step={1024} + step={2048} value={token} />
From c5037db68ad290a2847e5771b36a9860537c046e Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 07:54:57 +0000 Subject: [PATCH 02/14] k -> K --- .../ProviderModelList/MaxTokenSlider.tsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index d844a10c7917f..56d1718f51624 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -8,14 +8,14 @@ const getRealValue = (num: number) => Math.round(Math.pow(2, num)); const marks: SliderSingleProps['marks'] = { [exponent(1)]: '0', - [exponent(2)]: '2k', - [exponent(4)]: '4k', - [exponent(8)]: '8k', - [exponent(16)]: '16k', - [exponent(32)]: '32k', - [exponent(64)]: '64k', - [exponent(128)]: '128k', - [exponent(256)]: '256k', + [exponent(2)]: '2K', + [exponent(4)]: '4K', + [exponent(8)]: '8K', + [exponent(16)]: '16K', + [exponent(32)]: '32K', + [exponent(64)]: '64K', + [exponent(128)]: '128K', + [exponent(256)]: '256K', [exponent(1024)]: '1M', }; From 3856c9f409efeedc6c41e536dea5a6c26776d619 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 08:42:55 +0000 Subject: [PATCH 03/14] i18n --- locales/ar/setting.json | 3 ++- locales/bg-BG/setting.json | 3 ++- locales/de-DE/setting.json | 3 ++- locales/en-US/setting.json | 3 ++- locales/es-ES/setting.json | 3 ++- locales/fr-FR/setting.json | 3 ++- locales/it-IT/setting.json | 3 ++- locales/ja-JP/setting.json | 3 ++- locales/ko-KR/setting.json | 3 ++- locales/nl-NL/setting.json | 23 ++++++++++--------- locales/pl-PL/setting.json | 3 ++- locales/pt-BR/setting.json | 3 ++- locales/ru-RU/setting.json | 3 ++- locales/tr-TR/setting.json | 3 ++- locales/vi-VN/setting.json | 3 ++- locales/zh-CN/setting.json | 3 ++- locales/zh-TW/setting.json | 3 ++- .../ProviderModelList/MaxTokenSlider.tsx | 5 +++- src/locales/default/setting.ts | 5 +++- 19 files changed, 52 insertions(+), 29 deletions(-) diff --git a/locales/ar/setting.json b/locales/ar/setting.json index b0c23d3618071..9393818617128 100644 --- a/locales/ar/setting.json +++ b/locales/ar/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "تكوين النموذج المخصص", "tokens": { - "title": "أقصى عدد من الرموز" + "title": "أقصى عدد من الرموز", + "unlimited": "غير محدود" }, "vision": { "extra": "سيتم تمكين قدرة تكوين تحميل الصور فقط في LobeChat من خلال هذا التكوين، مدى دعم التعرف على الصور يعتمد تمامًا على النموذج نفسه، يرجى اختبار قابلية التعرف على الصور لهذا النموذج بنفسك", diff --git a/locales/bg-BG/setting.json b/locales/bg-BG/setting.json index 57f0bb5a75406..f86d001e6588c 100644 --- a/locales/bg-BG/setting.json +++ b/locales/bg-BG/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Конфигурация на персонализиран модел", "tokens": { - "title": "Максимален брой токени" + "title": "Максимален брой токени", + "unlimited": "неограничен" }, "vision": { "extra": "Тази конфигурация ще активира само възможността за качване на изображения в LobeChat. Възможността за разпознаване на изображения зависи изцяло от самия модел. Моля, тествайте функционалността за разпознаване на изображения на модела.", diff --git a/locales/de-DE/setting.json b/locales/de-DE/setting.json index 3f39c2b1b58da..c834bc34860a1 100644 --- a/locales/de-DE/setting.json +++ b/locales/de-DE/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Benutzerdefinierte Modellkonfiguration", "tokens": { - "title": "Maximale Token-Anzahl" + "title": "Maximale Token-Anzahl", + "unlimited": "unbegrenzt" }, "vision": { "extra": "Diese Konfiguration aktiviert nur die Bild-Upload-Konfiguration in LobeChat. Die Unterstützung der Erkennung hängt vollständig von dem Modell selbst ab. Bitte testen Sie die Verfügbarkeit der visuellen Erkennungsfähigkeiten des Modells selbst.", diff --git a/locales/en-US/setting.json b/locales/en-US/setting.json index 61df17e94ad20..cbf221f138e3a 100644 --- a/locales/en-US/setting.json +++ b/locales/en-US/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Custom Model Configuration", "tokens": { - "title": "Maximum Token Count" + "title": "Maximum Token Count", + "unlimited": "unlimited" }, "vision": { "extra": "This configuration will only enable the image upload configuration in LobeChat. Whether recognition is supported depends entirely on the model itself. Please test the availability of visual recognition in this model on your own.", diff --git a/locales/es-ES/setting.json b/locales/es-ES/setting.json index 7ddcc53ad9a51..5a32c28d719af 100644 --- a/locales/es-ES/setting.json +++ b/locales/es-ES/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Configuración del modelo personalizado", "tokens": { - "title": "Número máximo de tokens" + "title": "Número máximo de tokens", + "unlimited": "ilimitado" }, "vision": { "extra": "Esta configuración solo habilitará la configuración de carga de imágenes en LobeChat. La capacidad de reconocimiento depende completamente del modelo en sí. Por favor, realiza pruebas para verificar la disponibilidad de esta capacidad en el modelo.", diff --git a/locales/fr-FR/setting.json b/locales/fr-FR/setting.json index fb6edb90a9432..11f50438021b4 100644 --- a/locales/fr-FR/setting.json +++ b/locales/fr-FR/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Configuration du modèle personnalisé", "tokens": { - "title": "Nombre maximal de jetons" + "title": "Nombre maximal de jetons", + "unlimited": "illimité" }, "vision": { "extra": "Cette configuration activera uniquement la configuration de téléchargement d'images dans LobeChat. La prise en charge de la reconnaissance dépend entièrement du modèle lui-même. Veuillez tester par vous-même la disponibilité de la capacité de reconnaissance visuelle de ce modèle.", diff --git a/locales/it-IT/setting.json b/locales/it-IT/setting.json index edd0397718cdc..19b5b46218f7a 100644 --- a/locales/it-IT/setting.json +++ b/locales/it-IT/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Configurazione del modello personalizzato", "tokens": { - "title": "Numero massimo di token" + "title": "Numero massimo di token", + "unlimited": "illimitato" }, "vision": { "extra": "Questa configurazione abiliterà solo la funzionalità di caricamento delle immagini in LobeChat. La reale capacità di riconoscimento dipende interamente dal modello stesso, si consiglia di testare autonomamente la disponibilità di questa funzionalità nel modello.", diff --git a/locales/ja-JP/setting.json b/locales/ja-JP/setting.json index b4334ccedb733..bca5897233bac 100644 --- a/locales/ja-JP/setting.json +++ b/locales/ja-JP/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "カスタムモデルの設定", "tokens": { - "title": "最大トークン数" + "title": "最大トークン数", + "unlimited": "無制限" }, "vision": { "extra": "この設定は LobeChat での画像アップロード構成のみを有効にします。認識のサポートは完全にモデル自体に依存するため、モデルの視覚認識機能の可用性を自己でテストしてください", diff --git a/locales/ko-KR/setting.json b/locales/ko-KR/setting.json index 911f7c70b97f8..bd8d0a6dd152e 100644 --- a/locales/ko-KR/setting.json +++ b/locales/ko-KR/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "사용자 정의 모델 구성", "tokens": { - "title": "최대 토큰 수" + "title": "최대 토큰 수", + "unlimited": "제한 없는" }, "vision": { "extra": "이 구성은 LobeChat에서 이미지 업로드 구성만 활성화하며, 인식 지원 여부는 모델 자체에 따라 달라집니다. 모델의 시각 인식 기능을 테스트해보세요", diff --git a/locales/nl-NL/setting.json b/locales/nl-NL/setting.json index 5ea90f3e8e4df..a551e10214856 100644 --- a/locales/nl-NL/setting.json +++ b/locales/nl-NL/setting.json @@ -54,30 +54,31 @@ }, "files": { "extra": "Currently, the file upload implementation in LobeChat is just a temporary solution and is for self-exploration only. Please wait for the full file upload capability in the future.", - "title": "Support File Upload" + "title": "Ondersteuning voor het uploaden van bestanden" }, "functionCall": { - "extra": "This configuration will only enable the function call capability in LobeChat. Whether function calls are supported depends entirely on the model itself. Please test the availability of function calls of this model on your own.", - "title": "Support Function Call" + "extra": "Deze configuratie schakelt alleen de functieaanroepmogelijkheid in LobeChat in. Of functieaanroepen worden ondersteund, hangt volledig af van het model zelf. Test zelf de beschikbaarheid van functieaanroepen van dit model.", + "title": "Ondersteuningsfunctie Oproep" }, "id": { - "extra": "Will be displayed as the model tag", - "placeholder": "Please enter the model ID, for example gpt-4-turbo-preview or claude-2.1", + "extra": "Wordt weergegeven als de modeltag", + "placeholder": "Voer de model ID in, bijvoorbeeld gpt-4-turbo-preview of claude-2.1", "title": "Model ID" }, - "modalTitle": "Custom Model Configuration", + "modalTitle": "Aangepaste modelconfiguratie", "tokens": { - "title": "Maximum Token Count" + "title": "Maximaal tokenaantal", + "unlimited": "onbeperkt" }, "vision": { - "extra": "This configuration will only enable the image upload feature in LobeChat. Whether image recognition is supported depends entirely on the model itself. Please test the availability of visual recognition capability of this model on your own.", - "title": "Support Visual Recognition" + "extra": "Deze configuratie schakelt alleen de configuratie voor het uploaden van afbeeldingen in LobeChat in. Of herkenning wordt ondersteund, hangt volledig af van het model zelf. Test zelf de beschikbaarheid van visuele herkenning in dit model.", + "title": "Ondersteuning van visuele herkenning" } } }, "fetchOnClient": { - "desc": "使用客户端请求模式将直接从浏览器发起会话请求，可提升响应速度", - "title": "使用客户端请求模式" + "desc": "De ophaalmodus aan de clientzijde initieert sessieverzoeken rechtstreeks vanuit de browser, waardoor de reactiesnelheid wordt verbeterd.", + "title": "Gebruik de ophaalmodus aan de clientzijde" }, "fetcher": { "fetch": "Haal model lijst op", diff --git a/locales/pl-PL/setting.json b/locales/pl-PL/setting.json index b675d2844f5d7..a3303b1e5b372 100644 --- a/locales/pl-PL/setting.json +++ b/locales/pl-PL/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Konfiguracja niestandardowego modelu", "tokens": { - "title": "Maksymalna liczba tokenów" + "title": "Maksymalna liczba tokenów", + "unlimited": "Nieograniczony" }, "vision": { "extra": "Ta konfiguracja aktywuje tylko możliwość przesyłania obrazów w LobeChat. Możliwość rozpoznawania zależy wyłącznie od modelu. Proszę przetestować dostępność rozpoznawania wizyjnego tego modelu", diff --git a/locales/pt-BR/setting.json b/locales/pt-BR/setting.json index 24285dda4d574..3bd30c1045e25 100644 --- a/locales/pt-BR/setting.json +++ b/locales/pt-BR/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Configuração de Modelo Personalizado", "tokens": { - "title": "Número Máximo de Tokens" + "title": "Número Máximo de Tokens", + "unlimited": "ilimitado" }, "vision": { "extra": "Esta configuração ativará apenas a configuração de upload de imagens no LobeChat. A capacidade de reconhecimento depende inteiramente do modelo em si. Por favor, teste a disponibilidade da capacidade de reconhecimento visual deste modelo.", diff --git a/locales/ru-RU/setting.json b/locales/ru-RU/setting.json index ea125cc8377a9..640666cfb3a37 100644 --- a/locales/ru-RU/setting.json +++ b/locales/ru-RU/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Настройка пользовательской модели", "tokens": { - "title": "Максимальное количество токенов" + "title": "Максимальное количество токенов", + "unlimited": "неограниченный" }, "vision": { "extra": "Эта настройка активирует только конфигурацию загрузки изображений в LobeChat. Поддержка распознавания полностью зависит от самой модели, пожалуйста, протестируйте доступность распознавания изображений этой модели самостоятельно", diff --git a/locales/tr-TR/setting.json b/locales/tr-TR/setting.json index a3ba1732383c3..c5a528166acd5 100644 --- a/locales/tr-TR/setting.json +++ b/locales/tr-TR/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Özel Model Yapılandırması", "tokens": { - "title": "Maksimum token sayısı" + "title": "Maksimum token sayısı", + "unlimited": "Sınırsız" }, "vision": { "extra": "Bu yapılandırma yalnızca LobeChat'teki görüntü yükleme yapılandırmasını etkinleştirir, tanıma desteğinin olup olmadığı tamamen modelin kendisine bağlıdır, bu modelin görüntü tanıma yeteneğini test etmek size kalmıştır", diff --git a/locales/vi-VN/setting.json b/locales/vi-VN/setting.json index 950065fc70a2d..e38db669913ef 100644 --- a/locales/vi-VN/setting.json +++ b/locales/vi-VN/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "Cấu hình mô hình tùy chỉnh", "tokens": { - "title": "Số lượng token tối đa" + "title": "Số lượng token tối đa", + "unlimited": "vô hạn" }, "vision": { "extra": "Cấu hình này chỉ mở khả năng tải lên hình ảnh trong LobeChat, việc hỗ trợ nhận diện hoàn toàn phụ thuộc vào mô hình chính mình, hãy tự kiểm tra tính khả dụng của khả năng nhận diện hình ảnh của mô hình", diff --git a/locales/zh-CN/setting.json b/locales/zh-CN/setting.json index 646ab296f7db0..cb0e358959bac 100644 --- a/locales/zh-CN/setting.json +++ b/locales/zh-CN/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "自定义模型配置", "tokens": { - "title": "最大 token 数" + "title": "最大 token 数", + "unlimited": "无限制" }, "vision": { "extra": "此配置将仅开启 LobeChat 中的图片上传配置，是否支持识别完全取决于模型本身，请自行测试该模型的视觉识别能力可用性", diff --git a/locales/zh-TW/setting.json b/locales/zh-TW/setting.json index 74dea445ed84e..ace1946d1217e 100644 --- a/locales/zh-TW/setting.json +++ b/locales/zh-TW/setting.json @@ -67,7 +67,8 @@ }, "modalTitle": "自定義模型配置", "tokens": { - "title": "最大 token 數" + "title": "最大 token 數", + "unlimited": "無限制" }, "vision": { "extra": "此配置將僅開啟 LobeChat 中的圖片上傳配置，是否支持識別完全取決於模型本身，請自行測試該模型的視覺識別能力可用性", diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index 56d1718f51624..c3c12fc67ac3f 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -1,5 +1,6 @@ import { InputNumber, Slider, SliderSingleProps } from 'antd'; import { memo } from 'react'; +import { useTranslation } from 'react-i18next'; import { Flexbox } from 'react-layout-kit'; import useMergeState from 'use-merge-value'; @@ -26,6 +27,8 @@ interface MaxTokenSliderProps { } const MaxTokenSlider = memo(({ value, onChange, defaultValue }) => { + const { t } = useTranslation('setting'); + const [token, setTokens] = useMergeState(0, { defaultValue, onChange, @@ -62,7 +65,7 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu formatter: (x) => { if (typeof x === 'undefined') return; - if (x === 0) return '无限制'; + if (x === 0) return t('llm.customModelCards.modelConfig.tokens.unlimited'); const value = getRealValue(x); diff --git a/src/locales/default/setting.ts b/src/locales/default/setting.ts index 613d015d73520..ecc82114ee413 100644 --- a/src/locales/default/setting.ts +++ b/src/locales/default/setting.ts @@ -68,7 +68,10 @@ export default { title: '模型 ID', }, modalTitle: '自定义模型配置', - tokens: { title: '最大 token 数' }, + tokens: { + title: '最大 token 数', + unlimited: '无限制', + }, vision: { extra: '此配置将仅开启 LobeChat 中的图片上传配置，是否支持识别完全取决于模型本身，请自行测试该模型的视觉识别能力可用性', From 9288be39321c26f746557d6dba6b83899551b402 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 09:35:48 +0000 Subject: [PATCH 04/14] Small screen adaptation --- .../ProviderModelList/MaxTokenSlider.tsx | 20 ++++++++++--------- 1 file changed, 11 insertions(+), 9 deletions(-) diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index c3c12fc67ac3f..847b42dfa603c 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -7,17 +7,19 @@ import useMergeState from 'use-merge-value'; const exponent = (num: number) => Math.log2(num); const getRealValue = (num: number) => Math.round(Math.pow(2, num)); +const isSmallScreen = typeof window !== 'undefined' ? window.innerWidth < 475 : false; + const marks: SliderSingleProps['marks'] = { [exponent(1)]: '0', - [exponent(2)]: '2K', - [exponent(4)]: '4K', - [exponent(8)]: '8K', - [exponent(16)]: '16K', - [exponent(32)]: '32K', - [exponent(64)]: '64K', - [exponent(128)]: '128K', - [exponent(256)]: '256K', - [exponent(1024)]: '1M', + [exponent(2)]: isSmallScreen ? '2' : '2K', + [exponent(4)]: isSmallScreen ? '4' : '4K', + [exponent(8)]: isSmallScreen ? '8' : '8K', + [exponent(16)]: isSmallScreen ? '16' : '16K', + [exponent(32)]: isSmallScreen ? '32' : '32K', + [exponent(64)]: isSmallScreen ? '64' : '64K', + [exponent(128)]: isSmallScreen ? '128' : '128K', + [exponent(256)]: isSmallScreen ? '256' : '256K', + [exponent(1024)]: isSmallScreen ? '1024' : '1M', }; interface MaxTokenSliderProps { From 4decfceee3eaaa7ef182d919d93189b93594cf66 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 09:36:51 +0000 Subject: [PATCH 05/14] `next/image` Un-configured Host --- next.config.mjs | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/next.config.mjs b/next.config.mjs index 73786d7be41cf..e8b1f3ec5da24 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -36,6 +36,17 @@ const nextConfig = { ], reactStrictMode: true, + images: { + remotePatterns: [ + { + protocol: 'https', + hostname: 'registry.npmmirror.com', + port: '', + pathname: '/@lobehub/**', + }, + ], + }, + webpack(config) { config.experiments = { asyncWebAssembly: true, From feb96baa36e8eeb4faa85bf8ad968a08063b377a Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 11:45:30 +0000 Subject: [PATCH 06/14] ModelSelect.featureTag.tokens --- src/components/ModelSelect/index.tsx | 13 ++++++++----- src/types/llm.ts | 2 +- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index addaa0acd4690..ebc15134bc0db 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -57,10 +57,11 @@ const useStyles = createStyles(({ css, token }) => ({ `, })); const formatTokenNumber = (num: number): string => { + if (num === 0) return 'Inf'; if (num < 1000) return '1K'; const kiloToken = Math.floor(num / 1000); return kiloToken < 1000 ? `${kiloToken}K` : `${Math.floor(kiloToken / 1000)}M`; -} +}; interface ModelInfoTagsProps extends ChatModelCard { directionReverse?: boolean; @@ -94,20 +95,22 @@ export const ModelInfoTags = memo( placement={placement} title={t('ModelSelect.featureTag.functionCall')} > -
+
)} - {model.tokens && ( + {model.tokens !== undefined && ( -
{formatTokenNumber(model.tokens)}
+
+ {formatTokenNumber(model.tokens)} +
)} {/*{model.isCustom && (*/} diff --git a/src/types/llm.ts b/src/types/llm.ts index 98bf8737ffe4b..ef1baad680a9b 100644 --- a/src/types/llm.ts +++ b/src/types/llm.ts @@ -32,7 +32,7 @@ export interface ChatModelCard { legacy?: boolean; maxOutput?: number; /** - * the context window + * the context window (or input tokens limit) */ tokens?: number; /** From ff17c882e8133b5ae164ee33068af80271a71438 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 28 Apr 2024 14:07:20 +0000 Subject: [PATCH 07/14] 128k=128,000, 4K=4096, Kibi / kilo --- .../ProviderModelList/MaxTokenSlider.tsx | 25 ++++++++++--------- src/components/ModelSelect/index.tsx | 8 ++++-- 2 files changed, 19 insertions(+), 14 deletions(-) diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index 847b42dfa603c..728004e8dc541 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -6,19 +6,22 @@ import useMergeState from 'use-merge-value'; const exponent = (num: number) => Math.log2(num); const getRealValue = (num: number) => Math.round(Math.pow(2, num)); +const power1024 = (num: number) => Math.round(Math.pow(2, num) * 1024); const isSmallScreen = typeof window !== 'undefined' ? window.innerWidth < 475 : false; const marks: SliderSingleProps['marks'] = { [exponent(1)]: '0', - [exponent(2)]: isSmallScreen ? '2' : '2K', + [exponent(2)]: isSmallScreen ? '2' : '2K', // 2 Kibi = 2048 [exponent(4)]: isSmallScreen ? '4' : '4K', [exponent(8)]: isSmallScreen ? '8' : '8K', [exponent(16)]: isSmallScreen ? '16' : '16K', [exponent(32)]: isSmallScreen ? '32' : '32K', [exponent(64)]: isSmallScreen ? '64' : '64K', - [exponent(128)]: isSmallScreen ? '128' : '128K', - [exponent(256)]: isSmallScreen ? '256' : '256K', + // [exponent(128)]: isSmallScreen ? '128' : '128K', + // [exponent(256)]: isSmallScreen ? '256' : '256K', + [exponent((128 / 1024) * 1000)]: ' ', + [exponent((200 / 1024) * 1000)]: isSmallScreen ? '200' : '200k', // 200,000 [exponent(1024)]: isSmallScreen ? '1024' : '1M', }; @@ -38,18 +41,18 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu }); const [powValue, setPowValue] = useMergeState(0, { - defaultValue: exponent(typeof defaultValue === 'undefined' ? 0 : defaultValue / 1000), + defaultValue: exponent(typeof defaultValue === 'undefined' ? 0 : defaultValue / 1024), value: exponent(typeof value === 'undefined' ? 0 : value / 1024), }); const updateWithPowValue = (value: number) => { setPowValue(value); - setTokens(getRealValue(value) === 1 ? 0 : getRealValue(value) * 1024); + setTokens(getRealValue(value) === 1 ? 0 : power1024(value)); }; const updateWithRealValue = (value: number) => { - setTokens(value); + setTokens(Math.round(value)); setPowValue(exponent(value / 1024)); }; @@ -62,17 +65,15 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu max={exponent(1024)} min={0} onChange={updateWithPowValue} - step={2} + step={null} tooltip={{ formatter: (x) => { if (typeof x === 'undefined') return; - if (x === 0) return t('llm.customModelCards.modelConfig.tokens.unlimited'); - const value = getRealValue(x); - - if (value < 1024) return value.toFixed(0) + 'K'; - + let value = getRealValue(x); + if (value < 125) return value.toFixed(0) + 'K'; + else if (value < 1024) return ((value * 1024) / 1000).toFixed(0) + 'k'; return (value / 1024).toFixed(0) + 'M'; }, }} diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index ebc15134bc0db..dc09a9f28b042 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -58,8 +58,12 @@ const useStyles = createStyles(({ css, token }) => ({ })); const formatTokenNumber = (num: number): string => { if (num === 0) return 'Inf'; - if (num < 1000) return '1K'; - const kiloToken = Math.floor(num / 1000); + if (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`; }; From 157b911a76ba7ebe318afed41d0fd5f2f340a9c6 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Mon, 29 Apr 2024 12:10:11 +0800 Subject: [PATCH 08/14] Restore llm.ts --- src/types/llm.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/types/llm.ts b/src/types/llm.ts index ef1baad680a9b..98bf8737ffe4b 100644 --- a/src/types/llm.ts +++ b/src/types/llm.ts @@ -32,7 +32,7 @@ export interface ChatModelCard { legacy?: boolean; maxOutput?: number; /** - * the context window (or input tokens limit) + * the context window */ tokens?: number; /** From 2d424af875f95fabd67240b115e0c5b69713a83c Mon Sep 17 00:00:00 2001 From: sxjeru Date: Mon, 29 Apr 2024 18:46:08 +0800 Subject: [PATCH 09/14] =?UTF-8?q?Inf=20->=20=E2=88=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../llm/components/ProviderModelList/MaxTokenSlider.tsx | 2 +- src/components/ModelSelect/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index 728004e8dc541..aedf9f73bc268 100644 --- a/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -20,7 +20,7 @@ const marks: SliderSingleProps['marks'] = { [exponent(64)]: isSmallScreen ? '64' : '64K', // [exponent(128)]: isSmallScreen ? '128' : '128K', // [exponent(256)]: isSmallScreen ? '256' : '256K', - [exponent((128 / 1024) * 1000)]: ' ', + [exponent((128 / 1024) * 1000)]: ' ', // hide tick mark [exponent((200 / 1024) * 1000)]: isSmallScreen ? '200' : '200k', // 200,000 [exponent(1024)]: isSmallScreen ? '1024' : '1M', }; diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index dc09a9f28b042..d1aa2cb969c0c 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -57,7 +57,7 @@ const useStyles = createStyles(({ css, token }) => ({ `, })); const formatTokenNumber = (num: number): string => { - if (num === 0) return 'Inf'; + if (num === 0) return '∞'; if (num < 1024) return '1K'; let kiloToken = Math.floor(num / 1024); From fbd1b768c8834345ca7d002ae57898e72deade12 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Tue, 30 Apr 2024 16:12:17 +0000 Subject: [PATCH 10/14] patch --- next.config.mjs | 11 ----------- src/components/ModelSelect/index.tsx | 2 +- 2 files changed, 1 insertion(+), 12 deletions(-) diff --git a/next.config.mjs b/next.config.mjs index 2a7903a0d22cb..ec78d209b4c46 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -37,17 +37,6 @@ const nextConfig = { ], reactStrictMode: true, - images: { - remotePatterns: [ - { - protocol: 'https', - hostname: 'registry.npmmirror.com', - port: '', - pathname: '/@lobehub/**', - }, - ], - }, - webpack(config) { config.experiments = { asyncWebAssembly: true, diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index d1aa2cb969c0c..ef84d07d6956c 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -88,7 +88,7 @@ export const ModelInfoTags = memo( )} {model.vision && ( -
+
From 6ac2cbb4d2b493542c0eeec0206fa4891974bdc8 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Thu, 2 May 2024 23:14:22 +0800 Subject: [PATCH 11/14] const Kibi = 1024; --- .../ProviderModelList/MaxTokenSlider.tsx | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index aedf9f73bc268..28756fe2cda02 100644 --- a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -4,9 +4,11 @@ import { useTranslation } from 'react-i18next'; import { Flexbox } from 'react-layout-kit'; import useMergeState from 'use-merge-value'; +const Kibi = 1024; + const exponent = (num: number) => Math.log2(num); const getRealValue = (num: number) => Math.round(Math.pow(2, num)); -const power1024 = (num: number) => Math.round(Math.pow(2, num) * 1024); +const powerKibi = (num: number) => Math.round(Math.pow(2, num) * Kibi); const isSmallScreen = typeof window !== 'undefined' ? window.innerWidth < 475 : false; @@ -20,8 +22,8 @@ const marks: SliderSingleProps['marks'] = { [exponent(64)]: isSmallScreen ? '64' : '64K', // [exponent(128)]: isSmallScreen ? '128' : '128K', // [exponent(256)]: isSmallScreen ? '256' : '256K', - [exponent((128 / 1024) * 1000)]: ' ', // hide tick mark - [exponent((200 / 1024) * 1000)]: isSmallScreen ? '200' : '200k', // 200,000 + [exponent((128 / Kibi) * 1000)]: ' ', // hide tick mark + [exponent((200 / Kibi) * 1000)]: isSmallScreen ? '200' : '200k', // 200,000 [exponent(1024)]: isSmallScreen ? '1024' : '1M', }; @@ -42,19 +44,19 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu const [powValue, setPowValue] = useMergeState(0, { defaultValue: exponent(typeof defaultValue === 'undefined' ? 0 : defaultValue / 1024), - value: exponent(typeof value === 'undefined' ? 0 : value / 1024), + value: exponent(typeof value === 'undefined' ? 0 : value / Kibi), }); const updateWithPowValue = (value: number) => { setPowValue(value); - setTokens(getRealValue(value) === 1 ? 0 : power1024(value)); + setTokens(getRealValue(value) === 1 ? 0 : powerKibi(value)); }; const updateWithRealValue = (value: number) => { setTokens(Math.round(value)); - setPowValue(exponent(value / 1024)); + setPowValue(exponent(value / Kibi)); }; return ( @@ -73,8 +75,8 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu let value = getRealValue(x); if (value < 125) return value.toFixed(0) + 'K'; - else if (value < 1024) return ((value * 1024) / 1000).toFixed(0) + 'k'; - return (value / 1024).toFixed(0) + 'M'; + else if (value < Kibi) return ((value * Kibi) / 1000).toFixed(0) + 'k'; + return (value / Kibi).toFixed(0) + 'M'; }, }} value={powValue} From c2527ba3a3af58dcc005e40b0ef9e6106a0085c1 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sat, 4 May 2024 06:09:46 +0000 Subject: [PATCH 12/14] refactor marks --- .../ProviderModelList/MaxTokenSlider.tsx | 41 ++++++++++--------- 1 file changed, 22 insertions(+), 19 deletions(-) diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index 28756fe2cda02..d2e115d04b927 100644 --- a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -1,32 +1,18 @@ -import { InputNumber, Slider, SliderSingleProps } from 'antd'; -import { memo } from 'react'; +import { InputNumber, Slider } from 'antd'; +import { memo, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { Flexbox } from 'react-layout-kit'; import useMergeState from 'use-merge-value'; +import { useServerConfigStore } from '@/store/serverConfig'; +import { serverConfigSelectors } from '@/store/serverConfig/selectors'; + const Kibi = 1024; const exponent = (num: number) => Math.log2(num); const getRealValue = (num: number) => Math.round(Math.pow(2, num)); const powerKibi = (num: number) => Math.round(Math.pow(2, num) * Kibi); -const isSmallScreen = typeof window !== 'undefined' ? window.innerWidth < 475 : false; - -const marks: SliderSingleProps['marks'] = { - [exponent(1)]: '0', - [exponent(2)]: isSmallScreen ? '2' : '2K', // 2 Kibi = 2048 - [exponent(4)]: isSmallScreen ? '4' : '4K', - [exponent(8)]: isSmallScreen ? '8' : '8K', - [exponent(16)]: isSmallScreen ? '16' : '16K', - [exponent(32)]: isSmallScreen ? '32' : '32K', - [exponent(64)]: isSmallScreen ? '64' : '64K', - // [exponent(128)]: isSmallScreen ? '128' : '128K', - // [exponent(256)]: isSmallScreen ? '256' : '256K', - [exponent((128 / Kibi) * 1000)]: ' ', // hide tick mark - [exponent((200 / Kibi) * 1000)]: isSmallScreen ? '200' : '200k', // 200,000 - [exponent(1024)]: isSmallScreen ? '1024' : '1M', -}; - interface MaxTokenSliderProps { defaultValue?: number; onChange?: (value: number) => void; @@ -59,6 +45,23 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu setPowValue(exponent(value / Kibi)); }; + const isMobile = useServerConfigStore(serverConfigSelectors.isMobile); + + const marks = useMemo(() => { + return { + [exponent(1)]: '0', + [exponent(2)]: isMobile ? '2' : '2K', // 2 Kibi = 2048 + [exponent(4)]: isMobile ? '4' : '4K', + [exponent(8)]: isMobile ? '8' : '8K', + [exponent(16)]: isMobile ? '16' : '16K', + [exponent(32)]: isMobile ? '32' : '32K', + [exponent(64)]: isMobile ? '64' : '64K', + [exponent((128 / Kibi) * 1000)]: ' ', // hide tick mark + [exponent((200 / Kibi) * 1000)]: isMobile ? '200' : '200k', // 200,000 + [exponent(1024)]: isMobile ? '1024' : '1M', + }; + }, [isMobile]); + return ( From 59049ded85764c93493e09d8cab56a5611b4d299 Mon Sep 17 00:00:00 2001 From: sxjeru Date: Sun, 5 May 2024 23:29:04 +0800 Subject: [PATCH 13/14] Update MaxTokenSlider.tsx --- .../llm/components/ProviderModelList/MaxTokenSlider.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx index d2e115d04b927..3094f2ab9a979 100644 --- a/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx +++ b/src/app/(main)/settings/llm/components/ProviderModelList/MaxTokenSlider.tsx @@ -58,7 +58,7 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu [exponent(64)]: isMobile ? '64' : '64K', [exponent((128 / Kibi) * 1000)]: ' ', // hide tick mark [exponent((200 / Kibi) * 1000)]: isMobile ? '200' : '200k', // 200,000 - [exponent(1024)]: isMobile ? '1024' : '1M', + [exponent(Kibi)]: isMobile ? '1024' : '1M', }; }, [isMobile]); @@ -67,7 +67,7 @@ const MaxTokenSlider = memo(({ value, onChange, defaultValu (({ value, onChange, defaultValu updateWithRealValue(e); }} - step={2048} + step={2 * Kibi} value={token} />
From 2108db46656a00abd43fa8e87b4e92a99c6231fb Mon Sep 17 00:00:00 2001 From: sxjeru Date: Mon, 6 May 2024 10:31:51 +0000 Subject: [PATCH 14/14] infinity icon --- src/components/ModelSelect/index.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/src/components/ModelSelect/index.tsx b/src/components/ModelSelect/index.tsx index ef84d07d6956c..5b8799711851a 100644 --- a/src/components/ModelSelect/index.tsx +++ b/src/components/ModelSelect/index.tsx @@ -1,6 +1,6 @@ import { Icon, Tooltip } from '@lobehub/ui'; import { createStyles } from 'antd-style'; -import { LucideEye, LucidePaperclip, ToyBrick } from 'lucide-react'; +import { Infinity, LucideEye, LucidePaperclip, ToyBrick } from 'lucide-react'; import numeral from 'numeral'; import { rgba } from 'polished'; import { memo } from 'react'; @@ -57,8 +57,7 @@ const useStyles = createStyles(({ css, token }) => ({ `, })); const formatTokenNumber = (num: number): string => { - if (num === 0) return '∞'; - if (num < 1024) return '1K'; + if (num > 0 && num < 1024) return '1K'; let kiloToken = Math.floor(num / 1024); if (num >= 128_000 && num < 1_024_000) { @@ -113,7 +112,11 @@ export const ModelInfoTags = memo( })} >
- {formatTokenNumber(model.tokens)} + {model.tokens === 0 ? ( + + ) : ( + formatTokenNumber(model.tokens) + )}
)}