apitech
/
Rocket.Chat
mirror of https://github.com/RocketChat/Rocket.Chat
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

[FIX] Fix Login with Show default form disabled (#27475)

Browse Source
pull/27565/head
Guilherme Gazzo 3 years ago committed by Guilherme Gazzo
parent f4ad966d09
commit 7c227aace0
3 changed files with 109 additions and 103 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 203
      packages/web-ui-registration/src/LoginForm.tsx
  2. 5
      packages/web-ui-registration/src/LoginServices.tsx
  3. 4
      packages/web-ui-registration/src/RegistrationPageRouter.tsx

203
packages/web-ui-registration/src/LoginForm.tsx
Unescape View File

@ -43,6 +43,7 @@ export const LoginForm = ({ setLoginRoute }: { setLoginRoute: DispatchLoginRoute
const [errorOnSubmit, setErrorOnSubmit] = useState<LoginErrors | undefined>(undefined);
const isResetPasswordAllowed = useSetting('Accounts_PasswordReset');
const login = useLoginWithPassword();
const showFormLogin = useSetting('Accounts_ShowFormLogin');
const loginMutation: UseMutationResult<
void,
@ -95,104 +96,110 @@ export const LoginForm = ({ setLoginRoute }: { setLoginRoute: DispatchLoginRoute
<Form.Header>
<Form.Title id={formLabelId}>{t('registration.component.login')}</Form.Title>
</Form.Header>
<Form.Container>
<FieldGroup disabled={loginMutation.isLoading}>
<Field>
<Field.Label htmlFor='username'>{t('registration.component.form.emailOrUsername')}</Field.Label>
<Field.Row>
<TextInput
{...register('username', {
required: true,
onChange: () => {
clearErrors(['username', 'password']);
},
})}
placeholder={t('registration.component.form.emailPlaceholder')}
error={
errors.username?.message ||
(errors.username?.type === 'required' ? t('registration.component.form.requiredField') : undefined)
}
aria-invalid={errors.username ? 'true' : 'false'}
id='username'
/>
</Field.Row>
{errors.username && errors.username.type === 'required' && (
<Field.Error>{t('registration.component.form.requiredField')}</Field.Error>
)}
</Field>
<Field>
<Field.Label htmlFor='password'>{t('registration.component.form.password')}</Field.Label>
<Field.Row>
<PasswordInput
{...register('password', {
required: true,
onChange: () => {
clearErrors(['username', 'password']);
},
})}
error={
errors.password?.message ||
(errors.password?.type === 'required' ? t('registration.component.form.requiredField') : undefined)
}
aria-invalid={errors.password ? 'true' : 'false'}
id='password'
/>
</Field.Row>
{errors.password && errors.password.type === 'required' && (
<Field.Error>{t('registration.component.form.requiredField')}</Field.Error>
)}
{isResetPasswordAllowed && (
<Field.Row justifyContent='end'>
<Field.Link
href='#'
onClick={(e): void => {
e.preventDefault();
setLoginRoute('reset-password');
}}
>
<Trans i18nKey='registration.page.login.forgot'>Forgot your password?</Trans>
</Field.Link>
</Field.Row>
)}
</Field>
</FieldGroup>
<FieldGroup disabled={loginMutation.isLoading}>
{errorOnSubmit === 'error-user-is-not-activated' && (
<Callout type='warning'>{t('registration.page.registration.waitActivationWarning')}</Callout>
)}
{errorOnSubmit === 'error-app-user-is-not-allowed-to-login' && (
<Callout type='danger'>{t('registration.page.login.errors.AppUserNotAllowedToLogin')}</Callout>
)}
{errorOnSubmit === 'user-not-found' && <Callout type='danger'>{t('registration.page.login.errors.wrongCredentials')}</Callout>}
{errorOnSubmit === 'error-login-blocked-for-ip' && (
<Callout type='danger'>{t('registration.page.login.errors.loginBlockedForIp')}</Callout>
)}
{errorOnSubmit === 'error-login-blocked-for-user' && (
<Callout type='danger'>{t('registration.page.login.errors.loginBlockedForUser')}</Callout>
)}
{errorOnSubmit === 'error-license-user-limit-reached' && (
<Callout type='warning'>{t('registration.page.login.errors.licenseUserLimitReached')}</Callout>
)}
</FieldGroup>
</Form.Container>
<Form.Footer>
<ButtonGroup stretch>
<Button disabled={loginMutation.isLoading} type='submit' primary>
{t('registration.component.login')}
</Button>
</ButtonGroup>
<p>
<Trans i18nKey='registration.page.login.register'>
New here? <ActionLink onClick={(): void => setLoginRoute('register')}>Create an account</ActionLink>
</Trans>
</p>
</Form.Footer>
{showFormLogin && (
<>
<Form.Container>
<FieldGroup disabled={loginMutation.isLoading}>
<Field>
<Field.Label htmlFor='username'>{t('registration.component.form.emailOrUsername')}</Field.Label>
<Field.Row>
<TextInput
{...register('username', {
required: true,
onChange: () => {
clearErrors(['username', 'password']);
},
})}
placeholder={t('registration.component.form.emailPlaceholder')}
error={
errors.username?.message ||
(errors.username?.type === 'required' ? t('registration.component.form.requiredField') : undefined)
}
aria-invalid={errors.username ? 'true' : 'false'}
id='username'
/>
</Field.Row>
{errors.username && errors.username.type === 'required' && (
<Field.Error>{t('registration.component.form.requiredField')}</Field.Error>
)}
</Field>
<Field>
<Field.Label htmlFor='password'>{t('registration.component.form.password')}</Field.Label>
<Field.Row>
<PasswordInput
{...register('password', {
required: true,
onChange: () => {
clearErrors(['username', 'password']);
},
})}
error={
errors.password?.message ||
(errors.password?.type === 'required' ? t('registration.component.form.requiredField') : undefined)
}
aria-invalid={errors.password ? 'true' : 'false'}
id='password'
/>
</Field.Row>
{errors.password && errors.password.type === 'required' && (
<Field.Error>{t('registration.component.form.requiredField')}</Field.Error>
)}
{isResetPasswordAllowed && (
<Field.Row justifyContent='end'>
<Field.Link
href='#'
onClick={(e): void => {
e.preventDefault();
setLoginRoute('reset-password');
}}
>
<Trans i18nKey='registration.page.login.forgot'>Forgot your password?</Trans>
</Field.Link>
</Field.Row>
)}
</Field>
</FieldGroup>
<FieldGroup disabled={loginMutation.isLoading}>
{errorOnSubmit === 'error-user-is-not-activated' && (
<Callout type='warning'>{t('registration.page.registration.waitActivationWarning')}</Callout>
)}
{errorOnSubmit === 'error-app-user-is-not-allowed-to-login' && (
<Callout type='danger'>{t('registration.page.login.errors.AppUserNotAllowedToLogin')}</Callout>
)}
{errorOnSubmit === 'user-not-found' && (
<Callout type='danger'>{t('registration.page.login.errors.wrongCredentials')}</Callout>
)}
{errorOnSubmit === 'error-login-blocked-for-ip' && (
<Callout type='danger'>{t('registration.page.login.errors.loginBlockedForIp')}</Callout>
)}
{errorOnSubmit === 'error-login-blocked-for-user' && (
<Callout type='danger'>{t('registration.page.login.errors.loginBlockedForUser')}</Callout>
)}
{errorOnSubmit === 'error-license-user-limit-reached' && (
<Callout type='warning'>{t('registration.page.login.errors.licenseUserLimitReached')}</Callout>
)}
</FieldGroup>
</Form.Container>
<Form.Footer>
<ButtonGroup stretch>
<Button disabled={loginMutation.isLoading} type='submit' primary>
{t('registration.component.login')}
</Button>
</ButtonGroup>
<p>
<Trans i18nKey='registration.page.login.register'>
New here? <ActionLink onClick={(): void => setLoginRoute('register')}>Create an account</ActionLink>
</Trans>
</p>
</Form.Footer>
</>
)}
<LoginServices disabled={loginMutation.isLoading} />
</Form>
);

5
packages/web-ui-registration/src/LoginServices.tsx
Unescape View File

@ -1,5 +1,5 @@
import { ButtonGroup, Divider } from '@rocket.chat/fuselage';
import { useLoginServices } from '@rocket.chat/ui-contexts';
import { useLoginServices, useSetting } from '@rocket.chat/ui-contexts';
import type { ReactElement } from 'react';
import { useTranslation } from 'react-i18next';
@ -8,6 +8,7 @@ import LoginServicesButton from './LoginServicesButton';
const Services = ({ disabled }: { disabled?: boolean }): ReactElement | null => {
const { t } = useTranslation();
const services = useLoginServices();
const showFormLogin = useSetting('Accounts_ShowFormLogin');
if (services.length === 0) {
return null;
@ -15,7 +16,7 @@ const Services = ({ disabled }: { disabled?: boolean }): ReactElement | null =>
return (
<>
<Divider mb={24} p={0} children={t('registration.component.form.divider')} />
{showFormLogin && <Divider mb={24} p={0} children={t('registration.component.form.divider')} />}
<ButtonGroup vertical stretch small>
{services.map((service) => (
<LoginServicesButton disabled={disabled} key={service.service} {...service} />

4
packages/web-ui-registration/src/RegistrationPageRouter.tsx
Unescape View File

@ -1,4 +1,3 @@
import { useSetting } from '@rocket.chat/ui-contexts';
import type { ReactElement } from 'react';
import { LoginForm } from './LoginForm';
@ -13,9 +12,8 @@ export const RegistrationPageRouter = ({
defaultRoute?: 'login' | 'register' | 'reset-password' | 'secret-register';
}): ReactElement | null => {
const [route, setLoginRoute] = useLoginRouter(defaultRoute);
const showFormLogin = useSetting('Accounts_ShowFormLogin');
if (route === 'login' && showFormLogin) {
if (route === 'login') {
return (
<HorizontalTemplate>
<LoginForm setLoginRoute={setLoginRoute} />

Write Preview
Loading…
Cancel
Save