Elgato_dark/argo-cd
1
0
Fork 0
mirror of https://github.com/argoproj/argo-cd synced 2026-05-23 17:28:44 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

feat: Add option to show branches or tags for GIT revision (#4751) (#4788)

Browse source 
Signed-off-by: Keith Chong <kykchong@redhat.com>
This commit is contained in:
Keith Chong 2020-11-16 16:04:17 -05:00 committed by GitHub
parent e8e810934d
commit e4e503aad7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 68 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ui/src/app/applications/components/application-create-panel/application-create-panel.tsx
View file

@ -272,9 +272,7 @@ export const ApplicationCreatePanel = (props: {
</div>
{(repoType === 'git' && (
<React.Fragment>
<div className='argo-form-row'>
<RevisionFormField formApi={api} helpIconTop={'2em'} repoURL={app.spec.source.repoURL} />
</div>
<RevisionFormField formApi={api} helpIconTop={'2.5em'} repoURL={app.spec.source.repoURL} />
<div className='argo-form-row'>
<DataLoader
input={{repoURL: app.spec.source.repoURL, revision: app.spec.source.targetRevision}}

94
ui/src/app/applications/components/revision-form-field/revision-form-field.tsx
View file

@ -1,7 +1,7 @@
import * as React from 'react';
import {FormApi} from 'react-form';
import {AutocompleteField, DataLoader, FormField} from 'argo-ui';
import {AutocompleteField, DataLoader, DropDownMenu, FormField} from 'argo-ui';
import {RevisionHelpIcon} from '../../../shared/components';
import {services} from '../../../shared/services';
@ -12,36 +12,72 @@ interface RevisionFormFieldProps {
repoURL: string;
}
export class RevisionFormField extends React.PureComponent<RevisionFormFieldProps> {
export class RevisionFormField extends React.PureComponent<RevisionFormFieldProps, {filterType: string}> {
constructor(props: RevisionFormFieldProps) {
super(props);
this.state = {filterType: 'Branches'};
}
public setFilter(newValue: string) {
this.setState({filterType: newValue});
}
public render() {
const selectedFilter = this.state.filterType;
const extraPadding = this.props.hideLabel ? '0em' : '1.53em';
const rowClass = this.props.hideLabel ? '' : ' argo-form-row';
return (
<React.Fragment>
<DataLoader
input={{repoURL: this.props.repoURL}}
load={async (src: any): Promise<string[]> => {
if (src.repoURL) {
return services.repos
.revisions(src.repoURL)
.then(revisionsRes => ['HEAD'].concat(revisionsRes.branches || []).concat(revisionsRes.tags || []))
.catch(() => []);
}
return [];
}}>
{(revisions: string[]) => (
<FormField
formApi={this.props.formApi}
label={this.props.hideLabel ? undefined : 'Revision'}
field='spec.source.targetRevision'
component={AutocompleteField}
componentProps={{
items: revisions,
filterSuggestions: true
}}
/>
)}
</DataLoader>
<RevisionHelpIcon type='git' top={this.props.helpIconTop} />
</React.Fragment>
<div className={'row' + rowClass}>
<div className='columns small-10'>
<React.Fragment>
<DataLoader
input={{repoURL: this.props.repoURL, filterType: selectedFilter}}
load={async (src: any): Promise<string[]> => {
if (src.repoURL) {
return services.repos
.revisions(src.repoURL)
.then(revisionsRes =>
['HEAD']
.concat(selectedFilter === 'Branches' ? revisionsRes.branches || [] : [])
.concat(selectedFilter === 'Tags' ? revisionsRes.tags || [] : [])
)
.catch(() => []);
}
return [];
}}>
{(revisions: string[]) => (
<FormField
formApi={this.props.formApi}
label={this.props.hideLabel ? undefined : 'Revision'}
field='spec.source.targetRevision'
component={AutocompleteField}
componentProps={{
items: revisions,
filterSuggestions: true
}}
/>
)}
</DataLoader>
<RevisionHelpIcon type='git' top={this.props.helpIconTop} right='0em' />
</React.Fragment>
</div>
<div style={{paddingTop: extraPadding}} className='columns small-2'>
<DropDownMenu
anchor={() => (
<p>
{this.state.filterType} <i className='fa fa-caret-down' />
</p>
)}
qeId='application-create-dropdown-revision'
items={['Branches', 'Tags'].map((type: 'Branches' | 'Tags') => ({
title: type,
action: () => {
this.setFilter(type);
}
}))}
/>
</div>
</div>
);
}
}

4
ui/src/app/shared/components/revision-help-icon.tsx
View file

@ -1,8 +1,8 @@
import {HelpIcon} from 'argo-ui';
import * as React from 'react';
export const RevisionHelpIcon = ({type, top}: {type: string; top?: string}) => (
<div style={{position: 'absolute', top: top === undefined ? '1em' : top, right: '0.5em'}}>
export const RevisionHelpIcon = ({type, top, right}: {type: string; top?: string; right?: string}) => (
<div style={{position: 'absolute', top: top === undefined ? '1em' : top, right: right === undefined ? '0.5em' : right}}>
{type === 'helm' ? (
<HelpIcon title='E.g. 1.2.0, 1.2.*, 1.*, or *' />
) : (