feat(FR-1416): migrate serving page to deployment page

Author: agatha197

react/src/pages/EndpointDetailPage.tsx

@@ -43,6 +43,7 @@ import {
   WarningOutlined,
 } from '@ant-design/icons';
 import {
+  Alert,
   App,
   Button,
   Card,
@@ -506,6 +507,14 @@ const EndpointDetailPage: React.FC<EndpointDetailPageProps> = () => {
 
   return (
     <BAIFlex direction="column" align="stretch" gap="sm">
+      {baiClient.supports('deployment') && (
+        <Alert
+          message={t('serving.ServingSunsetDesc')}
+          showIcon
+          closable
+          type="warning"
+        />
+      )}
       <BAIFlex direction="row" justify="between">
         <Typography.Title level={3} style={{ margin: 0 }}>
           {endpoint?.name || ''}

react/src/pages/ServingPage.tsx

@@ -2,12 +2,16 @@ import { ServingPageQuery } from '../__generated__/ServingPageQuery.graphql';
 import BAIFetchKeyButton from '../components/BAIFetchKeyButton';
 import BAIRadioGroup from '../components/BAIRadioGroup';
 import EndpointList from '../components/EndpointList';
-import { useUpdatableState, useWebUINavigate } from '../hooks';
+import {
+  useSuspendedBackendaiClient,
+  useUpdatableState,
+  useWebUINavigate,
+} from '../hooks';
 import { useCurrentUserRole } from '../hooks/backendai';
 import { useBAIPaginationOptionStateOnSearchParam } from '../hooks/reactPaginationQueryOptions';
 import { useCurrentProjectValue } from '../hooks/useCurrentProject';
 import { useDeferredQueryParams } from '../hooks/useDeferredQueryParams';
-import { Button, Skeleton, theme } from 'antd';
+import { Alert, Button, Skeleton, theme } from 'antd';
 import {
   filterOutEmpty,
   BAIFlex,
@@ -27,6 +31,7 @@ const ServingPage: React.FC = () => {
   const currentUserRole = useCurrentUserRole();
   const webuiNavigate = useWebUINavigate();
   const currentProject = useCurrentProjectValue();
+  const baiClient = useSuspendedBackendaiClient();
 
   const [queryParams, setQuery] = useDeferredQueryParams({
     order: withDefault(StringParam, '-created_at'),
@@ -100,6 +105,14 @@ const ServingPage: React.FC = () => {
 
   return (
     <BAIFlex direction="column" align="stretch" gap={'md'}>
+      {baiClient.supports('deployment') && (
+        <Alert
+          message={t('serving.ServingSunsetDesc')}
+          showIcon
+          closable
+          type="warning"
+        />
+      )}
       <BAICard
         title={t('webui.menu.Serving')}
         extra={

resources/i18n/en.json

@@ -1499,6 +1499,9 @@
     "Variable": "Variable",
     "ViewAllHistory": "View All History"
   },
+  "serving": {
+    "ServingSunsetDesc": "This Serving page has been deprecated. For maintenance and troubleshooting, refer to the Deployment page."
+  },
   "session": {
     "Agent": "Agent",
     "AgentId": "Agent ID",