chore: bump @gpustack/core-ui to v1.0.39

CLAUDE.md

@@ -124,24 +124,13 @@ Always check `@gpustack/core-ui` first. Frequently reused:
 - **Form fields**: `BaseSelect`, `Input` (labeled).
 - **Text overflow**: `AutoTooltip`.
 - **Icons**: `IconFont`.
-- **Tags & status** (4 variants): see the section below.
+- **Status display** (success/failed/processing/warning): `StatusTag`.
 - **Permission-gated visibility**: `Access` / `useAccess`.
 - **Request hooks**: `useRequest` / `useQueryData` / `useQueryDataList`.
 - **Table data fetching**: `useTableFetch`.
 - **Submit guard** (prevent double-submit): `useSubmitLock`.
 - **Tabbed forms**: `ScrollSpyTabs`.
 
-# Tags & status indicators
-
-Four core-ui components cover tag/status display in tables and lists. Pick by **what the value means**, not by how it looks — don't reach for a generic antd `Tag`:
-
-- **`StatusTag`** — semantic status with a **dynamic message/detail** (tooltip, download, extra content). Use when a row's status carries variable text, e.g. a failed job with an error message. Colors come from `StatusColorMap` (error/warning/transitioning/success/inactive).
-- **`StatusDot`** — colored dot + short label, **no message**. Use for a plain status/type cell where the value is a fixed enum (e.g. an event-type or log column). Same `StatusColorMap` palette; `inactive` dot is quaternary. If the status needs dynamic text, use `StatusTag` instead.
-- **`ThemeTag`** — a **standalone category label** (independent content, e.g. a permission scope or a model name). Default neutral; wraps antd `Tag`.
-- **`TextAttribute`** — a small neutral pill that is a **subordinate annotation following a primary text** (e.g. `key-name [custom]`), not a standalone tag. Manages its own leading margin. Two variants: `filled` (default) and `outlined`. Ref the name column in `src/pages/api-keys/hooks/use-keys-columns.tsx`.
-
-Rule of thumb: semantic + dynamic text → `StatusTag`; semantic + fixed enum → `StatusDot`; independent category → `ThemeTag`; annotation of nearby text → `TextAttribute`.
-
 # Dynamic add-item form fields
 
 When building a form, select the add-item component from the **shape of the field's data** (its schema). Match the schema, don't hand-roll a list UI:

package.json

@@ -17,7 +17,7 @@
     "@ant-design/pro-components": "3.1.0-0",
     "@antv/g6": "^5.0.51",
     "@braintree/sanitize-url": "^7.1.1",
-    "@gpustack/core-ui": "^1.0.40",
+    "@gpustack/core-ui": "^1.0.39",
     "@huggingface/gguf": "^0.1.7",
     "@huggingface/hub": "^0.15.1",
     "@huggingface/tasks": "^0.11.6",

pnpm-lock.yaml

@@ -24,8 +24,8 @@ importers:
         specifier: ^7.1.1
         version: 7.1.2
       '@gpustack/core-ui':
-        specifier: ^1.0.40
-        version: 1.0.40(czdvzceysqw7iv6pct2ucnb23e)
+        specifier: ^1.0.39
+        version: 1.0.39(czdvzceysqw7iv6pct2ucnb23e)
       '@huggingface/gguf':
         specifier: ^0.1.7
         version: 0.1.18
@@ -281,7 +281,7 @@ importers:
         version: 9.1.7
       less-loader:
         specifier: ^12.2.0
-        version: 12.3.2(less@4.6.4)(webpack@5.106.2(lightningcss@1.22.1)(postcss@8.5.14))
+        version: 12.3.2(less@4.1.3)(webpack@5.106.2(lightningcss@1.22.1)(postcss@8.5.14))
       lint-staged:
         specifier: ^15.2.2
         version: 15.5.2
