chore(litmus-portal): Add units to AddProbe modal (#2731)

* Add units to AddProbe modal * Add translation Signed-off-by: Saswata Mukherjee <saswataminsta@yahoo.com>
litmuschaos · Apr 26, 2021 · cf55467 · cf55467
1 parent 06320ee
commit cf55467
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 7 deletions.
diff --git a/litmus-portal/frontend/public/locales/en/translation.yaml b/litmus-portal/frontend/public/locales/en/translation.yaml
@@ -836,6 +836,7 @@ createWorkflow:
         contentType: Content Type
         criteria: Criteria
         responseCode: Response Code
+        responseTimeout: Response Timeout
         command: Command
         source: Source
         comparator: Comparator

diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/ProbeDetails.tsx b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/ProbeDetails.tsx
@@ -175,7 +175,10 @@ const ProbeDetails: React.FC<ProbeDetailsProps> = ({
           </div>
           <div className={classes.formField}>
             <InputLabel className={classes.formLabel} htmlFor="responseTimeout">
-              Response Timeout
+              {t(
+                'createWorkflow.tuneWorkflow.addProbe.inputLabels.responseTimeout'
+              )}
+              (ms)
             </InputLabel>
             <InputField
               variant="primary"

diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/index.tsx
@@ -209,7 +209,7 @@ const AddProbe: React.FC<AddProbeProps> = ({
           <div className={classes.detailContainer}>
             <div className={classes.formField}>
               <InputLabel className={classes.formLabel} htmlFor="timeout">
-                {t('createWorkflow.tuneWorkflow.addProbe.labels.timeout')}
+                {t('createWorkflow.tuneWorkflow.addProbe.labels.timeout')}(ms)
               </InputLabel>
               <InputField
                 variant="primary"
@@ -224,7 +224,7 @@ const AddProbe: React.FC<AddProbeProps> = ({
             </div>
             <div className={classes.formField}>
               <InputLabel className={classes.formLabel} htmlFor="retry">
-                {t('createWorkflow.tuneWorkflow.addProbe.labels.retry')}
+                {t('createWorkflow.tuneWorkflow.addProbe.labels.retry')}(times)
               </InputLabel>
               <InputField
                 variant="primary"
@@ -241,7 +241,7 @@ const AddProbe: React.FC<AddProbeProps> = ({
           <div className={classes.detailContainer}>
             <div className={classes.formField}>
               <InputLabel className={classes.formLabel} htmlFor="interval">
-                {t('createWorkflow.tuneWorkflow.addProbe.labels.interval')}
+                {t('createWorkflow.tuneWorkflow.addProbe.labels.interval')}(ms)
               </InputLabel>
               <InputField
                 variant="primary"
@@ -256,7 +256,7 @@ const AddProbe: React.FC<AddProbeProps> = ({
             </div>
             <div className={classes.formField}>
               <InputLabel className={classes.formLabel} htmlFor="polling">
-                {t('createWorkflow.tuneWorkflow.addProbe.labels.polling')}
+                {t('createWorkflow.tuneWorkflow.addProbe.labels.polling')}(ms)
               </InputLabel>
               <InputField
                 variant="primary"
@@ -272,6 +272,7 @@ const AddProbe: React.FC<AddProbeProps> = ({
           <div className={classes.formField}>
             <InputLabel className={classes.formLabel} htmlFor="initial-delay">
               {t('createWorkflow.tuneWorkflow.addProbe.labels.initialDelay')}
+              (ms)
             </InputLabel>
             <InputField
               variant="primary"

diff --git a/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/styles.ts b/litmus-portal/frontend/src/views/CreateWorkflow/TuneWorkflow/AddProbe/styles.ts
@@ -16,7 +16,7 @@ const useStyles = makeStyles((theme) => ({
   detailContainer: {
     display: 'flex',
     gap: '1rem',
-    width: '90%',
+    width: '100%',
   },
   form: {
     alignItems: 'left',
@@ -25,7 +25,7 @@ const useStyles = makeStyles((theme) => ({
     gap: '0.5rem',
     justifyContent: 'space-evenly',
     marginTop: theme.spacing(2),
-    width: '80%',
+    width: '90%',
   },
   formField: {
     alignItems: 'center',