feat(dashboard): update model analytics section and enhance user charts functionality

- Renamed "Models" to "Model Call Analytics" and updated descriptions for clarity.
- Introduced a new state for top user limits in user charts, allowing users to select the number of top users displayed.
- Enhanced user charts to include total call count display and improved data processing for better analytics.
- Added new translations for updated terms in multiple languages to support internationalization.

web/default/src/features/dashboard/components/models/model-charts.tsx

@@ -78,7 +78,12 @@ export function ModelCharts(props: ModelChartsProps) {
       <div className='flex w-full flex-col gap-3 border-b px-4 py-3 sm:px-5 lg:flex-row lg:items-center lg:justify-between'>
         <div className='flex items-center gap-2'>
           <PieChartIcon className='text-muted-foreground/60 size-4' />
-          <div className='text-sm font-semibold'>{t('Model Analytics')}</div>
+          <div className='text-sm font-semibold'>
+            {t('Model Call Analytics')}
+          </div>
+          <span className='text-muted-foreground text-xs'>
+            {t('Total:')} {chartData.totalCountDisplay}
+          </span>
         </div>
 
         <div className='bg-muted/60 inline-flex h-8 rounded-md border p-0.5'>

web/default/src/features/dashboard/components/users/user-charts.tsx

@@ -41,6 +41,8 @@ const USER_CHARTS: {
   },
 ]
 
