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

chore(76107): Removed LegacyForm from FolderSettingsPage (#76313)

Browse Source 
chore: Removed LegacyForm from FolderSettingsPage
This commit is contained in:
Carl Tablante 2023-10-20 16:30:00 +11:00 committed by GitHub
parent 6749421bf2
commit a0ec0baef3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
public/app/features/folders/FolderSettingsPage.tsx
View File

@ -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,31 +87,29 @@ 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 </Button>
</Button> <Button variant="destructive" onClick={this.onDelete} disabled={!folder.canDelete}>
<Button variant="destructive" onClick={this.onDelete} disabled={!folder.canDelete}> Delete
Delete </Button>
</Button> </div>
</div> </>
</form> )}
</div> </Form>
</Page.Contents> </Page.Contents>
</Page> </Page>
); );