Skip to content

N
nexpie-grafana-theme
Commit bc8418ad by Torkel Ödegaard
Options

Merge branch 'master' of github.com:grafana/grafana

parents 342aa0ad 38a74c64
Showing with 71 additions and 44 deletions
public/app/features/datasources/settings/ButtonRow.test.tsx
...@@ -7,6 +7,7 @@ const setup = (propOverrides?: object) => { ...@@ -7,6 +7,7 @@ const setup = (propOverrides?: object) => {
isReadOnly: true, isReadOnly: true,
onSubmit: jest.fn(), onSubmit: jest.fn(),
onDelete: jest.fn(), onDelete: jest.fn(),
onTest: jest.fn(),
}; };
Object.assign(props, propOverrides); Object.assign(props, propOverrides);
......
public/app/features/datasources/settings/ButtonRow.tsx
...@@ -4,14 +4,20 @@ export interface Props { ...@@ -4,14 +4,20 @@ export interface Props {
isReadOnly: boolean; isReadOnly: boolean;
onDelete: () => void; onDelete: () => void;
onSubmit: (event) => void; onSubmit: (event) => void;
onTest: (event) => void;
} }
const ButtonRow: FC<Props> = ({ isReadOnly, onDelete, onSubmit }) => { const ButtonRow: FC<Props> = ({ isReadOnly, onDelete, onSubmit, onTest }) => {
return ( return (
<div className="gf-form-button-row"> <div className="gf-form-button-row">
<button type="submit" className="btn btn-primary" disabled={isReadOnly} onClick={event => onSubmit(event)}> <button type="submit" className="btn btn-primary" disabled={isReadOnly} onClick={event => onSubmit(event)}>
Save &amp; Test Save &amp; Test
</button> </button>
{isReadOnly && (
<button type="submit" className="btn btn-success" onClick={onTest}>
Test
</button>
)}
<button type="submit" className="btn btn-danger" disabled={isReadOnly} onClick={onDelete}> <button type="submit" className="btn btn-danger" disabled={isReadOnly} onClick={onDelete}>
Delete Delete
</button> </button>
......
public/app/features/datasources/settings/DataSourceSettingsPage.tsx
...@@ -72,6 +72,12 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> { ...@@ -72,6 +72,12 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
this.testDataSource(); this.testDataSource();
}; };
onTest = async (evt: React.FormEvent<HTMLFormElement>) => {
evt.preventDefault();
this.testDataSource();
};
onDelete = () => { onDelete = () => {
appEvents.emit('confirm-modal', { appEvents.emit('confirm-modal', {
title: 'Delete', title: 'Delete',
...@@ -180,52 +186,55 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> { ...@@ -180,52 +186,55 @@ export class DataSourceSettingsPage extends PureComponent<Props, State> {
return ( return (
<Page navModel={navModel}> <Page navModel={navModel}>
<Page.Contents isLoading={!this.hasDataSource}> <Page.Contents isLoading={!this.hasDataSource}>
{this.hasDataSource && <div className="page-container page-body"> {this.hasDataSource && (
<div> <div className="page-container page-body">
<form onSubmit={this.onSubmit}> <div>
{this.isReadOnly() && this.renderIsReadOnlyMessage()} <form onSubmit={this.onSubmit}>
{this.shouldRenderInfoBox() && <div className="grafana-info-box">{this.getInfoText()}</div>} {this.isReadOnly() && this.renderIsReadOnlyMessage()}
{this.shouldRenderInfoBox() && <div className="grafana-info-box">{this.getInfoText()}</div>}
<BasicSettings
dataSourceName={dataSource.name} <BasicSettings
isDefault={dataSource.isDefault} dataSourceName={dataSource.name}
onDefaultChange={state => setIsDefault(state)} isDefault={dataSource.isDefault}
onNameChange={name => setDataSourceName(name)} onDefaultChange={state => setIsDefault(state)}
/> onNameChange={name => setDataSourceName(name)}
{dataSourceMeta.module && (
<PluginSettings
dataSource={dataSource}
dataSourceMeta={dataSourceMeta}
onModelChange={this.onModelChange}
/> />
)}
{dataSourceMeta.module && (
<div className="gf-form-group section"> <PluginSettings
{testingMessage && ( dataSource={dataSource}
<div className={`alert-${testingStatus} alert`}> dataSourceMeta={dataSourceMeta}
<div className="alert-icon"> onModelChange={this.onModelChange}
{testingStatus === 'error' ? ( />
<i className="fa fa-exclamation-triangle" />
) : (
<i className="fa fa-check" />
)}
</div>
<div className="alert-body">
<div className="alert-title">{testingMessage}</div>
</div>
</div>
)} )}
</div>
<div className="gf-form-group section">
<ButtonRow {testingMessage && (
onSubmit={event => this.onSubmit(event)} <div className={`alert-${testingStatus} alert`}>
isReadOnly={this.isReadOnly()} <div className="alert-icon">
onDelete={this.onDelete} {testingStatus === 'error' ? (
/> <i className="fa fa-exclamation-triangle" />
</form> ) : (
<i className="fa fa-check" />
)}
</div>
<div className="alert-body">
<div className="alert-title">{testingMessage}</div>
</div>
</div>
)}
</div>
<ButtonRow
onSubmit={event => this.onSubmit(event)}
isReadOnly={this.isReadOnly()}
onDelete={this.onDelete}
onTest={event => this.onTest(event)}
/>
</form>
</div>
</div> </div>
</div>} )}
</Page.Contents> </Page.Contents>
</Page> </Page>
); );
......
public/app/features/datasources/settings/__snapshots__/ButtonRow.test.tsx.snap
...@@ -13,6 +13,13 @@ exports[`Render should render component 1`] = ` ...@@ -13,6 +13,13 @@ exports[`Render should render component 1`] = `
Save & Test Save & Test
</button> </button>
<button <button
className="btn btn-success"
onClick={[MockFunction]}
type="submit"
>
Test
</button>
<button
className="btn btn-danger" className="btn btn-danger"
disabled={true} disabled={true}
onClick={[MockFunction]} onClick={[MockFunction]}
......
public/app/features/datasources/settings/__snapshots__/DataSourceSettingsPage.test.tsx.snap
...@@ -97,6 +97,7 @@ exports[`Render should render alpha info text 1`] = ` ...@@ -97,6 +97,7 @@ exports[`Render should render alpha info text 1`] = `
isReadOnly={false} isReadOnly={false}
onDelete={[Function]} onDelete={[Function]}
onSubmit={[Function]} onSubmit={[Function]}
onTest={[Function]}
/> />
</form> </form>
</div> </div>
...@@ -202,6 +203,7 @@ exports[`Render should render beta info text 1`] = ` ...@@ -202,6 +203,7 @@ exports[`Render should render beta info text 1`] = `
isReadOnly={false} isReadOnly={false}
onDelete={[Function]} onDelete={[Function]}
onSubmit={[Function]} onSubmit={[Function]}
onTest={[Function]}
/> />
</form> </form>
</div> </div>
...@@ -302,6 +304,7 @@ exports[`Render should render component 1`] = ` ...@@ -302,6 +304,7 @@ exports[`Render should render component 1`] = `
isReadOnly={false} isReadOnly={false}
onDelete={[Function]} onDelete={[Function]}
onSubmit={[Function]} onSubmit={[Function]}
onTest={[Function]}
/> />
</form> </form>
</div> </div>
...@@ -407,6 +410,7 @@ exports[`Render should render is ready only message 1`] = ` ...@@ -407,6 +410,7 @@ exports[`Render should render is ready only message 1`] = `
isReadOnly={true} isReadOnly={true}
onDelete={[Function]} onDelete={[Function]}
onSubmit={[Function]} onSubmit={[Function]}
onTest={[Function]}
/> />
</form> </form>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment