feat: autoscaler profiles

.env

@@ -77,3 +77,4 @@ COMMAND_BAR_REFETCH_INTERVAL=3600
 FEATURE_STORAGE_ENABLE=false
 FEATURE_ATHENA_DEBUG_MODE_ENABLE=false
 GRAFANA_ORG_ID=2
+FEATURE_NODE_AUTOSCALER_ENABLE=false

package.json

@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "4.0.4",
+        "@devtron-labs/devtron-fe-common-lib": "4.0.5",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@sentry/browser": "7.119.1",
         "@sentry/integrations": "7.50.0",

src/Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterForm/ClusterConfigurations.tsx

@@ -27,6 +27,7 @@
 
 const RemoteConnectionRadio = importComponentFromFELibrary('RemoteConnectionRadio', null, 'function')
 const AssignCategorySelect = importComponentFromFELibrary('AssignCategorySelect', null, 'function')
+const AutoscalerProfileSelect = importComponentFromFELibrary('AutoscalerProfileSelect', null, 'function')
 
 const ClusterConfigurations = ({
     id,
@@ -45,6 +46,8 @@
     initialIsTlsConnection,
     getIsConnectProtocolConfigInvalid,
     getIsTLSConfigInvalid,
+    autoscalerProfile,
+    setAutoscalerProfile,
 }: ClusterConfigurationsProps) => {
     const [clusterConfigPage, setClusterConfigPage] = useState<ClusterConfigPages>(ClusterConfigPages.BASIC_CONFIG)
 
@@ -302,14 +305,24 @@
                     </RadioGroup>
                 </div>
 
-                {AssignCategorySelect && (
-                    <div className="w-250">
-                        <AssignCategorySelect
-                            selectedCategory={selectedCategory}
-                            setSelectedCategory={setSelectedCategory}
-                        />
-                    </div>
-                )}
+                <div className="flex left dc__gap-12">
+                    {AssignCategorySelect && (
+                        <div className="w-250">
+                            <AssignCategorySelect
+                                selectedCategory={selectedCategory}
+                                setSelectedCategory={setSelectedCategory}
+                            />
+                        </div>
+                    )}
+                    {window._env_.FEATURE_NODE_AUTOSCALER_ENABLE && AutoscalerProfileSelect && (
+                        <div className="w-250">
+                            <AutoscalerProfileSelect
+                                autoscalerProfile={autoscalerProfile}
+                                setAutoscalerProfile={setAutoscalerProfile}
+                            />
+                        </div>
+                    )}
+                </div>
             </div>
             {id !== DEFAULT_CLUSTER_ID && (
                 <div className="flexbox-col dc__gap-12">

src/Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterForm/ClusterForm.tsx

@@ -38,6 +38,7 @@
     ToastManager,
     ToastVariantType,
     useAsync,
+    useQuery,
 } from '@devtron-labs/devtron-fe-common-lib'
 
 import { getModuleInfo } from '@Components/v2/devtronStackManager/DevtronStackManager.service'
@@ -62,6 +63,8 @@
 const getRemoteConnectionConfig = importComponentFromFELibrary('getRemoteConnectionConfig', noop, 'function')
 const getCategoryPayload = importComponentFromFELibrary('getCategoryPayload', null, 'function')
 const ClusterCostConfig = importComponentFromFELibrary('ClusterCostConfig', null, 'function')
+const attachProfileToCluster = importComponentFromFELibrary('attachProfileToCluster', null, 'function')
+const getProfileAttachedToCluster = importComponentFromFELibrary('getProfileAttachedToCluster', null, 'function')
 
 const ClusterForm = ({
     id = null,
@@ -126,6 +129,19 @@
     const [isUpdating, setIsUpdating] = useState<boolean>(false)
     const [isConnectedViaProxyTemp, setIsConnectedViaProxyTemp] = useState(!!proxyUrl)
     const [isConnectedViaSSHTunnelTemp, setIsConnectedViaSSHTunnelTemp] = useState(isConnectedViaSSHTunnel)
+    const [autoscalerProfile, setAutoscalerProfile] = useState<SelectPickerOptionType<number>>(null)
+
+    const { data: profileData } = useQuery({
+        queryKey: ['getProfileAttachedToCluster', clusterName],
+        queryFn: () => getProfileAttachedToCluster(clusterName),
+        enabled: !!clusterName && window._env_.FEATURE_NODE_AUTOSCALER_ENABLE && !!getProfileAttachedToCluster,
+    })
+
+    useEffect(() => {
+        if (profileData) {
+            setAutoscalerProfile(profileData)
+        }
+    }, [profileData])
 
     const isPrometheusEnabled = costModuleState.enabled || isAppMetricsEnabled
 
@@ -322,6 +338,9 @@
         try {
             setIsUpdating(true)
             await api(payload)
+            if (window._env_.FEATURE_NODE_AUTOSCALER_ENABLE && attachProfileToCluster) {
+                attachProfileToCluster(autoscalerProfile?.value, payload.cluster_name)
+            }
             ToastManager.showToast({
                 variant: ToastVariantType.success,
                 description: `Successfully ${id ? 'updated' : 'saved'}`,
@@ -541,6 +560,8 @@
                             initialIsTlsConnection={initialIsTlsConnection}
                             getIsConnectProtocolConfigInvalid={getIsConnectProtocolConfigInvalid}
                             getIsTLSConfigInvalid={getIsTLSConfigInvalid}
+                            autoscalerProfile={autoscalerProfile}
+                            setAutoscalerProfile={setAutoscalerProfile}
                         />
                     </div>
                 )

src/Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterForm/types.ts

@@ -31,6 +31,8 @@ export interface ClusterConfigurationsProps {
     initialIsTlsConnection: boolean
     getIsConnectProtocolConfigInvalid: () => boolean
     getIsTLSConfigInvalid: () => boolean
+    autoscalerProfile: SelectPickerOptionType<number>
+    setAutoscalerProfile: Dispatch<SetStateAction<SelectPickerOptionType<number>>>
 }
 
 export interface KubeConfigEditorProps {

src/Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterList.components.tsx

@@ -20,6 +20,7 @@ import { generatePath, Link, useLocation, useNavigate, useParams } from 'react-r
 import {
     ActionMenu,
     ActionMenuItemType,
+    Badge,
     Button,
     ButtonStyleType,
     ButtonVariantType,
@@ -203,7 +204,17 @@ export const ClusterListCellComponent: FunctionComponent<
 > = ({
     field,
     row: {
-        data: { clusterId, clusterName, clusterType, envCount, serverUrl, clusterCategory, isVirtualCluster, status },
+        data: {
+            clusterId,
+            clusterName,
+            clusterType,
+            envCount,
+            serverUrl,
+            clusterCategory,
+            isVirtualCluster,
+            status,
+            autoscalerProfile,
+        },
     },
     isRowActive,
     signals,
@@ -250,6 +261,18 @@ export const ClusterListCellComponent: FunctionComponent<
             )
         case ClusterListFields.CLUSTER_TYPE:
             return <span className="flex left py-10">{clusterType}</span>
+        case ClusterListFields.AUTOSCALER_PROFILE:
+            return autoscalerProfile ? (
+                <div className="flex left py-10">
+                    <Badge
+                        variant="custom"
+                        fontColor="V500"
+                        bgColor="V200"
+                        label={autoscalerProfile}
+                        size={ComponentSizeType.xxs}
+                    />
+                </div>
+            ) : null
         case ClusterListFields.ENV_COUNT:
             return <span className="flex left py-10">{envCount ? `${envCount}` : 'No'} Environments</span>
         case ClusterListFields.CLUSTER_CATEGORY:

src/Pages/GlobalConfigurations/ClustersAndEnvironments/ClusterList.tsx

@@ -48,6 +48,7 @@
     TableColumnType,
     useAsync,
     useMainContext,
+    useQuery,
     useUrlFilters,
 } from '@devtron-labs/devtron-fe-common-lib'
 
@@ -84,6 +85,7 @@
 const ManageCategoryButton = importComponentFromFELibrary('ManageCategoryButton', null, 'function')
 const PodSpreadModal = importComponentFromFELibrary('PodSpreadModal', null, 'function')
 const HibernationRulesModal = importComponentFromFELibrary('HibernationRulesModal', null, 'function')
+const getClusterAutoscalerProfileMap = importComponentFromFELibrary('getClusterAutoscalerProfileMap', null, 'function')
 
 const ClusterList = () => {
     const { isSuperAdmin } = useMainContext()
@@ -118,6 +120,12 @@
         isSuperAdmin && !isK8sClient,
     )
 
+    const { data: clusterNameVsAutoscalerProfile, refetch: refetchProfileMap } = useQuery({
+        queryKey: ['clusterNameVsAutoscalerProfile'],
+        queryFn: getClusterAutoscalerProfileMap,
+        enabled: !!getClusterAutoscalerProfileMap && !!window._env_.FEATURE_NODE_AUTOSCALER_ENABLE,
+    })
+
     const [showUnmappedEnvs, setShowUnmappedEnvs] = useState(false)
 
     const clusterCount = clusterListResult?.length ?? 0
@@ -169,7 +177,7 @@
                 {
                     field: ClusterListFields.CLUSTER_NAME,
                     label: 'CLUSTER',
-                    size: { fixed: 200 },
+                    size: { fixed: 180 },
                     isSortable: true,
                     comparator: stringComparatorBySortOrder,
                     CellComponent: ClusterListCellComponent,
@@ -180,7 +188,7 @@
                           {
                               field: ClusterListFields.ENV_COUNT,
                               label: 'ENVIRONMENTS',
-                              size: { fixed: 150 },
+                              size: { fixed: 120 },
                               isSortable: true,
                               comparator: numberComparatorBySortOrder,
                               CellComponent: ClusterListCellComponent,
@@ -199,13 +207,23 @@
                           {
                               field: ClusterListFields.CLUSTER_CATEGORY,
                               label: 'CATEGORY',
-                              size: { fixed: 150 },
+                              size: { fixed: 100 },
                               isSortable: true,
                               comparator: stringComparatorBySortOrder,
                               CellComponent: ClusterListCellComponent,
                           } as TableColumnType<ClusterRowData, FiltersTypeEnum.STATE, {}>,
                       ]
                     : []),
+                ...(window._env_.FEATURE_NODE_AUTOSCALER_ENABLE && getClusterAutoscalerProfileMap
+                    ? [
+                          {
+                              field: ClusterListFields.AUTOSCALER_PROFILE,
+                              label: 'AUTOSCALER PROFILE',
+                              size: { fixed: 140 },
+                              CellComponent: ClusterListCellComponent,
+                          },
+                      ]
+                    : []),
                 {
                     field: ClusterListFields.SERVER_URL,
                     label: 'SERVER URL',
@@ -233,6 +251,7 @@
                             clusterCategory: (category?.label as string) ?? '',
                             isVirtualCluster,
                             status,
+                            autoscalerProfile: clusterNameVsAutoscalerProfile?.[clusterName] ?? null,
                         },
                     }
                 },
@@ -293,6 +312,11 @@
         })
     }
 
+    const handleCloseEditClusterModal = async () => {
+        await refetchProfileMap()
+        handleRedirectToClusterList()
+    }
+
     const renderList = () => {
         if (isClusterEnvListLoading) {
             return <ClusterEnvLoader />
@@ -479,7 +503,7 @@
                             <EditCluster
                                 clusterList={clusterListResult ?? []}
                                 reloadClusterList={reloadClusterList}
-                                handleClose={handleRedirectToClusterList}
+                                handleClose={handleCloseEditClusterModal}
                             />
                         }
                     />

src/Pages/GlobalConfigurations/ClustersAndEnvironments/cluster.type.ts

@@ -242,6 +242,7 @@ export interface ClusterRowData
     envCount: number
     clusterType: string
     clusterCategory: string
+    autoscalerProfile: string
 }
 
 export enum ClusterEnvTabs {
@@ -267,6 +268,7 @@ export enum ClusterListFields {
     CLUSTER_TYPE = 'clusterType',
     ENV_COUNT = 'envCount',
     CLUSTER_CATEGORY = 'clusterCategory',
+    AUTOSCALER_PROFILE = 'autoscalerProfile',
     SERVER_URL = 'serverUrl',
     ACTIONS = 'actions',
 }