feat: add grafana link

src/pages/llmodels/components/instance-item.tsx

@@ -11,6 +11,7 @@ import { HandlerOptions } from '@/hooks/use-chunk-fetch';
 import useDownloadStream from '@/hooks/use-download-stream';
 import { useBenchmarkTargetInstance } from '@/pages/llmodels/hooks/use-run-benchmark';
 import { ListItem as WorkerListItem } from '@/pages/resources/config/types';
+import useGranfanaLink from '@/pages/resources/hooks/use-grafana-link';
 import { convertFileSize } from '@/utils';
 import {
   DeleteOutlined,
@@ -327,6 +328,12 @@ const childActionList = [
     ],
     icon: <IconFont type="icon-logs" />
   },
+  {
+    label: 'resources.metrics.details',
+    key: 'metrics',
+    status: [InstanceStatusMap.Running],
+    icon: <IconFont type="icon-metrics" />
+  },
   {
     label: 'common.button.downloadLog',
     key: 'download',
@@ -428,6 +435,7 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
   defaultOpenId,
   handleChildSelect
 }) => {
+  const { goToGrafana } = useGranfanaLink({ type: 'instance' });
   const { runBenchmarkOnInstance } = useBenchmarkTargetInstance();
   const [api, contextHolder] = notification.useNotification({
     stack: { threshold: 1 }
@@ -689,6 +697,8 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
         filename: createFileName(instanceData.name),
         downloadNotification
       });
+    } else if (val === 'metrics') {
+      goToGrafana(instanceData);
     } else {
       handleChildSelect(val, instanceData);
     }

src/pages/llmodels/components/table-list.tsx

@@ -9,7 +9,6 @@ import SealTable from '@/components/seal-table';
 import { TableOrder } from '@/components/seal-table/types';
 import { PageAction } from '@/config';
 import { TABLE_SORT_DIRECTIONS } from '@/config/settings';
-import { PageActionType } from '@/config/types';
 import useBodyScroll from '@/hooks/use-body-scroll';
 import useExpandedRowKeys from '@/hooks/use-expanded-row-keys';
 import useTableRowSelection from '@/hooks/use-table-row-selection';
@@ -18,6 +17,7 @@ import useNoResourceResult from '@/pages/llmodels/hooks/use-no-resource-result';
 import { TargetStatusValueMap } from '@/pages/model-routes/config';
 import useOpenPlayground from '@/pages/model-routes/hooks/use-open-playground';
 import useQueryTargets from '@/pages/model-routes/services/use-query-targets';
+import useGranfanaLink from '@/pages/resources/hooks/use-grafana-link';
 import { handleBatchRequest } from '@/utils';
 import { DownOutlined, SearchOutlined, SyncOutlined } from '@ant-design/icons';
 import { useIntl, useNavigate, useSearchParams } from '@umijs/max';
@@ -170,6 +170,9 @@ const Models: React.FC<ModelsProps> = ({
   useEffect(() => {
     fetchTargets({});
   }, []);
+  const { goToGrafana } = useGranfanaLink({
+    type: 'model'
+  });
 
   const [openLogModal, setOpenLogModal] = useState(false);
   const [openDeployModal, setOpenDeployModal] = useState<{
@@ -451,6 +454,9 @@ const Models: React.FC<ModelsProps> = ({
           name: targetRoute?.route_name || ''
         });
       }
+      if (val === 'metrics') {
+        goToGrafana(row);
+      }
     } catch (error) {
       // ignore
     }

src/pages/llmodels/config/button-actions.ts

@@ -39,6 +39,11 @@ export const ActionList: ActionItem[] = [
     key: 'edit',
     icon: icons.EditOutlined
   },
+  {
+    label: 'resources.metrics.details',
+    key: 'metrics',
+    icon: icons.Metrics
+  },
   {
     label: 'models.openinplayground',
     key: 'chat',

src/pages/llmodels/index.tsx

@@ -35,7 +35,6 @@ const Models: React.FC<{ clusterId?: number }> = ({ clusterId }) => {
     loadend: false,
     total: 0
   });
-
   const chunkRequedtRef = useRef<any>();
   const chunkInstanceRequedtRef = useRef<any>();
   const isPageHidden = useRef(false);