@@ -1481,8 +1481,8 @@ packages:
     resolution: {integrity: sha512-KWk80UPIzPmUg+P0rKh6TqspRw0G6eux1PuJr+zz47ftMaZ9QDwbGzHZbtzWkl5hgayM/qrKRutllRC7D/vVXQ==, tarball: https://registry.npmjs.org/@formatjs/intl-utils/-/intl-utils-2.3.0.tgz}
     deprecated: the package is rather renamed to @formatjs/ecma-abstract with some changes in functionality (primarily selectUnit is removed and we don't plan to make any further changes to this package
 
-  '@gpustack/core-ui@1.0.40':
-    resolution: {integrity: sha512-Ahd5GcKOulaU32gX//jIZJOWEgr2W1s6jS8UtRTsxZ53UPzBoKkfUnwyWkB2WBUSjvk4lntxvoC4kDefKXbd9w==, tarball: https://registry.npmjs.org/@gpustack/core-ui/-/core-ui-1.0.40.tgz}
+  '@gpustack/core-ui@1.0.39':
+    resolution: {integrity: sha512-6NS0TDkBFHK6RipfvLwvDnLZlAoa/yFbHV+xeERAnUb+4t0mDyIQFqvYAeDgrUW/JIZ6WScrm31FDZe2sKiuaw==, tarball: https://registry.npmjs.org/@gpustack/core-ui/-/core-ui-1.0.39.tgz}
     peerDependencies:
       '@ant-design/icons': ^6.1.0
       '@ant-design/pro-components': 3.1.0-0
@@ -10802,7 +10802,7 @@ snapshots:
 
   '@formatjs/intl-utils@2.3.0': {}
 
-  '@gpustack/core-ui@1.0.40(czdvzceysqw7iv6pct2ucnb23e)':
+  '@gpustack/core-ui@1.0.39(czdvzceysqw7iv6pct2ucnb23e)':
     dependencies:
       '@ant-design/icons': 6.2.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@ant-design/pro-components': 3.1.0-0(antd@6.3.7(date-fns@2.30.0)(moment@2.30.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -16496,6 +16496,12 @@ snapshots:
       less: 4.1.3
       webpack: 5.106.2(lightningcss@1.22.1)(postcss@8.5.14)
 
+  less-loader@12.3.2(less@4.1.3)(webpack@5.106.2(lightningcss@1.22.1)(postcss@8.5.14)):
+    dependencies:
+      less: 4.1.3
+    optionalDependencies:
+      webpack: 5.106.2(lightningcss@1.22.1)(postcss@8.5.14)
+
   less-loader@12.3.2(less@4.6.4)(webpack@5.106.2(lightningcss@1.22.1)(postcss@8.5.14)):
     dependencies:
       less: 4.6.4

src/pages/_components/model-tag.tsx

@@ -60,8 +60,7 @@ const ModelTag: React.FC<ModelTagProps> = ({ categoryKey, size }) => {
         opacity: 1,
         paddingInline: 8,
         borderRadius: 12,
-        transform: 'scale(0.9)',
-        backgroundColor: 'transparent'
+        transform: 'scale(0.9)'
       }}
       color={config.color}
     >

src/pages/api-keys/hooks/use-keys-columns.tsx

@@ -6,12 +6,10 @@ import {
   AutoTooltip,
   DropdownButtons,
   IconFont,
-  icons,
-  TextAttribute,
-  ThemeTag
+  icons
 } from '@gpustack/core-ui';
 import { useIntl } from '@umijs/max';
-import { MenuProps, Tooltip } from 'antd';
+import { MenuProps, Tag, Tooltip } from 'antd';
 import { ColumnsType } from 'antd/lib/table';
 import dayjs from 'dayjs';
 import { useMemo } from 'react';
@@ -141,14 +139,23 @@ const useModelsColumns = ({
         key: 'name',
         sorter: tableSorter(1),
         render: (text: string, record: ListItem) => (
-          <span className="flex items-center gap-8">
+          <span className="flex items-center">
             <AutoTooltip ghost style={{ maxWidth: 400 }} title={text}>
               <span className="text-primary">{text}</span>
             </AutoTooltip>
             {record.is_custom && (
-              <TextAttribute>
+              <Tag
+                style={{
+                  marginLeft: 8,
+                  borderRadius: 12,
+                  color: 'var(--ant-color-text-tertiary)',
+                  borderColor: 'var(--ant-color-split)',
+                  backgroundColor: 'transparent'
+                }}
+                variant="outlined"
+              >
                 {intl.formatMessage({ id: 'playground.params.custom' })}
-              </TextAttribute>
+              </Tag>
             )}
           </span>
         )
@@ -196,13 +203,26 @@ const useModelsColumns = ({
             )}
             {(record.scope?.includes('inference') ||
               record.scope?.includes('*')) && (
-              <ThemeTag>
+              <div
+                style={{
+                  border: '1px solid var(--ant-color-split)',
+                  color: 'var(--ant-color-text-tertiary)',
+                  backgroundColor: 'var(--ant-color-fill-quaternary)',
+                  borderRadius: 4,
+                  fontSize: 13,
+                  paddingInline: 8,
+                  flexGrow: 0,
+                  maxWidth: '100%',
+                  width: 'max-content',
+                  display: 'flex'
+                }}
+              >
                 <AutoTooltip ghost>
                   {record.allowed_model_names?.length
                     ? record.allowed_model_names.join(', ')
                     : intl.formatMessage({ id: 'apikeys.models.all' })}
                 </AutoTooltip>
-              </ThemeTag>
+              </div>
             )}
           </div>
         )

src/pages/gpu-service/storage-types/hooks/use-storage-type-columns.tsx

@@ -28,13 +28,21 @@ interface ColumnsHookProps {
 const getKindLabel = (record: ListItem) => {
   if (record.spec?.nfs)
     return (
-      <ThemeTag color="cyan" icon={<FolderOutlined />}>
+      <ThemeTag
+        style={{ width: 'fit-content' }}
+        color="cyan"
+        icon={<FolderOutlined />}
+      >
         {StorageTypeKindLabelMap.nfs}
       </ThemeTag>
     );
   if (record.spec?.s3)
     return (
-      <ThemeTag color="green" icon={<IconFont type="icon-database" />}>
+      <ThemeTag
+        style={{ width: 'fit-content' }}
+        color="green"
+        icon={<IconFont type="icon-database" />}
+      >
         {StorageTypeKindLabelMap.s3}
       </ThemeTag>
     );

src/pages/llmodels/hooks/use-models-columns.tsx

@@ -268,7 +268,7 @@ const useModelsColumns = ({
         dataIndex: 'created_at',
         key: 'created_at',
         sorter: tableSorter(5),
-        width: 180,
+        span: spans.createTime,
         render: (text: number) => (
           <AutoTooltip ghost>
             {dayjs(text).format('YYYY-MM-DD HH:mm:ss')}

src/pages/usage/events-tab/index.tsx

@@ -8,11 +8,10 @@
  * tab (date range + "filter by user" for managers); the resource-type /
  * event-type selects ride in the bar's ``extra`` slot.
  */
-import { type StatusType } from '@/config/types';
-import { SimpleSelect, StatusDot } from '@gpustack/core-ui';
+import { SimpleSelect } from '@gpustack/core-ui';
 import { useAccess, useIntl } from '@umijs/max';
 import { useMemoizedFn } from 'ahooks';
-import { Input, Select, Table } from 'antd';
+import { Input, Select, Table, Tag } from 'antd';
 import dayjs from 'dayjs';
 import _ from 'lodash';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
@@ -24,11 +23,11 @@ import useQueryResourceEvents from './services/use-query-resource-events';
 // Only these four are ever emitted (see resource_event_logger): create/delete
 // + the metering-window pair. updated/attached/detached exist as enum values
 // but are intentionally not recorded, so they're not offered as filters.
-const EVENT_STATUS: Record<string, StatusType> = {
-  created: 'success',
-  deleted: 'error',
-  phase_to_metered: 'transitioning',
-  phase_left_metered: 'warning'
+const EVENT_COLOR: Record<string, string> = {
+  created: 'green',
+  deleted: 'red',
+  phase_to_metered: 'blue',
+  phase_left_metered: 'orange'
 };
 
 // Humanize a failure phase enum for display, e.g. "SSHPublicKeyCreateFailed" →
@@ -187,12 +186,7 @@ const ResourceEvents: React.FC = () => {
         dataIndex: 'event_type',
         key: 'event_type',
         render: (v: string) => (
-          <StatusDot
-            statusValue={{
-              status: EVENT_STATUS[v] ?? 'inactive',
-              text: EVENT_LABEL[v] ?? v
-            }}
-          />
+          <Tag color={EVENT_COLOR[v] ?? 'default'}>{EVENT_LABEL[v] ?? v}</Tag>
         ),
         width: 180
       },