+const TOP_USER_LIMIT_OPTIONS = [5, 10, 20, 50]
+
 export function UserCharts() {
   const { t } = useTranslation()
   const { resolvedTheme } = useTheme()
@@ -55,6 +57,7 @@ export function UserCharts() {
   const [selectedRange, setSelectedRange] = useState<number>(() =>
     getDefaultDays(timeGranularity)
   )
+  const [topUserLimit, setTopUserLimit] = useState(10)
   const [timeRange, setTimeRange] = useState(() => {
     const days = getDefaultDays(timeGranularity)
     const { start, end } = getNormalizedDateRange(days)
@@ -113,9 +116,10 @@ export function UserCharts() {
       processUserChartData(
         isLoading ? [] : (userData ?? []),
         timeGranularity,
-        t
+        t,
+        topUserLimit
       ),
-    [userData, isLoading, timeGranularity, t]
+    [userData, isLoading, timeGranularity, t, topUserLimit]
   )
 
   return (
@@ -158,6 +162,26 @@ export function UserCharts() {
           ))}
         </div>
 
+        <div className='flex items-center gap-1.5 rounded-md border p-0.5'>
+          <span className='text-muted-foreground px-2 text-xs font-medium'>
+            {t('Top Users')}
+          </span>
+          {TOP_USER_LIMIT_OPTIONS.map((limit) => (
+            <button
+              key={limit}
+              type='button'
+              onClick={() => setTopUserLimit(limit)}
+              className={`rounded-[5px] px-2.5 py-1 text-xs font-medium transition-colors ${
+                topUserLimit === limit
+                  ? 'bg-primary text-primary-foreground shadow-sm'
+                  : 'text-muted-foreground hover:bg-muted hover:text-foreground'
+              }`}
+            >
+              {t('Top {{count}}', { count: limit })}
+            </button>
+          ))}
+        </div>
+
         {isLoading && (
           <Loader2 className='text-muted-foreground size-4 animate-spin' />
         )}
@@ -184,7 +208,7 @@ export function UserCharts() {
                   themeReady &&
                   spec && (
                     <VChart
-                      key={`user-${chart.value}-${resolvedTheme}`}
+                      key={`user-${chart.value}-${topUserLimit}-${resolvedTheme}`}
                       spec={{
                         ...spec,
                         theme: resolvedTheme === 'dark' ? 'dark' : 'light',

web/default/src/features/dashboard/index.tsx

@@ -86,8 +86,8 @@ const SECTION_META: Record<
     descriptionKey: 'View dashboard overview and statistics',
   },
   models: {
-    titleKey: 'Models',
+    titleKey: 'Model Call Analytics',
-    descriptionKey: 'View model statistics and charts',
+    descriptionKey: 'View model call count analytics and charts',
   },
   users: {
     titleKey: 'User Analytics',

web/default/src/features/dashboard/lib/charts.ts

@@ -158,7 +158,6 @@ export function processChartData(
         title: {
           visible: true,
           text: tt('Call Trend'),
-          subtext: `${tt('Total:')} ${formatInt(0)}`,
         },
       },
       spec_rank_bar: {
@@ -171,10 +170,10 @@ export function processChartData(
         title: {
           visible: true,
           text: tt('Call Count Ranking'),
-          subtext: `${tt('Total:')} ${formatInt(0)}`,
         },
       },
       totalQuotaDisplay: formatQuotaTotal(0),
+      totalCountDisplay: formatInt(0),
     }
   }
 
@@ -426,7 +425,6 @@ export function processChartData(
       title: {
         visible: true,
         text: tt('Call Count Distribution'),
-        subtext: `${tt('Total:')} ${formatInt(totalTimes)}`,
       },
       legends: { visible: true, orient: 'left' },
       label: { visible: true },
@@ -541,7 +539,6 @@ export function processChartData(
       title: {
         visible: true,
         text: tt('Call Trend'),
-        subtext: `${tt('Total:')} ${formatInt(totalTimes)}`,
       },
       tooltip: {
         mark: {
@@ -611,7 +608,6 @@ export function processChartData(
       title: {
         visible: true,
         text: tt('Call Count Ranking'),
-        subtext: `${tt('Total:')} ${formatInt(totalTimes)}`,
       },
       bar: {
         state: {
@@ -633,6 +629,7 @@ export function processChartData(
       animation: true,
     },
     totalQuotaDisplay: formatQuotaTotal(totalQuotaRaw),
+    totalCountDisplay: formatInt(totalTimes),
   }
 }
 
@@ -796,6 +793,21 @@ export function processUserChartData(
                 formatVal(Number(datum?.rawQuota) || 0),
             },
           ],
+          updateContent: (
+            array: Array<{
+              key: string
+              value: string | number
+              datum?: Record<string, unknown>
+            }>
+          ) => {
+            for (let i = 0; i < array.length; i++) {
+              const rawQuota = array[i].datum?.rawQuota
+              const value =
+                rawQuota === undefined ? array[i].value : Number(rawQuota)
+              array[i].value = formatVal(Number(value) || 0)
+            }
+            return array
+          },
         },
       },
       color: { specified: userColorMap },

web/default/src/features/dashboard/section-registry.tsx

@@ -13,8 +13,8 @@ const DASHBOARD_SECTIONS = [
   },
   {
     id: 'models',
-    titleKey: 'Models',
+    titleKey: 'Model Call Analytics',
-    descriptionKey: 'View model statistics and charts',
+    descriptionKey: 'View model call count analytics and charts',
     build: () => null,
   },
   {

web/default/src/features/dashboard/types.ts

@@ -75,6 +75,7 @@ export interface ProcessedChartData {
   spec_model_line: VChartSpec
   spec_rank_bar: VChartSpec
   totalQuotaDisplay: string
+  totalCountDisplay: string
 }
 
 export interface ProcessedUserChartData {

web/default/src/i18n/locales/en.json

@@ -1957,6 +1957,7 @@
     "Model": "Model",
     "Model Access": "Model Access",
     "Model Analytics": "Model Analytics",
+    "Model Call Analytics": "Model Call Analytics",
     "Model context usage": "Model context usage",
     "Model deleted": "Model deleted",
     "Model deleted successfully": "Model deleted successfully",
@@ -3303,7 +3304,9 @@
     "Tool identifier": "Tool identifier",
     "Tool price settings": "Tool price settings",
     "Tool prices": "Tool prices",
+    "Top {{count}}": "Top {{count}}",
     "Top Models": "Top Models",
+    "Top Users": "Top Users",
     "Top up balance and view billing history.": "Top up balance and view billing history.",
     "Top-up": "Top-up",
     "Top-up amount options": "Top-up amount options",
@@ -3548,6 +3551,7 @@
     "View document": "View document",
     "View logs": "View logs",
     "View mode": "View mode",
+    "View model call count analytics and charts": "View model call count analytics and charts",
     "View model statistics and charts": "View model statistics and charts",
     "View Pricing": "View Pricing",
     "View the complete details for this": "View the complete details for this",

web/default/src/i18n/locales/fr.json

@@ -1957,6 +1957,7 @@
     "Model": "Modèle",
     "Model Access": "Accès au modèle",
     "Model Analytics": "Analyse des modèles",
+    "Model Call Analytics": "Analyse des appels de modèles",
     "Model context usage": "Utilisation du contexte du modèle",
     "Model deleted": "Modèle supprimé",
     "Model deleted successfully": "Modèle supprimé avec succès",
@@ -3303,7 +3304,9 @@
     "Tool identifier": "Identifiant d’outil",
     "Tool price settings": "Paramètres de prix des outils",
     "Tool prices": "Prix des outils",
+    "Top {{count}}": "Top {{count}}",
     "Top Models": "Top Modèles",
+    "Top Users": "Top utilisateurs",
     "Top up balance and view billing history.": "Recharger le solde et consulter l'historique de facturation.",
     "Top-up": "Recharge",
     "Top-up amount options": "Options de montant de recharge",
@@ -3548,6 +3551,7 @@
     "View document": "Afficher le document",
     "View logs": "Voir les logs",
     "View mode": "Mode d'affichage",
+    "View model call count analytics and charts": "Afficher les analyses et graphiques du nombre d'appels par modèle",
     "View model statistics and charts": "Afficher les statistiques et graphiques des modèles",
     "View Pricing": "Voir les tarifs",
     "View the complete details for this": "Voir les détails complets de ce",

web/default/src/i18n/locales/ja.json

@@ -1957,6 +1957,7 @@
     "Model": "モデル",
     "Model Access": "モデルアクセス",
     "Model Analytics": "モデル分析",
+    "Model Call Analytics": "モデル呼び出し分析",
     "Model context usage": "モデルのコンテキスト使用量",
     "Model deleted": "モデルが削除されました",
     "Model deleted successfully": "モデルが正常に削除されました",
@@ -3303,7 +3304,9 @@
     "Tool identifier": "ツールID",
     "Tool price settings": "ツール価格設定",
     "Tool prices": "ツール価格",
+    "Top {{count}}": "上位 {{count}}",
     "Top Models": "トップモデル",
+    "Top Users": "上位ユーザー",
     "Top up balance and view billing history.": "残高をチャージし、請求履歴を確認。",
     "Top-up": "チャージ",
     "Top-up amount options": "トップアップ金額オプション",
@@ -3548,6 +3551,7 @@
     "View document": "ドキュメントを表示",
     "View logs": "ログを表示",
     "View mode": "表示モード",
+    "View model call count analytics and charts": "モデル呼び出し回数の分析とグラフを表示",
     "View model statistics and charts": "モデルの統計とグラフを表示",
     "View Pricing": "価格を見る",
     "View the complete details for this": "この",

web/default/src/i18n/locales/ru.json

@@ -1957,6 +1957,7 @@
     "Model": "Модель",
     "Model Access": "Доступ к моделям",
     "Model Analytics": "Аналитика моделей",
+    "Model Call Analytics": "Аналитика вызовов моделей",
     "Model context usage": "Использование контекста модели",
     "Model deleted": "Модель удалена",
     "Model deleted successfully": "Модель успешно удалена",
@@ -3303,7 +3304,9 @@
     "Tool identifier": "Идентификатор инструмента",
     "Tool price settings": "Настройки цен на инструменты",
     "Tool prices": "Цены инструментов",
+    "Top {{count}}": "Топ {{count}}",
     "Top Models": "Лучшие модели",
+    "Top Users": "Лучшие пользователи",
     "Top up balance and view billing history.": "Пополнить баланс и просмотреть историю платежей.",
     "Top-up": "Пополнение",
     "Top-up amount options": "Варианты суммы пополнения",
@@ -3548,6 +3551,7 @@
     "View document": "Просмотреть документ",
     "View logs": "Просмотреть логи",
     "View mode": "Режим отображения",
+    "View model call count analytics and charts": "Просмотр аналитики и графиков количества вызовов моделей",
     "View model statistics and charts": "Просмотр статистики и графиков моделей",
     "View Pricing": "Посмотреть цены",
     "View the complete details for this": "Просмотр полных деталей этой",

web/default/src/i18n/locales/vi.json

@@ -1957,6 +1957,7 @@
     "Model": "Mô hình",
     "Model Access": "Truy cập mô hình",
     "Model Analytics": "Phân tích mô hình",
+    "Model Call Analytics": "Phân tích lượt gọi mô hình",
     "Model context usage": "Sử dụng ngữ cảnh mô hình",
     "Model deleted": "Đã xóa mô hình",
     "Model deleted successfully": "Model đã được xóa thành công",
@@ -3303,7 +3304,9 @@
     "Tool identifier": "Định danh công cụ",
     "Tool price settings": "Cài đặt giá công cụ",
     "Tool prices": "Giá công cụ",
+    "Top {{count}}": "Top {{count}}",
     "Top Models": "Người mẫu hàng đầu",
+    "Top Users": "Người dùng hàng đầu",
     "Top up balance and view billing history.": "Nạp tiền vào tài khoản và xem lịch sử thanh toán.",
     "Top-up": "Nạp tiền",
     "Top-up amount options": "Tùy chọn số tiền nạp",
@@ -3548,6 +3551,7 @@
     "View document": "Xem tài liệu",
     "View logs": "Xem nhật ký",
     "View mode": "Chế độ xem",
+    "View model call count analytics and charts": "Xem phân tích và biểu đồ số lượt gọi mô hình",
     "View model statistics and charts": "Xem thống kê và biểu đồ mô hình",
     "View Pricing": "View price",
     "View the complete details for this": "Xem chi tiết đầy đủ của",

web/default/src/i18n/locales/zh.json

@@ -351,7 +351,7 @@
     "Audio playback failed": "音频无法播放",
     "Audio Preview": "音乐预览",
     "Audio ratio": "音频倍率",
-    "Audio Tokens": "语音令牌",
+    "Audio Tokens": "语音 Token",
     "Auth Style": "认证方式",
     "Authentication": "身份验证",
     "Authenticator code": "身份验证器代码",
@@ -911,7 +911,7 @@
     "Default API Version *": "默认 API 版本 *",
     "Default API version for this channel": "此渠道的默认 API 版本",
     "Default Collapse Sidebar": "默认折叠侧边栏",
-    "Default Max Tokens": "默认最大令牌数",
+    "Default Max Tokens": "默认最大 Token 数",
     "Default Responses API version, if empty, will use the API version above": "默认响应 API 版本，如果为空，将使用上面的 API 版本",
     "Default system prompt for this channel": "此渠道的默认系统提示",
     "Default time granularity": "默认时间粒度",
@@ -1030,7 +1030,7 @@
     "Display name for this payment method.": "此支付方式的显示名称。",
     "Display name shown to users.": "显示给用户的名称。",
     "Display Options": "显示选项",
-    "Display Token Statistics": "显示令牌统计信息",
+    "Display Token Statistics": "显示 Token 统计信息",
     "Displays the mobile sidebar.": "显示移动侧边栏。",
     "Do not over-trust this feature. IP may be spoofed. Please use with nginx, CDN and other gateways.": "请勿过度信任此功能，IP 可能被伪造，请配合 nginx 和 cdn 等网关使用",
     "Do not repeat check-in; only once per day": "请勿重复签到；每天仅一次",
@@ -1957,6 +1957,7 @@
     "Model": "模型",
     "Model Access": "模型访问",
     "Model Analytics": "模型数据分析",
+    "Model Call Analytics": "模型调用分析",
     "Model context usage": "模型上下文用量",
     "Model deleted": "模型已删除",
     "Model deleted successfully": "模型删除成功",
@@ -3053,7 +3054,7 @@
     "Static page describing the platform.": "描述平台的静态页面。",
     "Statistical count": "统计计数",
     "Statistical quota": "统计配额",
-    "Statistical tokens": "统计令牌",
+    "Statistical tokens": "统计 Token 数",
     "Statistics reset": "统计已重置",
     "Status": "状态",
     "Status & Sync": "状态与同步",
@@ -3297,13 +3298,15 @@
     "tokens": "令牌",
     "Tokens": "令牌",
     "Tokens Only": "仅限 Token",
-    "Tokens per minute": "每分钟令牌数",
+    "Tokens per minute": "每分钟 Token 数",
     "Tokens-only mode will show raw quota values regardless of this toggle.": "Tokens-only 模式将无视此开关显示原始配额值。",
     "Too many files. Some were not added.": "文件过多。部分未添加。",
     "Tool identifier": "工具标识",
     "Tool price settings": "工具价格设置",
     "Tool prices": "工具价格",
+    "Top {{count}}": "前 {{count}}",
     "Top Models": "热门模型",
+    "Top Users": "热门用户",
     "Top up balance and view billing history.": "充值余额并查看账单历史。",
     "Top-up": "充值",
     "Top-up amount options": "充值金额选项",
@@ -3328,7 +3331,7 @@
     "Total Quota": "总额度",
     "Total requests allowed per period. 0 = unlimited.": "每周期允许的总请求数。0 = 无限制。",
     "Total requests made": "总请求数",
-    "Total Tokens": "总令牌数",
+    "Total Tokens": "总 Token 数",
     "Total Usage": "总用量",
     "Total:": "总计：",
     "TPM": "TPM",
@@ -3548,6 +3551,7 @@
     "View document": "查看文档",
     "View logs": "查看日志",
     "View mode": "视图模式",
+    "View model call count analytics and charts": "查看模型调用次数统计和图表",
     "View model statistics and charts": "查看模型统计和图表",
     "View Pricing": "查看定价",
     "View the complete details for this": "查看此条",