diff --git a/client/src/components/Chat/CostBar.tsx b/client/src/components/Chat/CostBar.tsx index 44ea9aaafa..8e143d141a 100644 --- a/client/src/components/Chat/CostBar.tsx +++ b/client/src/components/Chat/CostBar.tsx @@ -1,5 +1,6 @@ import { ArrowIcon } from '@librechat/client'; import type { TConversationCosts } from 'librechat-data-provider'; +import { useLocalize } from '~/hooks'; import { cn } from '~/utils'; interface CostBarProps { @@ -8,6 +9,7 @@ interface CostBarProps { } export default function CostBar({ conversationCosts, showCostBar }: CostBarProps) { + const localize = useLocalize(); if (!conversationCosts || !conversationCosts.totals) { return null; } @@ -23,18 +25,26 @@ export default function CostBar({ conversationCosts, showCostBar }: CostBarProps
- {conversationCosts.totals.prompt.tokenCount}t + {localize('com_ui_token_abbreviation', { + 0: conversationCosts.totals.prompt.tokenCount, + })}
${Math.abs(conversationCosts.totals.prompt.usd).toFixed(6)}
-
{conversationCosts.totals.total.tokenCount}t
+
+ {localize('com_ui_token_abbreviation', { + 0: conversationCosts.totals.total.tokenCount, + })} +
${Math.abs(conversationCosts.totals.total.usd).toFixed(6)}
- {conversationCosts.totals.completion.tokenCount}t + {localize('com_ui_token_abbreviation', { + 0: conversationCosts.totals.completion.tokenCount, + })}
${Math.abs(conversationCosts.totals.completion.usd).toFixed(6)}
diff --git a/client/src/components/Chat/Messages/ui/MessageRender.tsx b/client/src/components/Chat/Messages/ui/MessageRender.tsx index 876675689b..e889d1feab 100644 --- a/client/src/components/Chat/Messages/ui/MessageRender.tsx +++ b/client/src/components/Chat/Messages/ui/MessageRender.tsx @@ -8,10 +8,10 @@ import PlaceholderRow from '~/components/Chat/Messages/ui/PlaceholderRow'; import SiblingSwitch from '~/components/Chat/Messages/SiblingSwitch'; import HoverButtons from '~/components/Chat/Messages/HoverButtons'; import MessageIcon from '~/components/Chat/Messages/MessageIcon'; +import { useMessageActions, useLocalize } from '~/hooks'; import { Plugin } from '~/components/Messages/Content'; import SubRow from '~/components/Chat/Messages/SubRow'; import { MessageContext } from '~/Providers'; -import { useMessageActions } from '~/hooks'; import { cn, logger } from '~/utils'; import store from '~/store'; @@ -39,6 +39,7 @@ const MessageRender = memo( isSubmittingFamily = false, costs, }: MessageRenderProps) => { + const localize = useLocalize(); const { ask, edit, @@ -183,7 +184,9 @@ const MessageRender = memo( ) : ( )} - {perMessageCost.tokenCount}t + {localize('com_ui_token_abbreviation', { + 0: perMessageCost.tokenCount, + })} )} ${Math.abs(perMessageCost.usd).toFixed(6)} diff --git a/client/src/components/Messages/ContentRender.tsx b/client/src/components/Messages/ContentRender.tsx index 045a39da85..bb5cb332a6 100644 --- a/client/src/components/Messages/ContentRender.tsx +++ b/client/src/components/Messages/ContentRender.tsx @@ -5,10 +5,10 @@ import type { TMessage, TMessageContentParts, TConversationCosts } from 'librech import type { TMessageProps, TMessageIcon } from '~/common'; import ContentParts from '~/components/Chat/Messages/Content/ContentParts'; import PlaceholderRow from '~/components/Chat/Messages/ui/PlaceholderRow'; +import { useAttachments, useMessageActions, useLocalize } from '~/hooks'; import SiblingSwitch from '~/components/Chat/Messages/SiblingSwitch'; import HoverButtons from '~/components/Chat/Messages/HoverButtons'; import MessageIcon from '~/components/Chat/Messages/MessageIcon'; -import { useAttachments, useMessageActions } from '~/hooks'; import SubRow from '~/components/Chat/Messages/SubRow'; import { cn, logger } from '~/utils'; import store from '~/store'; @@ -37,6 +37,7 @@ const ContentRender = memo( isSubmittingFamily = false, costs, }: ContentRenderProps) => { + const localize = useLocalize(); const { attachments, searchResults } = useAttachments({ messageId: msg?.messageId, attachments: msg?.attachments, @@ -180,7 +181,9 @@ const ContentRender = memo( ) : ( )} - {perMessageCost.tokenCount}t + {localize('com_ui_token_abbreviation', { + 0: perMessageCost.tokenCount, + })} )} ${Math.abs(perMessageCost.usd).toFixed(6)} diff --git a/client/src/locales/en/translation.json b/client/src/locales/en/translation.json index faccb8dd1e..12c24adccd 100644 --- a/client/src/locales/en/translation.json +++ b/client/src/locales/en/translation.json @@ -1197,6 +1197,7 @@ "com_ui_thinking": "Thinking...", "com_ui_thoughts": "Thoughts", "com_ui_token": "token", + "com_ui_token_abbreviation": "{{0}}t", "com_ui_token_exchange_method": "Token Exchange Method", "com_ui_token_url": "Token URL", "com_ui_tokens": "tokens",