Browse Source

Disabled negative values. (#1312)

* Disabled negative values.

* Used hook-form property instead of Object method.
NelyDavtyan 3 năm trước cách đây
mục cha
commit
25d987eb62

+ 14 - 7
kafka-ui-react-app/src/components/ConsumerGroups/Details/ResetOffsets/ResetOffsets.tsx

@@ -67,6 +67,7 @@ const ResetOffsets: React.FC = () => {
   );
 
   const methods = useForm<FormType>({
+    mode: 'onChange',
     defaultValues: {
       resetType: ConsumerGroupOffsetsResetType.EARLIEST,
       topic: '',
@@ -80,7 +81,7 @@ const ResetOffsets: React.FC = () => {
     control,
     setError,
     clearErrors,
-    formState: { errors },
+    formState: { errors, isValid },
   } = methods;
   const { fields } = useFieldArray({
     control,
@@ -127,7 +128,7 @@ const ResetOffsets: React.FC = () => {
         partition: number;
       }[],
     };
-    let isValid = true;
+    let isValidAugmentedData = true;
     if (augmentedData.resetType === ConsumerGroupOffsetsResetType.OFFSET) {
       augmentedData.partitionsOffsets.forEach((offset, index) => {
         if (!offset.offset) {
@@ -135,7 +136,7 @@ const ResetOffsets: React.FC = () => {
             type: 'manual',
             message: "This field shouldn't be empty!",
           });
-          isValid = false;
+          isValidAugmentedData = false;
         }
       });
     } else if (
@@ -146,10 +147,10 @@ const ResetOffsets: React.FC = () => {
           type: 'manual',
           message: "This field shouldn't be empty!",
         });
-        isValid = false;
+        isValidAugmentedData = false;
       }
     }
-    if (isValid) {
+    if (isValidAugmentedData) {
       dispatch(
         resetConsumerGroupOffsets({
           clusterName,
@@ -258,7 +259,13 @@ const ResetOffsets: React.FC = () => {
                         id={`partitionsOffsets.${index}.offset`}
                         type="number"
                         name={`partitionsOffsets.${index}.offset` as const}
-                        hookFormOptions={{ shouldUnregister: true }}
+                        hookFormOptions={{
+                          shouldUnregister: true,
+                          min: {
+                            value: 0,
+                            message: 'must be greater than or equal to 0',
+                          },
+                        }}
                         defaultValue={field.offset}
                       />
                       <ErrorMessage
@@ -277,7 +284,7 @@ const ResetOffsets: React.FC = () => {
             buttonSize="M"
             buttonType="primary"
             type="submit"
-            disabled={selectedPartitions.length === 0}
+            disabled={!isValid || selectedPartitions.length === 0}
           >
             Submit
           </Button>