IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

fiddling with validation

Browse Source
This commit is contained in:
Peter Holmberg 2018-10-02 16:50:34 +02:00
parent 7a39e5554b
commit a381db3237
2 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
public/app/features/datasources/NewDataSourcePage.tsx
View File

@ -4,22 +4,24 @@ import { hot } from 'react-hot-loader';
import Select from 'react-select'; import Select from 'react-select';
import PageHeader from 'app/core/components/PageHeader/PageHeader'; import PageHeader from 'app/core/components/PageHeader/PageHeader';
import { NavModel } from 'app/types'; import { NavModel } from 'app/types';
import { addDataSource } from './state/actions';
import { getNavModel } from 'app/core/selectors/navModel'; import { getNavModel } from 'app/core/selectors/navModel';
export interface Props { export interface Props {
navModel: NavModel; navModel: NavModel;
addDataSource: typeof addDataSource;
} }
export interface State { export interface State {
name: string; name: string;
type: string; type: { value: string; label: string };
dataSourceOptions: Array<{ value: string; label: string }>; dataSourceOptions: Array<{ value: string; label: string }>;
} }
class NewDataSourcePage extends PureComponent<Props, State> { class NewDataSourcePage extends PureComponent<Props, State> {
state = { state = {
name: '', name: '',
type: '', type: null,
dataSourceOptions: [ dataSourceOptions: [
{ value: 'prometheus', label: 'Prometheus' }, { value: 'prometheus', label: 'Prometheus' },
{ value: 'graphite', label: 'Graphite' }, { value: 'graphite', label: 'Graphite' },
@ -49,12 +51,12 @@ class NewDataSourcePage extends PureComponent<Props, State> {
isFieldsEmpty = () => { isFieldsEmpty = () => {
const { name, type } = this.state; const { name, type } = this.state;
if (name === '' && type === '') { if (name === '' && !type) {
return true; return true;
} else if (name !== '' && type === '') { } else if (name !== '' && !type) {
return true; return true;
} else { } else {
return name === '' && type !== ''; return !!(name === '' && type);
} }
}; };
@ -89,8 +91,9 @@ class NewDataSourcePage extends PureComponent<Props, State> {
/> />
</div> </div>
<div className="gf-form-button-row"> <div className="gf-form-button-row">
<button type="submit" className="btn btn-success" disabled={this.isFieldsEmpty()}> <button type="submit" className="btn btn-success width-7" disabled={this.isFieldsEmpty()}>
Create <i className="fa fa-save" />
{` Create`}
</button> </button>
<button className="btn btn-danger">Cancel</button> <button className="btn btn-danger">Cancel</button>
</div> </div>
@ -107,4 +110,8 @@ function mapStateToProps(state) {
}; };
} }
export default hot(module)(connect(mapStateToProps)(NewDataSourcePage)); const mapDispatchToProps = {
addDataSource,
};
export default hot(module)(connect(mapStateToProps, mapDispatchToProps)(NewDataSourcePage));

6
public/app/features/datasources/state/actions.ts
View File

@ -49,3 +49,9 @@ export function loadDataSources(): ThunkResult<void> {
dispatch(dataSourcesLoaded(response)); dispatch(dataSourcesLoaded(response));
}; };
} }
export function addDataSource(name: string, type: string): ThunkResult<void> {
return async dispatch => {
await getBackendSrv().post('/api/datasources', { name, type });
};
}