mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
chore(76107): Removed LegacyForm from FolderSettingsPage (#76313)
chore: Removed LegacyForm from FolderSettingsPage
This commit is contained in:
parent
6749421bf2
commit
a0ec0baef3
@ -1,8 +1,7 @@
|
|||||||
import React, { PureComponent } from 'react';
|
import React, { PureComponent } from 'react';
|
||||||
import { connect, ConnectedProps } from 'react-redux';
|
import { connect, ConnectedProps } from 'react-redux';
|
||||||
|
|
||||||
import { Button, LegacyForms } from '@grafana/ui';
|
import { Field, Form, Button, Input, InputControl } from '@grafana/ui';
|
||||||
const { Input } = LegacyForms;
|
|
||||||
import appEvents from 'app/core/app_events';
|
import appEvents from 'app/core/app_events';
|
||||||
import { Page } from 'app/core/components/Page/Page';
|
import { Page } from 'app/core/components/Page/Page';
|
||||||
import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
|
import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
|
||||||
@ -57,11 +56,9 @@ export class FolderSettingsPage extends PureComponent<Props, State> {
|
|||||||
this.props.setFolderTitle(evt.target.value);
|
this.props.setFolderTitle(evt.target.value);
|
||||||
};
|
};
|
||||||
|
|
||||||
onSave = async (evt: React.FormEvent<HTMLFormElement>) => {
|
onSave = () => {
|
||||||
evt.preventDefault();
|
|
||||||
evt.stopPropagation();
|
|
||||||
this.setState({ isLoading: true });
|
this.setState({ isLoading: true });
|
||||||
await this.props.saveFolder(this.props.folder);
|
this.props.saveFolder(this.props.folder);
|
||||||
this.setState({ isLoading: false });
|
this.setState({ isLoading: false });
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -90,21 +87,18 @@ export class FolderSettingsPage extends PureComponent<Props, State> {
|
|||||||
<Page navId="dashboards/browse" pageNav={pageNav.main}>
|
<Page navId="dashboards/browse" pageNav={pageNav.main}>
|
||||||
<Page.Contents isLoading={this.state.isLoading}>
|
<Page.Contents isLoading={this.state.isLoading}>
|
||||||
<h3 className="page-sub-heading">Folder settings</h3>
|
<h3 className="page-sub-heading">Folder settings</h3>
|
||||||
|
<Form name="folderSettingsForm" onSubmit={this.onSave}>
|
||||||
<div className="section gf-form-group">
|
{({ control, errors }) => (
|
||||||
<form name="folderSettingsForm" onSubmit={this.onSave}>
|
<>
|
||||||
<div className="gf-form">
|
<InputControl
|
||||||
<label htmlFor="folder-title" className="gf-form-label width-7">
|
render={({ field: { ref, ...field } }) => (
|
||||||
Name
|
<Field label="Title" invalid={!!errors.title} error={errors.title?.message}>
|
||||||
</label>
|
<Input {...field} autoFocus onChange={this.onTitleChange} value={folder.title} />
|
||||||
<Input
|
</Field>
|
||||||
type="text"
|
)}
|
||||||
className="gf-form-input width-30"
|
control={control}
|
||||||
id="folder-title"
|
name="title"
|
||||||
value={folder.title}
|
|
||||||
onChange={this.onTitleChange}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
<div className="gf-form-button-row">
|
<div className="gf-form-button-row">
|
||||||
<Button type="submit" disabled={!folder.canSave || !folder.hasChanged}>
|
<Button type="submit" disabled={!folder.canSave || !folder.hasChanged}>
|
||||||
Save
|
Save
|
||||||
@ -113,8 +107,9 @@ export class FolderSettingsPage extends PureComponent<Props, State> {
|
|||||||
Delete
|
Delete
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</>
|
||||||
</div>
|
)}
|
||||||
|
</Form>
|
||||||
</Page.Contents>
|
</Page.Contents>
|
||||||
</Page>
|
</Page>
|
||||||
);
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user