Skip to content

Commit

Permalink
CMP parameter changes
Browse files Browse the repository at this point in the history 
Signed-off-by: schakradari <[email protected]>
  • Loading branch information
@schakrad
schakrad committed Jan 25, 2023
1 parent 2e4f3e5 commit dba7f73
Show file tree
Hide file tree
Showing 3 changed files with 314 additions and 45 deletions.
153 changes: 130 additions & 23 deletions ui/src/app/applications/components/application-parameters/application-parameters.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,20 @@ import {AutocompleteField, DataLoader, FormField, FormSelect, getNestedField} fr
import * as React from 'react';
import {FieldApi, FormApi, FormField as ReactFormField, Text, TextArea} from 'react-form';

import {ArrayInputField, CheckboxField, EditablePanel, EditablePanelItem, Expandable, TagsInputField} from '../../../shared/components';
import {
ArrayInputField,
ArrayValueField,
CheckboxField,
EditablePanel,
EditablePanelItem,
Expandable,
MapValueField,
NameValueEditor,
StringValueField,
NameValue,
TagsInputField,
ValueEditor,
} from '../../../shared/components';
import * as models from '../../../shared/models';
import {ApplicationSourceDirectory, AuthSettings} from '../../../shared/models';
import {services} from '../../../shared/services';
Expand Down Expand Up @@ -256,7 +269,7 @@ export const ApplicationParameters = (props: {
} else if (props.details.type === 'Plugin') {
attributes.push({
title: 'NAME',
view: source.plugin && source.plugin.name,
view: <div style={{marginTop: 15,marginBottom:5}}>{ValueEditor(app.spec.source.plugin && app.spec.source.plugin.name, null)}</div>,
edit: (formApi: FormApi) => (
<DataLoader load={() => services.authService.settings()}>
{(settings: AuthSettings) => (
Expand All @@ -267,38 +280,132 @@ export const ApplicationParameters = (props: {
});
attributes.push({
title: 'ENV',
view: source.plugin && (source.plugin.env || []).map(i => `${i.name}='${i.value}'`).join(' '),
view: (
<div style={{marginTop: 15}}>
{app.spec.source.plugin &&
(app.spec.source.plugin.env || []).map(val => (
<span key={val.name} style={{display: 'block', marginBottom: 5}}>
{NameValueEditor(val, null)}
</span>
))}
</div>
),
edit: (formApi: FormApi) => <FormField field='spec.source.plugin.env' formApi={formApi} component={ArrayInputField} />
});
if (props.details.plugin.parametersAnnouncement) {
let parametersSet = new Set<string>();
for (const announcement of props.details.plugin.parametersAnnouncement) {
const liveParam = app.spec.source.plugin.parameters?.find(param => param.name === announcement.name);
if (announcement.collectionType === undefined || announcement.collectionType === '' || announcement.collectionType === 'string') {
parametersSet.add(announcement.name);
}
if (app.spec.source.plugin?.parameters) {
for (const appParameter of app.spec.source.plugin.parameters) {
parametersSet.add(appParameter.name);
}
}

parametersSet.forEach((name, dupName, parametersSet) => {
const announcement = props.details.plugin.parametersAnnouncement?.find(param => param.name === name);
const liveParam = app.spec.source.plugin.parameters?.find(param => param.name === name);
const pluginIcon = 'This parameter is provided by the plugin.';
const isPluginPar = announcement?true:false;
if ((announcement?.collectionType === undefined && liveParam?.array) || announcement?.collectionType === 'array') {
let liveParamArray;
if (liveParam) {
liveParamArray = liveParam?.array??[];
}
attributes.push({
title: announcement.title ?? announcement.name,
view: liveParam?.string || announcement.string,
edit: () => liveParam?.string || announcement.string
title:announcement?.title ?? announcement?.name ?? name,
customTitle: (
<span>
{isPluginPar && <i className='fa-solid fa-puzzle-piece' title={pluginIcon} style={{marginRight: 5}}></i>}
{announcement?.title ?? announcement?.name ?? name}
</span>
),
view: (
<div style={{marginTop: 15,marginBottom:5}}>
{(liveParamArray ?? announcement?.array ?? []).length === 0 && <span style={{color:"dimgray"}}>-- NO ITEMS --</span>}
{(liveParamArray ?? announcement?.array ?? []).map((val, index) => (
<span key={index} style={{display: 'block', marginBottom: 5}}>
{ValueEditor(val, null)}
</span>
))}
</div>
),
edit: (formApi: FormApi) => (
<FormField
field='spec.source.plugin.parameters'
componentProps={{name: announcement?.title ?? announcement?.name ?? name, defaultVal: announcement?.array, isPluginPar:isPluginPar }}
formApi={formApi}
component={ArrayValueField}
/>
)
});
} else if (announcement.collectionType === 'array') {
} else if ((announcement?.collectionType === undefined && liveParam?.map) || announcement?.collectionType === 'map') {
let liveParamMap;
if (liveParam) {
liveParamMap = liveParam.map??new Map<string, string>();
}
const map = concatMaps(liveParamMap ?? announcement?.map, new Map<string, string>());
const entries = map.entries();
const items = new Array<NameValue>();
Array.from(entries).forEach(([key, value]) => items.push({name: key, value: value}));
attributes.push({
title: announcement.title ?? announcement.name,
view: (liveParam?.array || announcement.array || []).join(' '),
edit: () => (liveParam?.array || announcement.array || []).join(' ')
title:announcement?.title ?? announcement?.name ?? name,
customTitle: (
<span>
{isPluginPar && <i className='fa solid fa-puzzle-piece' title={pluginIcon} style={{marginRight: 5}}></i>}
{announcement?.title ?? announcement?.name ?? name}
</span>
),
view: (
<div style={{marginTop: 15,marginBottom:5 }}>
{items.length == 0 && <span style={{color:"dimgray"}}>-- NO ITEMS --</span>}
{items.map(val => (
<span key={val.name} style={{display: 'block', marginBottom: 5}}>
{NameValueEditor(val)}
</span>
))}
</div>
),
edit: (formApi: FormApi) => (
<FormField
field='spec.source.plugin.parameters'
componentProps={{name: announcement?.title ?? announcement?.name ?? name, defaultVal: announcement?.map, isPluginPar: isPluginPar}}
formApi={formApi}
component={MapValueField}
/>
)
});
} else if (announcement.collectionType === 'map') {
const entries = concatMaps(announcement.map, liveParam?.map).entries();
} else if (
(announcement?.collectionType === undefined && liveParam?.string) ||
announcement?.collectionType === '' ||
announcement?.collectionType === 'string' ||
announcement?.collectionType === undefined
) {
let liveParamString;
if (liveParam) {
liveParamString = liveParam?.string ?? '';
}
attributes.push({
title: announcement.title ?? announcement.name,
view: Array.from(entries)
.map(([key, value]) => `${key}='${value}'`)
.join(' '),
edit: () =>
Array.from(entries)
.map(([key, value]) => `${key}='${value}'`)
.join(' ')
title:announcement?.title ?? announcement?.name ?? name,
customTitle: (
<span>
{isPluginPar && <i className='fa-solid fa-puzzle-piece' title={pluginIcon} style={{marginRight: 5}}></i>}
{announcement?.title ?? announcement?.name ?? name}
</span>
),
view: <div style={{marginTop: 15,marginBottom:5}}>{ValueEditor(liveParamString ?? announcement?.string, null)}</div>,
edit: (formApi: FormApi) => (
<FormField
field='spec.source.plugin.parameters'
componentProps={{name: announcement?.title ?? announcement?.name ?? name, defaultVal: announcement?.string, isPluginPar: isPluginPar}}
formApi={formApi}
component={StringValueField}
/>
)
});
}
}
});
}
} else if (props.details.type === 'Directory') {
const directory = source.directory || ({} as ApplicationSourceDirectory);
Expand Down
Loading

0 comments on commit dba7f73

Please sign in to comment.