diff --git a/public/app/features/folders/FolderSettingsPage.tsx b/public/app/features/folders/FolderSettingsPage.tsx index 1eb7ccafc65..08bc84775dc 100644 --- a/public/app/features/folders/FolderSettingsPage.tsx +++ b/public/app/features/folders/FolderSettingsPage.tsx @@ -1,7 +1,7 @@ import React, { PureComponent } from 'react'; import { hot } from 'react-hot-loader'; import { connect } from 'react-redux'; -import PageHeader from 'app/core/components/PageHeader/PageHeader'; +import Page from 'app/core/components/Page/Page'; import appEvents from 'app/core/app_events'; import { getNavModel } from 'app/core/selectors/navModel'; import { NavModel, StoreState, FolderState } from 'app/types'; @@ -18,23 +18,35 @@ export interface Props { deleteFolder: typeof deleteFolder; } -export class FolderSettingsPage extends PureComponent { +export interface State { + isLoading: boolean; +} + +export class FolderSettingsPage extends PureComponent { + constructor(props: Props) { + super(props); + this.state = { + isLoading: false + }; + } + componentDidMount() { this.props.getFolderByUid(this.props.folderUid); } - onTitleChange = evt => { + onTitleChange = (evt: React.ChangeEvent) => { this.props.setFolderTitle(evt.target.value); }; - onSave = async evt => { + onSave = async (evt: React.FormEvent) => { evt.preventDefault(); evt.stopPropagation(); - + this.setState({isLoading: true}); await this.props.saveFolder(this.props.folder); + this.setState({isLoading: false}); }; - onDelete = evt => { + onDelete = (evt: React.MouseEvent) => { evt.stopPropagation(); evt.preventDefault(); @@ -53,34 +65,35 @@ export class FolderSettingsPage extends PureComponent { const { navModel, folder } = this.props; return ( -
- -
-

Folder Settings

+ + +
+

Folder Settings

-
-
-
- - -
-
- - -
- +
+
+
+ + +
+
+ + +
+ +
-
-
+ + ); } } diff --git a/public/app/features/folders/__snapshots__/FolderSettingsPage.test.tsx.snap b/public/app/features/folders/__snapshots__/FolderSettingsPage.test.tsx.snap index 2de0c193d27..9ffd87e13d5 100644 --- a/public/app/features/folders/__snapshots__/FolderSettingsPage.test.tsx.snap +++ b/public/app/features/folders/__snapshots__/FolderSettingsPage.test.tsx.snap @@ -1,131 +1,137 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Render should enable save button 1`] = ` -
- -
+ -

- Folder Settings -

-
-
+
+ - - -
-
- - -
- + + +
+ +
-
-
+ + `; exports[`Render should render component 1`] = ` -
- -
+ -

- Folder Settings -

-
-
+
+ - - -
-
- - -
- + + +
+ +
-
- + + `;