From 019ffa5deecf9b52581d73b5438509e3a9657b9b Mon Sep 17 00:00:00 2001
From: Zalenski Egor <63463140+zalenskiSofteq@users.noreply.github.com>
Date: Tue, 24 May 2022 10:06:00 +0400
Subject: [PATCH] #RI-2967 - Max-len and slower-than fields should be filled by
 default values when user saves empty lines

---
 .../ui/src/constants/durationUnits.tsx        |  2 +-
 .../SlowLogConfig/SlowLogConfig.tsx           | 22 +++++++++++++++----
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/redisinsight/ui/src/constants/durationUnits.tsx b/redisinsight/ui/src/constants/durationUnits.tsx
index f88e96a8a1..924fee3c24 100644
--- a/redisinsight/ui/src/constants/durationUnits.tsx
+++ b/redisinsight/ui/src/constants/durationUnits.tsx
@@ -18,7 +18,7 @@ export const DURATION_UNITS: EuiSuperSelectOption<DurationUnits>[] = [
 
 export const MINUS_ONE = -1
 export const DEFAULT_SLOWLOG_MAX_LEN = 128
-export const DEFAULT_SLOWLOG_SLOWER_THAN = 10000
+export const DEFAULT_SLOWLOG_SLOWER_THAN = 10_000
 export const DEFAULT_SLOWLOG_DURATION_UNIT = DurationUnits.microSeconds
 
 export default DURATION_UNITS
diff --git a/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx b/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx
index 1481c2ee40..474656a966 100644
--- a/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx
+++ b/redisinsight/ui/src/pages/slowLog/components/SlowLogConfig/SlowLogConfig.tsx
@@ -70,6 +70,12 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
   }
 
   const calculateSlowlogLogSlowerThan = (initSlowerThan: string) => {
+    if (initSlowerThan === '') {
+      return DEFAULT_SLOWLOG_SLOWER_THAN
+    }
+    if (initSlowerThan === `${MINUS_ONE}`) {
+      return MINUS_ONE
+    }
     if (initSlowerThan === `${MINUS_ONE}`) {
       return MINUS_ONE
     }
@@ -81,7 +87,7 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
     dispatch(patchSlowLogConfigAction(
       instanceId,
       {
-        slowlogMaxLen: +maxLen,
+        slowlogMaxLen: maxLen ? toNumber(maxLen) : DEFAULT_SLOWLOG_MAX_LEN,
         slowlogLogSlowerThan,
       },
       durationUnit,
@@ -96,7 +102,7 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
     closePopover()
   }
 
-  const disabledApplyBtn = () => errorValidateNegativeInteger(`${slowerThan}`) || loading
+  const disabledApplyBtn = () => (errorValidateNegativeInteger(`${slowerThan}`) && !!slowerThan) || loading
 
   const clusterContent = () => (
     <>
@@ -124,6 +130,14 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
   )
 
   const unitConverter = () => {
+    if (Number.isNaN(toNumber(slowerThan))) {
+      return `- ${DurationUnits.milliSeconds}`
+    }
+
+    if (slowerThan === `${MINUS_ONE}`) {
+      return `-1 ${DurationUnits.milliSeconds}`
+    }
+
     if (durationUnit === DurationUnits.microSeconds) {
       const value = numberWithSpaces(convertNumberByUnits(toNumber(slowerThan), DurationUnits.milliSeconds))
       return `${value} ${DurationUnits.milliSeconds}`
@@ -150,11 +164,11 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
                   name="slowerThan"
                   id="slowerThan"
                   className={styles.input}
-                  placeholder={`${slowlogLogSlowerThan}`}
                   value={slowerThan}
                   onChange={(e: ChangeEvent<HTMLInputElement>) => {
                     setSlowerThan(validateNumber(e.target.value.trim(), Infinity, -1))
                   }}
+                  placeholder={`${convertNumberByUnits(DEFAULT_SLOWLOG_SLOWER_THAN, durationUnit)}`}
                   autoComplete="off"
                   data-testid="slower-than-input"
                 />
@@ -184,7 +198,7 @@ const SlowLogConfig = ({ closePopover, onRefresh }: Props) => {
                   name="maxLen"
                   id="maxLen"
                   className={styles.input}
-                  placeholder={`${slowlogMaxLen}`}
+                  placeholder={`${DEFAULT_SLOWLOG_MAX_LEN}`}
                   value={maxLen}
                   onChange={(e: ChangeEvent<HTMLInputElement>) => { setMaxLen(validateNumber(e.target.value.trim())) }}
                   autoComplete="off"