Skip to content

Commit 8dc15a0

Browse files
dvcantondvcanton
committed
feat: support creating multi-source applications & fix lint prettier errors
Signed-off-by: Dave Canton <[email protected]>
1 parent 6c6d7a3 commit 8dc15a0

File tree

3 files changed

+102
-160
lines changed

3 files changed

+102
-160
lines changed

‎ui/src/app/applications/components/application-create-panel/application-create-panel.tsx‎

Lines changed: 13 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -6,24 +6,15 @@ import {FieldApi, Form, FormApi, FormField as ReactFormField, Text} from 'react-
66
import {YamlEditor} from '../../../shared/components';
77
import * as models from '../../../shared/models';
88
import {services} from '../../../shared/services';
9-
import {ApplicationParameters} from '../application-parameters/application-parameters';
109
import {ApplicationRetryOptions} from '../application-retry-options/application-retry-options';
1110
import {ApplicationSyncOptionsField} from '../application-sync-options/application-sync-options';
1211
import {SetFinalizerOnApplication} from './set-finalizer-on-application';
1312
import './application-create-panel.scss';
14-
import {getAppDefaultSource} from '../utils';
1513
import {debounce} from 'lodash-es';
16-
import {SourcePanel} from './source-panel'
14+
import {SourcePanel} from './source-panel';
1715

1816
const jsonMergePatch = require('json-merge-patch');
1917

20-
const appTypes = new Array<{field: string; type: models.AppSourceType}>(
21-
{type: 'Helm', field: 'helm'},
22-
{type: 'Kustomize', field: 'kustomize'},
23-
{type: 'Directory', field: 'directory'},
24-
{type: 'Plugin', field: 'plugin'}
25-
);
26-
2718
const DEFAULT_APP: Partial<models.Application> = {
2819
apiVersion: 'argoproj.io/v1alpha1',
2920
kind: 'Application',
@@ -41,7 +32,7 @@ const DEFAULT_APP: Partial<models.Application> = {
4132
path: '',
4233
repoURL: '',
4334
targetRevision: 'HEAD'
44-
},
35+
}
4536
],
4637
project: ''
4738
}
@@ -83,21 +74,18 @@ const AutoSyncFormField = ReactFormField((props: {fieldApi: FieldApi; className:
8374
);
8475
});
8576

