diff --git a/managed/ui/src/redesign/features/universe/universe-form/form/fields/ConnectionPoolingField/ConnectionPoolingField.tsx b/managed/ui/src/redesign/features/universe/universe-form/form/fields/ConnectionPoolingField/ConnectionPoolingField.tsx index a0dd704f0cb1..fdcb09b5e30d 100644 --- a/managed/ui/src/redesign/features/universe/universe-form/form/fields/ConnectionPoolingField/ConnectionPoolingField.tsx +++ b/managed/ui/src/redesign/features/universe/universe-form/form/fields/ConnectionPoolingField/ConnectionPoolingField.tsx @@ -2,7 +2,7 @@ import { FC } from 'react'; import { useUpdateEffect } from 'react-use'; import { useTranslation } from 'react-i18next'; import { useFormContext, useWatch } from 'react-hook-form'; -import { Box } from '@material-ui/core'; +import { Box, makeStyles, Typography } from '@material-ui/core'; import { YBToggleField, YBLabel, YBTooltip, YBEarlyAccessTag } from '../../../../../../components'; import { isVersionConnectionPoolSupported } from '../../../utils/helpers'; import { UniverseFormData } from '../../../utils/dto'; @@ -18,9 +18,19 @@ interface ConnectionPoolFieldProps { disabled: boolean; } +const useStyles = makeStyles((theme) => ({ + subText: { + fontSize: '11.5px', + lineHeight: '16px', + fontWeight: 400, + color: '#67666C' + } +})); + export const ConnectionPoolingField: FC = ({ disabled }) => { const { control, setValue } = useFormContext(); const { t } = useTranslation(); + const classes = useStyles(); //watchers const isYSQLEnabled = useWatch({ name: YSQL_FIELD }); @@ -43,11 +53,13 @@ export const ConnectionPoolingField: FC = ({ disabled + {isYSQLEnabled + ? isConnectionPoolSupported + ? '' + : t('universeForm.advancedConfig.conPoolVersionTooltip') + : t('universeForm.advancedConfig.conPoolYSQLWarn')} + } >
@@ -57,7 +69,7 @@ export const ConnectionPoolingField: FC = ({ disabled 'data-testid': 'PGCompatibiltyField-Toggle' }} control={control} - disabled={disabled || !isYSQLEnabled} + disabled={disabled || !isYSQLEnabled || !isConnectionPoolSupported} />
diff --git a/managed/ui/src/translations/en.json b/managed/ui/src/translations/en.json index 414266f11552..54caf99e926c 100644 --- a/managed/ui/src/translations/en.json +++ b/managed/ui/src/translations/en.json @@ -333,6 +333,7 @@ "pgTooltip": "Access to enhanced Postgres compatible features is only available for database version 2024.2 or later. <1>Learn more", "enableConnectionPooling": "Enable Connection Pooling", "conPoolTooltip": "Use built-in YSQL service for maximizing the number of simultaneous connections to your database", + "conPoolVersionTooltip": "Built-in connection pooling is only available for database version 2024.2 or later.", "conPoolYSQLWarn": "Enable YSQL first to use connection pooling.", "conPoolDBVersionWarn": "Built-in connection pooling is only available for database version 2024.2 or later", "dbRPCPortTooltip": "Port for connecting to your application clients.",