add connection tip on connection page

Signed-off-by: ryjiang <jiangruiyi@gmail.com>

client/src/i18n/cn/common.ts

@@ -15,6 +15,7 @@ const commonTrans = {
     prometheusAddress: 'Prometheus地址',
     prometheusInstance: 'Prometheus实例',
     prometheusNamespace: 'Prometheus命名空间',
+    connectionTip: '支持自托管Milvus或Zilliz云专用集群。',
   },
   status: {
     loaded: '已加载',

client/src/i18n/en/common.ts

@@ -15,6 +15,8 @@ const commonTrans = {
     prometheusAddress: 'Prometheus Address',
     prometheusInstance: 'Prometheus Instance',
     prometheusNamespace: 'Prometheus Namespace',
+    connectionTip:
+      'Self-hosted Milvus or Zilliz Cloud Dedicated cluster are supported.',
   },
   status: {
     loaded: 'loaded',

client/src/pages/connect/AuthForm.tsx

@@ -9,6 +9,8 @@ import { useNavigate } from 'react-router-dom';
 import { rootContext, authContext, dataContext } from '@/context';
 import { MILVUS_CLIENT_ID } from '@/consts';
 import { CustomRadio } from '@/components/customRadio/CustomRadio';
+import Icons from '@/components/icons/Icons';
+import CustomToolTip from '@/components/customToolTip/CustomToolTip';
 
 const useStyles = makeStyles((theme: Theme) => ({
   wrapper: {
@@ -22,6 +24,10 @@ const useStyles = makeStyles((theme: Theme) => ({
     textAlign: 'left',
     alignSelf: 'flex-start',
     padding: theme.spacing(3, 0),
+    '& svg': {
+      fontSize: 15,
+      marginLeft: theme.spacing(0.5),
+    },
   },
   input: {
     margin: theme.spacing(0.5, 0, 0),
@@ -183,6 +189,9 @@ export const AuthForm = (props: any) => {
         <div className={classes.titleWrapper}>
           <Typography variant="h4" component="h4">
             {attuTrans.connectTitle}
+            <CustomToolTip title={attuTrans.connectionTip}>
+              <Icons.info />
+            </CustomToolTip>
           </Typography>
         </div>
         {/* address  */}