From 63772598a9f52fb95b99a9f03f88f98e3fefbf2d Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Wed, 28 Jun 2023 17:38:57 +0200 Subject: [PATCH 1/7] fix: display valuesobject if set With #11538 we now have the ability to set helm values as an object instead of a string, but we also need to be able to correctly display it in the UI if it is set. Signed-off-by: Blake Pettersson --- .../application-parameters.tsx | 15 +++++---------- ui/src/app/shared/models.ts | 1 + 2 files changed, 6 insertions(+), 10 deletions(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index f374678540189..6d192d3168b36 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -26,8 +26,6 @@ import {concatMaps} from '../../../shared/utils'; import {getAppDefaultSource} from '../utils'; import * as jsYaml from 'js-yaml'; -let isValuesRaw = false; - const TextWithMetadataField = ReactFormField((props: {metadata: {value: string}; fieldApi: FieldApi; className: string}) => { const { fieldApi: {getValue, setValue} @@ -133,11 +131,8 @@ export const ApplicationParameters = (props: { const [removedOverrides, setRemovedOverrides] = React.useState(new Array()); let attributes: EditablePanelItem[] = []; - let appValues: string; - if (source && source.helm && source.helm.values) { - isValuesRaw = typeof source.helm.values !== 'string'; // nolint - appValues = isValuesRaw ? jsYaml.safeDump(source.helm.values) : source.helm.values; - source.helm.values = appValues; + if (source && source.helm && source.helm.valuesObject) { + source.helm.values = jsYaml.safeDump(source.helm.valuesObject); } const [appParamsDeletedState, setAppParamsDeletedState] = React.useState([]); @@ -225,7 +220,7 @@ export const ApplicationParameters = (props: { title: 'VALUES', view: source.helm && ( - 
{appValues}
+ 
{source.helm.values}
 ), edit: (formApi: FormApi) => ( @@ -527,8 +522,8 @@ export const ApplicationParameters = (props: { params = params.filter(param => !appParamsDeletedState.includes(param.name)); input.spec.source.plugin.parameters = params; } - if (input.spec.source.helm && input.spec.source.helm.values && isValuesRaw) { - input.spec.source.helm.values = jsYaml.safeLoad(input.spec.source.helm.values); // Load values as json + if (input.spec.source.helm && input.spec.source.helm.valuesObject) { + input.spec.source.helm.values = jsYaml.safeLoad(input.spec.source.helm.valuesObject); // Load values as json } await props.save(input, {}); setRemovedOverrides(new Array()); diff --git a/ui/src/app/shared/models.ts b/ui/src/app/shared/models.ts index f7530028bfee6..7604e4c39bd1e 100644 --- a/ui/src/app/shared/models.ts +++ b/ui/src/app/shared/models.ts @@ -202,6 +202,7 @@ export interface ApplicationSource { export interface ApplicationSourceHelm { valueFiles: string[]; values?: string; + valuesObject?: any; parameters: HelmParameter[]; fileParameters: HelmFileParameter[]; } From 3a3b2029991131a86978abde95cf35e37d8fa83b Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Thu, 6 Jul 2023 13:45:51 +0200 Subject: [PATCH 2/7] fix: set valuesobject on save If `valuesObject` is present, set it to the value of `input.spec.source.helm.values` on save, as an unmarshaled json string. Signed-off-by: Blake Pettersson --- .../application-parameters/application-parameters.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index 6d192d3168b36..f7cbff2995203 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -523,7 +523,7 @@ export const ApplicationParameters = (props: { input.spec.source.plugin.parameters = params; } if (input.spec.source.helm && input.spec.source.helm.valuesObject) { - input.spec.source.helm.values = jsYaml.safeLoad(input.spec.source.helm.valuesObject); // Load values as json + input.spec.source.helm.valuesObject = jsYaml.safeLoad(input.spec.source.helm.values); // Deserialize json } await props.save(input, {}); setRemovedOverrides(new Array()); From 758de442090a6dd039e1f1c36fdee77cf7822498 Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Thu, 6 Jul 2023 14:14:58 +0200 Subject: [PATCH 3/7] fix: set `helm.values` to empty string on save If `valuesObject` exists, set `input.spec.source.helm.values` to an empty string once `valuesObject` has been unmarshalled from the values input. This is to prevent unnecessary duplication of the values. Signed-off-by: Blake Pettersson --- .../components/application-parameters/application-parameters.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index f7cbff2995203..32d9a5c4164be 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -524,6 +524,7 @@ export const ApplicationParameters = (props: { } if (input.spec.source.helm && input.spec.source.helm.valuesObject) { input.spec.source.helm.valuesObject = jsYaml.safeLoad(input.spec.source.helm.values); // Deserialize json + input.spec.source.helm.values = "" } await props.save(input, {}); setRemovedOverrides(new Array()); From 9f0cc61260edd6406857b65d6be4768d5e27cef3 Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Thu, 6 Jul 2023 16:34:50 +0200 Subject: [PATCH 4/7] chore: eslint Signed-off-by: Blake Pettersson --- .../application-parameters/application-parameters.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index 32d9a5c4164be..d4c7fba80e582 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -524,7 +524,7 @@ export const ApplicationParameters = (props: { } if (input.spec.source.helm && input.spec.source.helm.valuesObject) { input.spec.source.helm.valuesObject = jsYaml.safeLoad(input.spec.source.helm.values); // Deserialize json - input.spec.source.helm.values = "" + input.spec.source.helm.values = '' } await props.save(input, {}); setRemovedOverrides(new Array()); From 2ce71eb04d7a35df152da3e7ff7d86197aeb051c Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Thu, 6 Jul 2023 18:33:12 +0200 Subject: [PATCH 5/7] chore: eslint Signed-off-by: Blake Pettersson --- .../application-parameters/application-parameters.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index d4c7fba80e582..b1146b4cdc06a 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -524,7 +524,7 @@ export const ApplicationParameters = (props: { } if (input.spec.source.helm && input.spec.source.helm.valuesObject) { input.spec.source.helm.valuesObject = jsYaml.safeLoad(input.spec.source.helm.values); // Deserialize json - input.spec.source.helm.values = '' + input.spec.source.helm.values = ''; } await props.save(input, {}); setRemovedOverrides(new Array()); From dbddd090d8ba70d453352a1d0b7bfcd5acc985ba Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Tue, 11 Jul 2023 20:23:06 +0200 Subject: [PATCH 6/7] fix: deep clone app This is so that we can conditionally set `source.helm.values` without inadvertently affecting other parts of the app. Only when the edit button is pressed do we toggle `source.helm.values`. Signed-off-by: Blake Pettersson --- .../application-parameters.tsx | 30 +++++++++++-------- 1 file changed, 18 insertions(+), 12 deletions(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index b1146b4cdc06a..e62655bc2a5be 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -126,14 +126,13 @@ export const ApplicationParameters = (props: { save?: (application: models.Application, query: {validate?: boolean}) => Promise; noReadonlyMode?: boolean; }) => { - const app = props.application; + const app = cloneDeep(props.application); const source = getAppDefaultSource(app); const [removedOverrides, setRemovedOverrides] = React.useState(new Array()); let attributes: EditablePanelItem[] = []; - if (source && source.helm && source.helm.valuesObject) { - source.helm.values = jsYaml.safeDump(source.helm.valuesObject); - } + const isValuesObject = source?.helm?.valuesObject; + const helmValues = isValuesObject ? jsYaml.safeDump(source.helm.valuesObject) : source?.helm?.values; const [appParamsDeletedState, setAppParamsDeletedState] = React.useState([]); if (props.details.type === 'Kustomize' && props.details.kustomize) { @@ -220,16 +219,23 @@ export const ApplicationParameters = (props: { title: 'VALUES', view: source.helm && ( - 
{source.helm.values}
+ 
{helmValues}
 ), - edit: (formApi: FormApi) => ( -
- 
-                        
-
-
- ) + edit: (formApi: FormApi) => { + // In case source.helm.valuesObject is set, set source.helm.values to its value + if(source.helm) { + source.helm.values = helmValues + } + + return ( +
+ 
+                            
+
+
+ ); + } }); const paramsByName = new Map(); (props.details.helm.parameters || []).forEach(param => paramsByName.set(param.name, param)); From 64128468218ba1c16c80cf323fb4492409361742 Mon Sep 17 00:00:00 2001 From: Blake Pettersson Date: Tue, 11 Jul 2023 21:34:49 +0200 Subject: [PATCH 7/7] chore: eslint Signed-off-by: Blake Pettersson --- .../application-parameters/application-parameters.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/src/app/applications/components/application-parameters/application-parameters.tsx b/ui/src/app/applications/components/application-parameters/application-parameters.tsx index e62655bc2a5be..27f292ff7d2e8 100644 --- a/ui/src/app/applications/components/application-parameters/application-parameters.tsx +++ b/ui/src/app/applications/components/application-parameters/application-parameters.tsx @@ -224,8 +224,8 @@ export const ApplicationParameters = (props: { ), edit: (formApi: FormApi) => { // In case source.helm.valuesObject is set, set source.helm.values to its value - if(source.helm) { - source.helm.values = helmValues + if (source.helm) { + source.helm.values = helmValues; } return (