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: Replace Form usage in LoginForm.tsx (#81326)

Browse Source
This commit is contained in:
Alex Khomenko 2024-01-26 13:04:44 +01:00 committed by GitHub
parent 3c4cfb1a70
commit 857bce25e6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 36 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
public/app/core/components/Login/LoginForm.tsx
View File

@ -1,9 +1,10 @@
import { css } from '@emotion/css';
import React, { ReactElement, useId } from 'react';
import { useForm } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { Button, Form, Input, Field, useStyles2 } from '@grafana/ui';
import { Button, Input, Field, useStyles2 } from '@grafana/ui';
import { PasswordField } from '../PasswordField/PasswordField';
@ -21,12 +22,15 @@ export const LoginForm = ({ children, onSubmit, isLoggingIn, passwordHint, login
const styles = useStyles2(getStyles);
const usernameId = useId();
const passwordId = useId();
const {
handleSubmit,
register,
formState: { errors },
} = useForm<FormModel>({ mode: 'onChange' });
return (
<div className={styles.wrapper}>
<Form onSubmit={onSubmit} validateOn="onChange">
{({ register, errors }) => (
<>
<form onSubmit={handleSubmit(onSubmit)}>
<Field label="Email or username" invalid={!!errors.user} error={errors.user?.message}>
<Input
{...register('user', { required: 'Email or username is required' })}
@ -54,9 +58,7 @@ export const LoginForm = ({ children, onSubmit, isLoggingIn, passwordHint, login
{isLoggingIn ? 'Logging in...' : 'Log in'}
</Button>
{children}
</>
)}
</Form>
</form>
</div>
);
};