fix(jobs): small improvments in the creation flow

libs/pages/application/src/lib/feature/page-settings-configure-job-feature/page-settings-configure-job-feature.tsx

@@ -11,7 +11,7 @@ import PageSettingsConfigureJob from '../../ui/page-settings-configure-job/page-
 
 export function PageSettingsConfigureJobFeature() {
   const { applicationId = '', environmentId = '' } = useParams()
-  const methods = useForm<JobConfigureData>()
+  const methods = useForm<JobConfigureData>({ mode: 'onChange' })
 
   const application: JobApplicationEntity | undefined = useSelector<RootState, ApplicationEntity | undefined>(
     (state) => selectApplicationById(state, applicationId),
@@ -44,15 +44,21 @@ export function PageSettingsConfigureJobFeature() {
         methods.setValue('image_entry_point', application.schedule?.cronjob?.entrypoint || undefined)
       } else {
         methods.setValue('on_start.enabled', !!application.schedule?.on_start)
-        methods.setValue('on_start.arguments_string', JSON.stringify(application.schedule?.on_start?.arguments))
+        if (application.schedule?.on_start?.arguments && application.schedule?.on_start?.arguments.length > 0) {
+          methods.setValue('on_start.arguments_string', JSON.stringify(application.schedule.on_start.arguments))
+        }
         methods.setValue('on_start.entrypoint', application.schedule?.on_start?.entrypoint)
 
         methods.setValue('on_stop.enabled', !!application.schedule?.on_stop)
-        methods.setValue('on_stop.arguments_string', JSON.stringify(application.schedule?.on_stop?.arguments))
+        if (application.schedule?.on_stop?.arguments && application.schedule?.on_stop?.arguments.length > 0) {
+          methods.setValue('on_stop.arguments_string', JSON.stringify(application.schedule?.on_stop?.arguments))
+        }
         methods.setValue('on_stop.entrypoint', application.schedule?.on_stop?.entrypoint)
 
         methods.setValue('on_delete.enabled', !!application.schedule?.on_delete)
-        methods.setValue('on_delete.arguments_string', JSON.stringify(application.schedule?.on_delete?.arguments))
+        if (application.schedule?.on_delete?.arguments && application.schedule?.on_delete?.arguments.length > 0) {
+          methods.setValue('on_delete.arguments_string', JSON.stringify(application.schedule?.on_delete?.arguments))
+        }
         methods.setValue('on_delete.entrypoint', application.schedule?.on_delete?.entrypoint)
       }
     }
@@ -80,6 +86,8 @@ export function PageSettingsConfigureJobFeature() {
             toastError(e, 'Invalid CMD array')
             return
           }
+        } else {
+          schedule.cronjob.arguments = undefined
         }
         schedule.cronjob.entrypoint = data.image_entry_point
       }
@@ -91,45 +99,48 @@ export function PageSettingsConfigureJobFeature() {
       if (data.on_start?.enabled) {
         schedule.on_start = {
           entrypoint: data.on_start.entrypoint,
+          arguments: undefined,
         }
 
-        try {
-          if (data.on_start?.arguments_string) {
+        if (data.on_start?.arguments_string && data.on_start?.arguments_string.length > 0) {
+          try {
             schedule.on_start.arguments = eval(data.on_start.arguments_string)
+          } catch (e: any) {
+            toastError(e, 'Invalid CMD array')
+            return
           }
-        } catch (e: any) {
-          toastError(e, 'Invalid CMD array')
-          return
         }
       }
 
       if (data.on_stop?.enabled) {
         schedule.on_stop = {
           entrypoint: data.on_stop.entrypoint,
+          arguments: undefined,
         }
 
-        try {
-          if (data.on_stop?.arguments_string) {
+        if (data.on_stop?.arguments_string && data.on_stop?.arguments_string.length > 0) {
+          try {
             schedule.on_stop.arguments = eval(data.on_stop.arguments_string)
+          } catch (e: any) {
+            toastError(e, 'Invalid CMD array')
+            return
           }
-        } catch (e: any) {
-          toastError(e, 'Invalid CMD array')
-          return
         }
       }
 
       if (data.on_delete?.enabled) {
         schedule.on_delete = {
           entrypoint: data.on_delete.entrypoint,
+          arguments: undefined,
         }
 
-        try {
-          if (data.on_delete?.arguments_string) {
+        if (data.on_delete?.arguments_string && data.on_delete?.arguments_string.length > 0) {
+          try {
             schedule.on_delete.arguments = eval(data.on_delete.arguments_string)
+          } catch (e: any) {
+            toastError(e, 'Invalid CMD array')
+            return
           }
-        } catch (e: any) {
-          toastError(e, 'Invalid CMD array')
-          return
         }
       }
 

libs/pages/services/src/lib/feature/page-job-create-feature/step-summary-feature/step-summary-feature.tsx

@@ -53,7 +53,7 @@ function prepareJobRequest(
       cronjob: {
         entrypoint: configureData.image_entry_point,
         scheduled_at: configureData.schedule || '',
-        arguments: configureData.cmd || [''],
+        arguments: configureData.cmd,
       },
     }
   } else {

libs/pages/services/src/lib/feature/page-job-create-feature/step-variable-feature/step-variable-feature.tsx

@@ -21,7 +21,7 @@ export function StepVariableFeature() {
   const { organizationId = '', projectId = '', environmentId = '' } = useParams()
   const navigate = useNavigate()
   const pathCreate = `${SERVICES_URL(organizationId, projectId, environmentId)}${jobURL}`
-  const [availableScopes] = useState<APIVariableScopeEnum[]>(computeAvailableScope())
+  const [availableScopes] = useState<APIVariableScopeEnum[]>(computeAvailableScope(undefined, false, jobType))
 
   useEffect(() => {
     !generalData?.name &&
@@ -56,7 +56,12 @@ export function StepVariableFeature() {
   const [variables, setVariables] = useState(methods.getValues().variables)
 
   const onAddPort = () => {
-    const newVariableRow: VariableData = { variable: undefined, isSecret: false, value: undefined, scope: undefined }
+    const newVariableRow: VariableData = {
+      variable: '',
+      isSecret: false,
+      value: '',
+      scope: APIVariableScopeEnum.JOB,
+    }
     if (variables.length) {
       setVariables([...variables, newVariableRow])
       methods.setValue(`variables.${variables.length}`, newVariableRow)

libs/shared/console-shared/src/lib/job-configure-settings/ui/job-configure-settings.tsx

@@ -24,6 +24,8 @@ export function JobConfigureSettings(props: JobConfigureSettingsProps) {
       const isValidCron = cronstrue.toString(watchSchedule, { throwExceptionOnParseError: false })
       if (isValidCron.indexOf('An error') === -1) {
         setCronDescription(isValidCron)
+      } else {
+        setCronDescription('')
       }
     }
   }, [watchSchedule])
@@ -40,6 +42,12 @@ export function JobConfigureSettings(props: JobConfigureSettingsProps) {
             control={control}
             rules={{
               required: 'Value required',
+              validate: (value) => {
+                return (
+                  cronstrue.toString(value || '', { throwExceptionOnParseError: false }).indexOf('An error') === -1 ||
+                  'Invalid cron expression'
+                )
+              },
             }}
             render={({ field, fieldState: { error } }) => (
               <InputText

libs/shared/utils/src/lib/tools/refacto-payload.ts

@@ -121,6 +121,7 @@ export function refactoJobPayload(job: Partial<JobApplicationEntity>): JobReques
     }
   }
 
+  console.log('jobRequest', job.schedule)
   jobRequest.schedule = job.schedule
 
   return jobRequest