fix(FR-2494): address code review findings across auto-scaling rule stack

Author: agatha197

react/src/components/AutoScalingRuleEditorModal.tsx

@@ -309,6 +309,14 @@ const AutoScalingRuleEditorModal: React.FC<AutoScalingRuleEditorModalProps> = ({
     `);
 
   const handleOk = () => {
+    // Manual validation for Prometheus preset (Form.Item has no name, so
+    // Ant Design form validation does not cover it automatically)
+    const currentMetricSource = formRef.current?.getFieldValue('metricSource');
+    if (currentMetricSource === 'PROMETHEUS' && !selectedPresetId) {
+      message.error(t('autoScalingRule.PrometheusPresetRequired'));
+      return;
+    }
+
     return formRef.current
       ?.validateFields()
       .then((values) => {
@@ -512,12 +520,18 @@ const AutoScalingRuleEditorModal: React.FC<AutoScalingRuleEditorModalProps> = ({
               }
             }}
             options={[
-              { label: 'Kernel', value: 'KERNEL' },
               {
-                label: 'Inference Framework',
+                label: t('autoScalingRule.MetricSourceKernel'),
+                value: 'KERNEL',
+              },
+              {
+                label: t('autoScalingRule.MetricSourceInferenceFramework'),
                 value: 'INFERENCE_FRAMEWORK',
               },
-              { label: 'Prometheus', value: 'PROMETHEUS' },
+              {
+                label: t('autoScalingRule.MetricSourcePrometheus'),
+                value: 'PROMETHEUS',
+              },
             ]}
           />
         </Form.Item>
@@ -606,19 +620,17 @@ const AutoScalingRuleEditorModal: React.FC<AutoScalingRuleEditorModalProps> = ({
               <Form.Item
                 label={t('autoScalingRule.QueryTemplate')}
                 extra={
-                  selectedPresetId ? (
-                    <ErrorBoundaryWithNullFallback>
-                      <React.Suspense
-                        fallback={
-                          <Spin size="small" style={{ marginRight: 8 }} />
-                        }
-                      >
-                        <PrometheusPresetPreview
-                          presetGlobalId={selectedPresetId}
-                        />
-                      </React.Suspense>
-                    </ErrorBoundaryWithNullFallback>
-                  ) : undefined
+                  <ErrorBoundaryWithNullFallback>
+                    <React.Suspense
+                      fallback={
+                        <Spin size="small" style={{ marginRight: 8 }} />
+                      }
+                    >
+                      <PrometheusPresetPreview
+                        presetGlobalId={selectedPreset.id}
+                      />
+                    </React.Suspense>
+                  </ErrorBoundaryWithNullFallback>
                 }
               >
                 <Typography.Text

react/src/components/AutoScalingRuleEditorModalLegacy.tsx

@@ -50,7 +50,7 @@ type AutoScalingRuleInput = {
   max_replicas: number;
 };
 
-export const COMPARATOR_LABELS: Record<string, string> = {
+export const COMPARATOR_LABELS: Record<'LESS_THAN' | 'GREATER_THAN', string> = {
   LESS_THAN: '<',
   GREATER_THAN: '>',
 };

react/src/components/AutoScalingRuleList.tsx

@@ -207,7 +207,7 @@ const AutoScalingRuleList: React.FC<AutoScalingRuleListProps> = ({
           <Button
             type="primary"
             icon={<PlusOutlined />}
-            disabled={isEndpointDestroying}
+            disabled={isEndpointDestroying || !isOwnedByCurrentUser}
             onClick={() => {
               setEditingRuleId(null);
               setIsOpenEditorModal(true);
@@ -225,9 +225,11 @@ const AutoScalingRuleList: React.FC<AutoScalingRuleListProps> = ({
               title: t('autoScalingRule.ScalingType'),
               fixed: 'left',
               render: (_text, row) =>
-                (row?.stepSize || 0) > 0
-                  ? t('autoScalingRule.ScaleOut')
-                  : t('autoScalingRule.ScaleIn'),
+                row?.stepSize
+                  ? row.stepSize > 0
+                    ? t('autoScalingRule.ScaleOut')
+                    : t('autoScalingRule.ScaleIn')
+                  : '-',
             },
             {
               title: t('autoScalingRule.MetricSource'),
@@ -318,9 +320,10 @@ const AutoScalingRuleList: React.FC<AutoScalingRuleListProps> = ({
                 </span>
               ),
               sorter: (a, b) => {
-                const date1 = dayjs(a.createdAt);
-                const date2 = dayjs(b.createdAt);
-                return date1.diff(date2);
+                if (!a.lastTriggeredAt && !b.lastTriggeredAt) return 0;
+                if (!a.lastTriggeredAt) return -1;
+                if (!b.lastTriggeredAt) return 1;
+                return dayjs(a.lastTriggeredAt).diff(dayjs(b.lastTriggeredAt));
               },
             },
             {
@@ -355,7 +358,11 @@ const AutoScalingRuleList: React.FC<AutoScalingRuleListProps> = ({
                     okButtonProps={{
                       danger: true,
                     }}
-                    disabled={isInFlightDeleteMutation}
+                    disabled={
+                      isInFlightDeleteMutation ||
+                      isEndpointDestroying ||
+                      !isOwnedByCurrentUser
+                    }
                     onConfirm={() => {
                       if (row) {
                         commitDeleteMutation({
@@ -435,7 +442,6 @@ const AutoScalingRuleList: React.FC<AutoScalingRuleListProps> = ({
             handleRefetch();
           }
         }}
-        onComplete={handleRefetch}
       />
     </>
   );

react/src/components/AutoScalingRuleListLegacy.tsx

@@ -65,7 +65,7 @@ const renderCondition = (row: any) => {
       <BAIFlex gap={'xs'}>
         {threshold}
         {suffix}
-        {comparator ? <Tooltip title={comparator}>{'<'}</Tooltip> : '-'}
+        <Tooltip title={comparator}>{'<'}</Tooltip>
         <Tag>{metricName}</Tag>
       </BAIFlex>
     );
@@ -77,7 +77,8 @@ const renderCondition = (row: any) => {
       <Tag>{metricName}</Tag>
       {comparator ? (
         <Tooltip title={comparator}>
-          {COMPARATOR_LABELS[comparator] || comparator}
+          {COMPARATOR_LABELS[comparator as keyof typeof COMPARATOR_LABELS] ||
+            comparator}
         </Tooltip>
       ) : (
         '-'

resources/i18n/en.json

@@ -167,6 +167,9 @@
     "MaxThresholdRequired": "Max threshold is required.",
     "MetricName": "Metric Name",
     "MetricSource": "Metric Source",
+    "MetricSourceInferenceFramework": "Inference Framework",
+    "MetricSourceKernel": "Kernel",
+    "MetricSourcePrometheus": "Prometheus",
     "MinMustBeLessThanMax": "Min threshold must be less than max threshold.",
     "MinReplicas": "Min Replicas",
     "MinThreshold": "Min Threshold",
@@ -185,7 +188,7 @@
     "Single": "Single",
     "StepSize": "Step Size",
     "SuccessfullyCreated": "Auto scaling rule has been successfully created.",
-    "SuccessfullyDeleted": "Auto scaling rule has been successfuly deleted.",
+    "SuccessfullyDeleted": "Auto scaling rule has been successfully deleted.",
     "SuccessfullyUpdated": "Auto scaling rule has been successfully updated.",
     "Threshold": "Threshold",
     "ThresholdMustBePositive": "Threshold must be a positive number.",