fix(app): remove canUndo function from environment variables [EE-6232] (#10961)

Co-authored-by: testa113 <testa113>

app/kubernetes/react/components/index.ts

@@ -26,7 +26,6 @@ import { YAMLInspector } from '@/react/kubernetes/components/YAMLInspector';
 import { ApplicationsStacksDatatable } from '@/react/kubernetes/applications/ListView/ApplicationsStacksDatatable';
 import { NodesDatatable } from '@/react/kubernetes/cluster/HomeView/NodesDatatable';
 import { StackName } from '@/react/kubernetes/DeployView/StackName/StackName';
-import { kubeEnvVarValidationSchema } from '@/react/kubernetes/applications/ApplicationForm/kubeEnvVarValidationSchema';
 import { SecretsFormSection } from '@/react/kubernetes/applications/components/ConfigurationsFormSection/SecretsFormSection';
 import { configurationsValidationSchema } from '@/react/kubernetes/applications/components/ConfigurationsFormSection/configurationValidationSchema';
 import { ConfigMapsFormSection } from '@/react/kubernetes/applications/components/ConfigurationsFormSection/ConfigMapsFormSection';
@@ -57,8 +56,8 @@ import {
 } from '@/react/kubernetes/applications/components/NameFormSection';
 import { deploymentTypeValidation } from '@/react/kubernetes/applications/components/AppDeploymentTypeFormSection/deploymentTypeValidation';
 import { AppDeploymentTypeFormSection } from '@/react/kubernetes/applications/components/AppDeploymentTypeFormSection/AppDeploymentTypeFormSection';
-
-import { EnvironmentVariablesFieldset } from '@@/form-components/EnvironmentVariablesFieldset';
+import { EnvironmentVariablesFormSection } from '@/react/kubernetes/applications/components/EnvironmentVariablesFormSection/EnvironmentVariablesFormSection';
+import { kubeEnvVarValidationSchema } from '@/react/kubernetes/applications/components/EnvironmentVariablesFormSection/kubeEnvVarValidationSchema';
 
 import { applicationsModule } from './applications';
 
@@ -219,17 +218,6 @@ withFormValidation(
   kubeServicesValidation
 );
 
-withFormValidation(
-  ngModule,
-  withControlledInput(withControlledInput(EnvironmentVariablesFieldset), {
-    values: 'onChange',
-  }),
-  'kubeEnvironmentVariablesFieldset',
-  ['canUndoDelete'],
-  // use kubeEnvVarValidationSchema instead of envVarValidation to add a regex matches rule
-  kubeEnvVarValidationSchema
-);
-
 withFormValidation(
   ngModule,
   withControlledInput(
@@ -350,3 +338,16 @@ withFormValidation(
   deploymentTypeValidation,
   true
 );
+
+withFormValidation(
+  ngModule,
+  withControlledInput(
+    withUIRouter(
+      withCurrentUser(withReactQuery(EnvironmentVariablesFormSection))
+    ),
+    { values: 'onChange' }
+  ),
+  'environmentVariablesFormSection',
+  [],
+  kubeEnvVarValidationSchema
+);

app/kubernetes/views/applications/create/createApplication.html

@@ -235,18 +235,10 @@
                   <!-- #endregion -->
 
                   <!-- #region ENVIRONMENT VARIABLES -->
-                  <div class="form-group">
-                    <div class="col-sm-12 vertical-center">
-                      <label class="control-label !pt-0 text-left !text-sm">Environment variables</label>
-                    </div>
-                    <div class="col-sm-11 col-lg-10 mt-2">
-                      <kube-environment-variables-fieldset
-                        values="ctrl.formValues.EnvironmentVariables"
-                        on-change="(ctrl.onEnvironmentVariableChange)"
-                        can-undo-delete="true"
-                      ></kube-environment-variables-fieldset>
-                    </div>
-                  </div>
+                  <environment-variables-form-section
+                    values="ctrl.formValues.EnvironmentVariables"
+                    on-change="(ctrl.onEnvironmentVariableChange)"
+                  ></environment-variables-form-section>
                   <!-- #endregion -->
 
                   <!-- #region CONFIGMAPS -->

app/react/kubernetes/applications/components/EnvironmentVariablesFormSection/EnvironmentVariablesFormSection.tsx

@@ -0,0 +1,30 @@
+import { FormSection } from '@@/form-components/FormSection';
+import {
+  EnvVarValues,
+  EnvironmentVariablesFieldset,
+} from '@@/form-components/EnvironmentVariablesFieldset';
+import { ArrayError } from '@@/form-components/InputList/InputList';
+
+type Props = {
+  values: EnvVarValues;
+  onChange(value: EnvVarValues): void;
+  errors?: ArrayError<EnvVarValues>;
+};
+
+export function EnvironmentVariablesFormSection({
+  values,
+  onChange,
+  errors,
+}: Props) {
+  return (
+    <FormSection title="Environment variables" titleSize="sm">
+      <div className="mb-4">
+        <EnvironmentVariablesFieldset
+          values={values}
+          onChange={onChange}
+          errors={errors}
+        />
+      </div>
+    </FormSection>
+  );
+}

app/react/kubernetes/applications/components/EnvironmentVariablesFormSection/kubeEnvVarValidationSchema.ts

@@ -14,6 +14,7 @@ export function kubeEnvVarValidationSchema(): SchemaOf<EnvVar[]> {
         ),
       value: string().default(''),
       needsDeletion: bool().default(false),
+      isNew: bool().default(false),
     })
   ).test(
     'unique',