mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
chore(76107): Remove legacy form from InfluxConfigEditor (#76382)
Remove legacy form from InfluxConfigEditor With this commit, legacy form components are remvoed from influxdb config eidtor page. Form is now using FieldSet instead.
This commit is contained in:
parent
cb1dfbeeb4
commit
2442532f57
@ -8,7 +8,7 @@ import {
|
||||
updateDatasourcePluginJsonDataOption,
|
||||
updateDatasourcePluginResetOption,
|
||||
} from '@grafana/data/src';
|
||||
import { Alert, DataSourceHttpSettings, InlineField, LegacyForms, Select } from '@grafana/ui/src';
|
||||
import { Alert, DataSourceHttpSettings, InlineField, Select, Field, Input, FieldSet } from '@grafana/ui/src';
|
||||
import { config } from 'app/core/config';
|
||||
|
||||
import { BROWSER_MODE_DISABLED_MESSAGE } from '../../../constants';
|
||||
@ -18,8 +18,6 @@ import { InfluxFluxConfig } from './InfluxFluxConfig';
|
||||
import { InfluxInfluxQLConfig } from './InfluxInfluxQLConfig';
|
||||
import { InfluxSqlConfig } from './InfluxSQLConfig';
|
||||
|
||||
const { Input } = LegacyForms;
|
||||
|
||||
const versions: Array<SelectableValue<InfluxVersion>> = [
|
||||
{
|
||||
label: 'InfluxQL',
|
||||
@ -132,21 +130,19 @@ export class ConfigEditor extends PureComponent<Props, State> {
|
||||
|
||||
return (
|
||||
<>
|
||||
<h3 className="page-heading">Query Language</h3>
|
||||
<div className="gf-form-group">
|
||||
<div className="gf-form-inline">
|
||||
<div className="gf-form">
|
||||
<Select
|
||||
aria-label="Query language"
|
||||
className="width-30"
|
||||
value={this.getQueryLanguageDropdownValue(options.jsonData.version)}
|
||||
options={config.featureToggles.influxdbSqlSupport ? versionsWithSQL : versions}
|
||||
defaultValue={versions[0]}
|
||||
onChange={this.onVersionChanged}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<FieldSet>
|
||||
<h3 className="page-heading">Query language</h3>
|
||||
<Field>
|
||||
<Select
|
||||
aria-label="Query language"
|
||||
className="width-30"
|
||||
value={this.getQueryLanguageDropdownValue(options.jsonData.version)}
|
||||
options={config.featureToggles.influxdbSqlSupport ? versionsWithSQL : versions}
|
||||
defaultValue={versions[0]}
|
||||
onChange={this.onVersionChanged}
|
||||
/>
|
||||
</Field>
|
||||
</FieldSet>
|
||||
|
||||
{options.jsonData.version !== InfluxVersion.InfluxQL && (
|
||||
<Alert severity="info" title={this.versionNotice[options.jsonData.version!]}>
|
||||
@ -172,34 +168,29 @@ export class ConfigEditor extends PureComponent<Props, State> {
|
||||
onChange={onOptionsChange}
|
||||
secureSocksDSProxyEnabled={config.secureSocksDSProxyEnabled}
|
||||
/>
|
||||
|
||||
<div className="gf-form-group">
|
||||
<div>
|
||||
<h3 className="page-heading">InfluxDB Details</h3>
|
||||
</div>
|
||||
<FieldSet>
|
||||
<h3 className="page-heading">InfluxDB Details</h3>
|
||||
{this.renderJsonDataOptions()}
|
||||
<div className="gf-form-inline">
|
||||
<InlineField
|
||||
labelWidth={20}
|
||||
label="Max series"
|
||||
tooltip="Limit the number of series/tables that Grafana will process. Lower this number to prevent abuse, and increase it if you have lots of small time series and not all are shown. Defaults to 1000."
|
||||
>
|
||||
<Input
|
||||
placeholder="1000"
|
||||
type="number"
|
||||
className="width-20"
|
||||
value={this.state.maxSeries}
|
||||
onChange={(event) => {
|
||||
// We duplicate this state so that we allow to write freely inside the input. We don't have
|
||||
// any influence over saving so this seems to be only way to do this.
|
||||
this.setState({ maxSeries: event.currentTarget.value });
|
||||
const val = parseInt(event.currentTarget.value, 10);
|
||||
updateDatasourcePluginJsonDataOption(this.props, 'maxSeries', Number.isFinite(val) ? val : undefined);
|
||||
}}
|
||||
/>
|
||||
</InlineField>
|
||||
</div>
|
||||
</div>
|
||||
<InlineField
|
||||
labelWidth={20}
|
||||
label="Max series"
|
||||
tooltip="Limit the number of series/tables that Grafana will process. Lower this number to prevent abuse, and increase it if you have lots of small time series and not all are shown. Defaults to 1000."
|
||||
>
|
||||
<Input
|
||||
placeholder="1000"
|
||||
type="number"
|
||||
className="width-20"
|
||||
value={this.state.maxSeries}
|
||||
onChange={(event: { currentTarget: { value: string } }) => {
|
||||
// We duplicate this state so that we allow to write freely inside the input. We don't have
|
||||
// any influence over saving so this seems to be only way to do this.
|
||||
this.setState({ maxSeries: event.currentTarget.value });
|
||||
const val = parseInt(event.currentTarget.value, 10);
|
||||
updateDatasourcePluginJsonDataOption(this.props, 'maxSeries', Number.isFinite(val) ? val : undefined);
|
||||
}}
|
||||
/>
|
||||
</InlineField>
|
||||
</FieldSet>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user