fix: add optional value label for environment variables in build creation (#611)

Author: ferruhcihan

src/components/forms/KeyValue.tsx

@@ -119,6 +119,7 @@ interface KeyValueProps {
   // render the value field as a textarea when true
   isTextArea?: boolean
   isEncrypted?: boolean
+  isValueOptional?: boolean
 }
 
 // This local subcomponent watches the key field (using its path) and checks the provided
@@ -182,6 +183,7 @@ export default function KeyValue(props: KeyValueProps) {
     decoratorMapping,
     isTextArea = false,
     isEncrypted,
+    isValueOptional = false,
   } = props
 
   const { fields, append, remove } = useFieldArray({ control, name })
@@ -220,7 +222,7 @@ export default function KeyValue(props: KeyValueProps) {
         const commonProps = {
           ...register(valuePath),
           width: valueSize,
-          label: showLabel && localIndex === 0 ? valueLabel : '',
+          label: showLabel && localIndex === 0 ? `${valueLabel}${isValueOptional ? ' (optional)' : ''}` : '',
           noMarginTop: compressed,
           disabled: isFieldDisabled,
           type: valueIsNumber ? 'number' : undefined,

src/pages/builds/create-edit/index.tsx

@@ -313,12 +313,13 @@ export default function CreateEditBuilds({
                 title='Extra arguments'
                 subTitle='Additional arguments to pass on to the build executor'
                 keyLabel='Name'
-                valueLabel='Value (optional)'
+                valueLabel='Value'
                 addLabel='Add argument'
                 compressed
                 name={`mode.${watch('mode.type')}.envVars`}
                 {...register(`mode.${watch('mode.type')}.envVars`)}
                 errorText={extraArgumentsError()}
+                isValueOptional
               />
 
               <Divider sx={{ mt: 2, mb: 2 }} />