86-
8777
export const ApplicationCreatePanel = (props: {
8878
app: models.Application;
8979
onAppChanged: (app: models.Application) => any;
9080
createApp: (app: models.Application) => any;
9181
getFormApi: (api: FormApi) => any;
9282
}) => {
9383
const [yamlMode, setYamlMode] = React.useState(false);
94-
const [explicitPathType, setExplicitPathType] = React.useState<{path: string; type: models.AppSourceType}>(null);
9584
const [destFormat, setDestFormat] = React.useState('URL');
9685
const [retry, setRetry] = React.useState(false);
9786
const app = deepMerge(DEFAULT_APP, props.app || {});
9887
const debouncedOnAppChanged = debounce(props.onAppChanged, 800);
9988
const [sourcesIndexList, setSourcesIndexList] = React.useState([0]);
100-
10189

10290
React.useEffect(() => {
10391
if (app?.spec?.destination?.name && app.spec.destination.name !== '') {
@@ -111,25 +99,14 @@ export const ApplicationCreatePanel = (props: {
11199
};
112100
}, [debouncedOnAppChanged]);
113101

114-
function addSource(){
115-
let sources = sourcesIndexList;
116-
let last_index = sources.pop();
117-
sources.push(last_index)
118-
sources.push(last_index+1);
102+
function addSource() {
103+
const sources = sourcesIndexList;
104+
const last_index = sources.pop();
105+
sources.push(last_index);
106+
sources.push(last_index + 1);
119107
setSourcesIndexList(sources);
120108
}
121109

122-
123-
function normalizeTypeFields(formApi: FormApi, type: models.AppSourceType) {
124-
const appToNormalize = formApi.getFormState().values;
125-
for (const item of appTypes) {
126-
if (item.type !== type) {
127-
delete appToNormalize.spec.source[item.field];
128-
}
129-
}
130-
formApi.setAllValues(appToNormalize);
131-
}
132-
133110
return (
134111
<React.Fragment>
135112
<DataLoader
@@ -142,8 +119,6 @@ export const ApplicationCreatePanel = (props: {
142119
]).then(([projects, clusters, reposInfo]) => ({projects, clusters, reposInfo}))
143120
}>
144121
{({projects, clusters, reposInfo}) => {
145-
const repos = reposInfo.map(info => info.repo).sort();
146-
147122
return (
148123
<div className='application-create-panel'>
149124
{(yamlMode && (
@@ -155,12 +130,10 @@ export const ApplicationCreatePanel = (props: {
155130
onSave={async patch => {
156131
props.onAppChanged(jsonMergePatch.apply(app, JSON.parse(patch)));
157132
setYamlMode(false);
158-
console.log("app");
159-
console.log(props.app);
160-
if(props.app.hasOwnProperty("spec") && props.app.spec.hasOwnProperty("sources")){
133+
if (props.app.hasOwnProperty('spec') && props.app.spec.hasOwnProperty('sources')) {
161134
const numSources = props.app.spec.sources.length < 1 ? 1 : props.app.spec.sources.length;
162-
const range = n => Array.from({length: numSources}, (value, key) => key)
163-
setSourcesIndexList(range);
135+
const range = () => Array.from({length: numSources}, (value, key) => key);
136+
setSourcesIndexList(range);
164137
}
165138
return true;
166139
}}
@@ -171,7 +144,7 @@ export const ApplicationCreatePanel = (props: {
171144
'metadata.name': !a.metadata.name && 'Application Name is required',
172145
'spec.project': !a.spec.project && 'Project Name is required',
173146
'spec.sources[0].repoURL': !a.spec.sources[0].repoURL && 'Repository URL is required',
174-
'spec.sources[0].targetRevision': !a.spec.sources[0].targetRevision && 'Version is required',
147+
'spec.sources[0].targetRevision': !a.spec.sources[0].targetRevision && 'Version is required',
175148
'spec.sources[0].path': !a.spec.sources[0].path && !a.spec.sources[0].chart && 'Path is required',
176149
'spec.source[0].chart': !a.spec.sources[0].path && !a.spec.sources[0].chart && 'Chart is required',
177150
// Verify cluster URL when there is no cluster name field or the name value is empty
@@ -260,23 +233,12 @@ export const ApplicationCreatePanel = (props: {
260233
<div className='white-box'>
261234
<p>SOURCES</p>
262235

263-
{
264-
sourcesIndexList.map(index =>
265-
<SourcePanel
266-
key={'create_source_' + index}
267-
index={index}
268-
api={api}
269-
reposInfo={reposInfo}
270-
appCurrent={props.app}
271-
272-
/>)
236+
{sourcesIndexList.map(index => (
237+
<SourcePanel key={'create_source_' + index} index={index} api={api} reposInfo={reposInfo} appCurrent={props.app} />))
273238
}
274-
275-
276239
<div className='source-panel-buttons'>
277240
<button key={'add_source_button'} onClick={() => addSource()} disabled={false} className='argo-button argo-button--base'>
278241
<i className='fa fa-plus' style={{marginLeft: '-5px', marginRight: '5px'}} />
279-
280242
<span style={{marginRight: '8px'}} />
281243
Add Source
282244
</button>
@@ -349,17 +311,13 @@ export const ApplicationCreatePanel = (props: {
349311
</div>
350312
</div>
351313
);
352-
353-
354-
355314
return (
356315
<form onSubmit={api.submitForm} role='form' className='width-control'>
357316
{generalPanel()}
358317

359318
{sourcePanel()}
360319

361320
{destinationPanel()}
362-
363321
</form>
364322
);
365323
}}

0 commit comments

Comments
 (0)