fix(create-update-variable-modal): allow null value during edition (#…

…1720)

* fix(create-update-variable-modal): allow null value during edition

* fix: nullable handleInsertVariable function

libs/domains/variables/feature/src/lib/create-update-variable-modal/create-update-variable-modal.tsx

@@ -101,7 +101,7 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
 
  const methods = useForm<{
  key: string
- value: string
+ value?: string | null
  description?: string
  scope: Scope
  isSecret: boolean
@@ -111,7 +111,7 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
  defaultValues: {
  key: variable?.key,
  scope: defaultScope,
- value: variable?.value ?? '',
+ value: variable?.value,
  isSecret: variable?.is_secret,
  description: variable?.description,
  enable_interpolation_in_file: _isFile ? variable?.enable_interpolation_in_file ?? true : undefined,
@@ -160,7 +160,7 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
  variableRequest: {
  is_secret: data.isSecret,
  key: data.key,
- value: data.value,
+ value: data.value || '',
  description: data.description,
  mount_path: data.mountPath || null,
  variable_parent_id: parentId,
@@ -192,7 +192,7 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
  variableOverrideRequest: {
  override_scope: data.scope,
  override_parent_id: parentId,
- value: data.value,
+ value: data.value || '',
  description: data.description,
  },
  })
@@ -205,11 +205,13 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
  throw new Error('No variable to be based on')
  }
 
+ // Allowing a null value for the variable when updating permits retaining the current value.
+ // For newly created variables, a value is required and an empty string will be set if not provided.
  return editVariable({
  variableId: variable.id,
  variableEditRequest: {
  key: data.key,
- value: variable.aliased_variable?.key || data.value || '',
+ value: variable.aliased_variable?.key || data.value,
  description: data.description,
  },
  })
@@ -369,7 +371,7 @@ export function CreateUpdateVariableModal(props: CreateUpdateVariableModalProps)
  {'environmentId' in props && (
  <DropdownVariable
  environmentId={props.environmentId}
- onChange={(variableKey) => handleInsertVariable({ variableKey, value, onChange })}
+ onChange={(variableKey) => handleInsertVariable({ variableKey, value: value || '', onChange })}
  >
  <Button
  size="md"

libs/shared/ui/src/lib/components/inputs/input-text-area/input-text-area.tsx

@@ -3,7 +3,7 @@ import { type FormEvent, type ReactNode, forwardRef, useEffect, useRef, useState
 export interface InputTextAreaProps {
  label: string
  name: string
- value?: string | undefined
+ value?: string | null
  onChange?: (e: FormEvent<HTMLTextAreaElement>) => void
  className?: string
  disabled?: boolean
@@ -51,7 +51,7 @@ export const InputTextArea = forwardRef<HTMLTextAreaElement, InputTextAreaProps>
  name={name}
  id={label}
  className="mt-5 min-h-[52px] w-full appearance-none bg-transparent pr-3 text-sm text-neutral-400 outline-0"
- value={currentValue}
+ value={!currentValue ? undefined : currentValue}
  onChange={(e) => {
  if (onChange) onChange(e)
  setCurrentValue(e.currentTarget.value)

package.json

@@ -67,7 +67,7 @@
  "jwt-decode": "^4.0.0",
  "monaco-editor": "^0.44.0",
  "posthog-js": "^1.131.4",
- "qovery-typescript-axios": "^1.1.487",
+ "qovery-typescript-axios": "^1.1.490",
  "react": "18.3.1",
  "react-country-flag": "^3.0.2",
  "react-datepicker": "^4.12.0",

yarn.lock

@@ -4124,7 +4124,7 @@ __metadata:
  prettier: ^3.2.5
  prettier-plugin-tailwindcss: ^0.5.14
  pretty-quick: ^4.0.0
- qovery-typescript-axios: ^1.1.487
+ qovery-typescript-axios: ^1.1.490
  qovery-ws-typescript-axios: ^0.1.153
  react: 18.3.1
  react-country-flag: ^3.0.2
@@ -19426,12 +19426,12 @@ __metadata:
  languageName: node
  linkType: hard
 
-"qovery-typescript-axios@npm:^1.1.487":
- version: 1.1.487
- resolution: "qovery-typescript-axios@npm:1.1.487"
+"qovery-typescript-axios@npm:^1.1.490":
+ version: 1.1.490
+ resolution: "qovery-typescript-axios@npm:1.1.490"
  dependencies:
  axios: ^0.27.2
- checksum: c3c8a5a38e81664e68fe4638f9104a97b6b751946a4fd1c99267df829d7c2a0adfc9b999dafc828d0b770145ed8ce39452a60acb31bf507cb96f642afe99bc20
+ checksum: bb6f98fc46884ebf2c9733d45c3f1894e9248c9ab44da08de35231a4cd52ca2040482b5b0a2cac6e46308ba30a17ec8f7d441c645a09199795a1f43450a270bb
  languageName: node
  linkType: hard