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

Navigation: Use navId and pageNav for Create User page (#55201)

Browse Source 
* added pageNav subttitle and used navid for usercreatepage

* improve subtitle copy and redirected to user page after creation

* improve title copy

* improve copies

* breadcrumbs redirect to users page instead of org
This commit is contained in:
Leo 2022-09-16 09:16:26 +02:00 committed by GitHub
parent 26e444c194
commit 3f413f6f94
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
public/app/features/admin/UserCreatePage.tsx
View File

@ -1,18 +1,11 @@
import React, { useCallback } from 'react'; import React, { useCallback } from 'react';
import { connect } from 'react-redux';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { NavModel } from '@grafana/data'; import { NavModelItem } from '@grafana/data';
import { getBackendSrv } from '@grafana/runtime'; import { getBackendSrv } from '@grafana/runtime';
import { Form, Button, Input, Field } from '@grafana/ui'; import { Form, Button, Input, Field } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page'; import { Page } from 'app/core/components/Page/Page';
import { getNavModel } from '../../core/selectors/navModel';
import { StoreState } from '../../types';
interface UserCreatePageProps {
navModel: NavModel;
}
interface UserDTO { interface UserDTO {
name: string; name: string;
password: string; password: string;
@ -22,21 +15,29 @@ interface UserDTO {
const createUser = async (user: UserDTO) => getBackendSrv().post('/api/admin/users', user); const createUser = async (user: UserDTO) => getBackendSrv().post('/api/admin/users', user);
const UserCreatePage: React.FC<UserCreatePageProps> = ({ navModel }) => { const pageNav: NavModelItem = {
icon: 'user',
id: 'user-new',
text: 'New user',
subTitle: 'Create a new Grafana user.',
breadcrumbs: [{ title: 'Server admin', url: 'admin/users' }],
};
const UserCreatePage: React.FC = () => {
const history = useHistory(); const history = useHistory();
const onSubmit = useCallback( const onSubmit = useCallback(
async (data: UserDTO) => { async (data: UserDTO) => {
await createUser(data); const { id } = await createUser(data);
history.push('/admin/users');
history.push(`/admin/users/edit/${id}`);
}, },
[history] [history]
); );
return ( return (
<Page navModel={navModel}> <Page navId="global-users" pageNav={pageNav}>
<Page.Contents> <Page.Contents>
<h1>Add new user</h1>
<Form onSubmit={onSubmit} validateOn="onBlur"> <Form onSubmit={onSubmit} validateOn="onBlur">
{({ register, errors }) => { {({ register, errors }) => {
return ( return (
@ -81,8 +82,4 @@ const UserCreatePage: React.FC<UserCreatePageProps> = ({ navModel }) => {
); );
}; };
const mapStateToProps = (state: StoreState) => ({ export default UserCreatePage;
navModel: getNavModel(state.navIndex, 'global-users'),
});
export default connect(mapStateToProps)(UserCreatePage);