disable submit button while login is pending
This commit is contained in:
parent
86484eb13f
commit
706c4afd04
4 changed files with 16 additions and 4 deletions
|
@ -5,6 +5,7 @@ import {
|
|||
selectEmailDoesNotExist,
|
||||
selectEmailAlreadyExists,
|
||||
selectUser,
|
||||
selectEmailNewIsPending,
|
||||
} from 'redux/selectors/user';
|
||||
import { doUserCheckIfEmailExists, doClearEmailEntry } from 'redux/actions/user';
|
||||
import { doSetClientSetting } from 'redux/actions/settings';
|
||||
|
@ -15,6 +16,7 @@ const select = state => ({
|
|||
emailToVerify: selectEmailToVerify(state),
|
||||
emailDoesNotExist: selectEmailDoesNotExist(state),
|
||||
emailExists: selectEmailAlreadyExists(state),
|
||||
isPending: selectEmailNewIsPending(state),
|
||||
user: selectUser(state),
|
||||
});
|
||||
|
||||
|
|
|
@ -19,6 +19,7 @@ type Props = {
|
|||
doUserSignIn: (string, ?string) => void,
|
||||
doUserCheckIfEmailExists: string => void,
|
||||
doSetClientSetting: (string, boolean) => void,
|
||||
isPending: boolean,
|
||||
};
|
||||
|
||||
function UserEmailReturning(props: Props) {
|
||||
|
@ -30,6 +31,7 @@ function UserEmailReturning(props: Props) {
|
|||
doClearEmailEntry,
|
||||
emailDoesNotExist,
|
||||
doSetClientSetting,
|
||||
isPending,
|
||||
} = props;
|
||||
const { push, location } = useHistory();
|
||||
const urlParams = new URLSearchParams(location.search);
|
||||
|
@ -108,7 +110,7 @@ function UserEmailReturning(props: Props) {
|
|||
button="primary"
|
||||
type="submit"
|
||||
label={__('Sign In')}
|
||||
disabled={!email || !valid}
|
||||
disabled={!email || !valid || isPending}
|
||||
/>
|
||||
<Button button="link" onClick={handleChangeToSignIn} label={__('Register')} />
|
||||
</div>
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectUser, selectUserIsPending, selectEmailToVerify, selectEmailNewErrorMessage } from 'redux/selectors/user';
|
||||
import {
|
||||
selectUser,
|
||||
selectUserIsPending,
|
||||
selectEmailToVerify,
|
||||
selectEmailNewErrorMessage,
|
||||
selectEmailNewIsPending,
|
||||
} from 'redux/selectors/user';
|
||||
import { doUserSignIn, doClearEmailEntry } from 'redux/actions/user';
|
||||
import UserSignIn from './view';
|
||||
|
||||
|
@ -8,6 +14,7 @@ const select = state => ({
|
|||
userFetchPending: selectUserIsPending(state),
|
||||
emailToVerify: selectEmailToVerify(state),
|
||||
errorMessage: selectEmailNewErrorMessage(state),
|
||||
isPending: selectEmailNewIsPending(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
|
|
|
@ -12,10 +12,11 @@ type Props = {
|
|||
doClearEmailEntry: () => void,
|
||||
doUserSignIn: (string, ?string) => void,
|
||||
onHandleEmailOnly: () => void,
|
||||
isPending: boolean,
|
||||
};
|
||||
|
||||
export default function UserSignInPassword(props: Props) {
|
||||
const { errorMessage, doUserSignIn, emailToVerify, onHandleEmailOnly } = props;
|
||||
const { errorMessage, doUserSignIn, emailToVerify, onHandleEmailOnly, isPending } = props;
|
||||
const [password, setPassword] = useState('');
|
||||
const [forgotPassword, setForgotPassword] = React.useState(false);
|
||||
|
||||
|
@ -52,7 +53,7 @@ export default function UserSignInPassword(props: Props) {
|
|||
/>
|
||||
|
||||
<div className="section__actions">
|
||||
<Button button="primary" type="submit" label={__('Continue')} disabled={!password} />
|
||||
<Button button="primary" type="submit" label={__('Continue')} disabled={!password || isPending} />
|
||||
<Button button="link" onClick={handleChangeToSignIn} label={__('Use Magic Link')} />
|
||||
</div>
|
||||
</Form>
|
||||
|
|
Loading…
Reference in a new issue