apitech
/
grafana
mirror of https://github.com/grafana/grafana
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

chore: Fix typings and add Page-component to DataSourceSettingsPage #14762

Browse Source
pull/15103/head
Johannes Schill 6 years ago
parent 3372dc9441
commit 98fa17f0e4
2 changed files with 397 additions and 386 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 30
      public/app/features/datasources/settings/DataSourceSettingsPage.tsx
  2. 753
      public/app/features/datasources/settings/__snapshots__/DataSourceSettingsPage.test.tsx.snap

30
public/app/features/datasources/settings/DataSourceSettingsPage.tsx
Unescape View File

@ -4,8 +4,7 @@ import { hot } from 'react-hot-loader';
import { connect } from 'react-redux';
// Components
import PageHeader from 'app/core/components/PageHeader/PageHeader';
import PageLoader from 'app/core/components/PageLoader/PageLoader';
import Page from 'app/core/components/Page/Page';
import PluginSettings from './PluginSettings';
import BasicSettings from './BasicSettings';
import ButtonRow from './ButtonRow';
@ -51,7 +50,7 @@ enum DataSourceStates {
}
export class DataSourceSettingsPage extends PureComponent<Props, State> {
constructor(props) {
constructor(props: Props) {
super(props);
this.state = {
@ -65,8 +64,8 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
await loadDataSource(pageId);
}
onSubmit = async event => {
event.preventDefault();
onSubmit = async (evt: React.FormEvent<HTMLFormElement>) => {
evt.preventDefault();
await this.props.updateDataSource({ ...this.state.dataSource, name: this.props.dataSource.name });
@ -89,7 +88,7 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
this.props.deleteDataSource();
};
onModelChange = dataSource => {
onModelChange = (dataSource: DataSourceSettings) => {
this.setState({
dataSource: dataSource,
});
@ -170,17 +169,18 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
});
}
get hasDataSource() {
return Object.keys(this.props.dataSource).length > 0;
}
render() {
const { dataSource, dataSourceMeta, navModel, setDataSourceName, setIsDefault } = this.props;
const { testingMessage, testingStatus } = this.state;
return (
<div>
<PageHeader model={navModel} />
{Object.keys(dataSource).length === 0 ? (
<PageLoader pageName="Data source settings" />
) : (
<div className="page-container page-body">
<Page navModel={navModel}>
<Page.Contents isLoading={!this.hasDataSource}>
{this.hasDataSource && <div className="page-container page-body">
<div>
<form onSubmit={this.onSubmit}>
{this.isReadOnly() && this.renderIsReadOnlyMessage()}
@ -225,9 +225,9 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
/>
</form>
</div>
</div>
)}
</div>
</div>}
</Page.Contents>
</Page>
);
}
}

753
public/app/features/datasources/settings/__snapshots__/DataSourceSettingsPage.test.tsx.snap
Unescape View File

@ -1,415 +1,426 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Render should render alpha info text 1`] = `
<div>
<PageHeader
model={Object {}}
/>
<div
className="page-container page-body"
<Page
navModel={Object {}}
>
<PageContents
isLoading={false}
>
<div>
<form
onSubmit={[Function]}
>
<div
className="grafana-info-box"
<div
className="page-container page-body"
>
<div>
<form
onSubmit={[Function]}
>
This plugin is marked as being in alpha state, which means it is in early development phase and updates will include breaking changes.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
<div
className="grafana-info-box"
>
This plugin is marked as being in alpha state, which means it is in early development phase and updates will include breaking changes.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
"screenshots": Array [
Object {
"path": "screenshot",
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "alpha",
"type": "",
"screenshots": Array [
Object {
"path": "screenshot",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "alpha",
"type": "",
}
}
}
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
</div>
</div>
</div>
</div>
</PageContents>
</Page>
`;
exports[`Render should render beta info text 1`] = `
<div>
<PageHeader
model={Object {}}
/>
<div
className="page-container page-body"
<Page
navModel={Object {}}
>
<PageContents
isLoading={false}
>
<div>
<form
onSubmit={[Function]}
>
<div
className="grafana-info-box"
<div
className="page-container page-body"
>
<div>
<form
onSubmit={[Function]}
>
This plugin is marked as being in a beta development state. This means it is in currently in active development and could be missing important features.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
<div
className="grafana-info-box"
>
This plugin is marked as being in a beta development state. This means it is in currently in active development and could be missing important features.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
"screenshots": Array [
Object {
"path": "screenshot",
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "beta",
"type": "",
"screenshots": Array [
Object {
"path": "screenshot",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "beta",
"type": "",
}
}
}
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
</div>
</div>
</div>
</div>
</PageContents>
</Page>
`;
exports[`Render should render component 1`] = `
<div>
<PageHeader
model={Object {}}
/>
<div
className="page-container page-body"
<Page
navModel={Object {}}
>
<PageContents
isLoading={false}
>
<div>
<form
onSubmit={[Function]}
>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
<div
className="page-container page-body"
>
<div>
<form
onSubmit={[Function]}
>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": false,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
"screenshots": Array [
Object {
"path": "screenshot",
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "",
"type": "",
"screenshots": Array [
Object {
"path": "screenshot",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "",
"type": "",
}
}
}
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={false}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
</div>
</div>
</div>
</div>
</PageContents>
</Page>
`;
exports[`Render should render is ready only message 1`] = `
<div>
<PageHeader
model={Object {}}
/>
<div
className="page-container page-body"
<Page
navModel={Object {}}
>
<PageContents
isLoading={false}
>
<div>
<form
onSubmit={[Function]}
>
<div
className="grafana-info-box span8"
<div
className="page-container page-body"
>
<div>
<form
onSubmit={[Function]}
>
This datasource was added by config and cannot be modified using the UI. Please contact your server admin to update this datasource.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": true,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
<div
className="grafana-info-box span8"
>
This datasource was added by config and cannot be modified using the UI. Please contact your server admin to update this datasource.
</div>
<BasicSettings
dataSourceName="gdev-cloudwatch"
isDefault={false}
onDefaultChange={[Function]}
onNameChange={[Function]}
/>
<PluginSettings
dataSource={
Object {
"access": "",
"basicAuth": false,
"basicAuthPassword": "",
"basicAuthUser": "",
"database": "",
"id": 13,
"isDefault": false,
"jsonData": Object {
"authType": "credentials",
"defaultRegion": "eu-west-2",
},
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
"name": "gdev-cloudwatch",
"orgId": 1,
"password": "",
"readOnly": true,
"type": "cloudwatch",
"typeLogoUrl": "public/app/plugins/datasource/cloudwatch/img/amazon-web-services.png",
"url": "",
"user": "",
"withCredentials": false,
}
}
dataSourceMeta={
Object {
"defaultNavUrl": "some/url",
"enabled": false,
"hasUpdate": false,
"id": "1",
"info": Object {
"author": Object {
"name": "Grafana Labs",
"url": "url/to/GrafanaLabs",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
"screenshots": Array [
Object {
"path": "screenshot",
"description": "pretty decent plugin",
"links": Array [
Object {
"name": "project",
"url": "one link",
},
],
"logos": Object {
"large": "large/logo",
"small": "small/logo",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "",
"type": "",
"screenshots": Array [
Object {
"path": "screenshot",
},
],
"updated": "2018-09-26",
"version": "1",
},
"latestVersion": "1",
"module": Object {},
"name": "pretty cool plugin 1",
"pinned": false,
"state": "",
"type": "",
}
}
}
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={true}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
onModelChange={[Function]}
/>
<div
className="gf-form-group section"
/>
<ButtonRow
isReadOnly={true}
onDelete={[Function]}
onSubmit={[Function]}
/>
</form>
</div>
</div>
</div>
</div>
</PageContents>
</Page>
`;
exports[`Render should render loader 1`] = `
<div>
<PageHeader
model={Object {}}
/>
<PageLoader
pageName="Data source settings"
<Page
navModel={Object {}}
>
<PageContents
isLoading={true}
/>
</div>
</Page>
`;

Write Preview
Loading…
Cancel
Save