Changeset View
Changeset View
Standalone View
Standalone View
web/account/traditional-login-form.react.js
Show All 15 Lines | |||||
} from 'lib/types/account-types.js'; | } from 'lib/types/account-types.js'; | ||||
import { logInActionSources } from 'lib/types/account-types.js'; | import { logInActionSources } from 'lib/types/account-types.js'; | ||||
import type { SignedIdentityKeysBlob } from 'lib/types/crypto-types.js'; | import type { SignedIdentityKeysBlob } from 'lib/types/crypto-types.js'; | ||||
import { | import { | ||||
useDispatchActionPromise, | useDispatchActionPromise, | ||||
useServerCall, | useServerCall, | ||||
} from 'lib/utils/action-utils.js'; | } from 'lib/utils/action-utils.js'; | ||||
import { useSignedIdentityKeysBlob } from './account-hooks.js'; | |||||
import HeaderSeparator from './header-separator.react.js'; | import HeaderSeparator from './header-separator.react.js'; | ||||
import css from './log-in-form.css'; | import css from './log-in-form.css'; | ||||
import PasswordInput from './password-input.react.js'; | import PasswordInput from './password-input.react.js'; | ||||
import Button from '../components/button.react.js'; | import Button from '../components/button.react.js'; | ||||
import LoadingIndicator from '../loading-indicator.react.js'; | import LoadingIndicator from '../loading-indicator.react.js'; | ||||
import Input from '../modals/input.react.js'; | import Input from '../modals/input.react.js'; | ||||
import { useSelector } from '../redux/redux-utils.js'; | import { useSelector } from '../redux/redux-utils.js'; | ||||
import { webLogInExtraInfoSelector } from '../selectors/account-selectors.js'; | import { webLogInExtraInfoSelector } from '../selectors/account-selectors.js'; | ||||
import { signedIdentityKeysBlobSelector } from '../selectors/socket-selectors.js'; | |||||
const loadingStatusSelector = createLoadingStatusSelector(logInActionTypes); | const loadingStatusSelector = createLoadingStatusSelector(logInActionTypes); | ||||
function TraditionalLoginForm(): React.Node { | function TraditionalLoginForm(): React.Node { | ||||
const inputDisabled = useSelector(loadingStatusSelector) === 'loading'; | const inputDisabled = useSelector(loadingStatusSelector) === 'loading'; | ||||
const loginExtraInfo = useSelector(webLogInExtraInfoSelector); | const loginExtraInfo = useSelector(webLogInExtraInfoSelector); | ||||
const callLogIn = useServerCall(logIn); | const callLogIn = useServerCall(logIn); | ||||
const dispatchActionPromise = useDispatchActionPromise(); | const dispatchActionPromise = useDispatchActionPromise(); | ||||
const modalContext = useModalContext(); | const modalContext = useModalContext(); | ||||
const signedIdentityKeysBlob: ?SignedIdentityKeysBlob = useSelector( | const signedIdentityKeysBlob: ?SignedIdentityKeysBlob = | ||||
signedIdentityKeysBlobSelector, | useSignedIdentityKeysBlob(); | ||||
); | |||||
const usernameInputRef = React.useRef(); | const usernameInputRef = React.useRef(); | ||||
React.useEffect(() => { | React.useEffect(() => { | ||||
usernameInputRef.current?.focus(); | usernameInputRef.current?.focus(); | ||||
}, []); | }, []); | ||||
const [username, setUsername] = React.useState<string>(''); | const [username, setUsername] = React.useState<string>(''); | ||||
const onUsernameChange = React.useCallback(e => { | const onUsernameChange = React.useCallback(e => { | ||||
▲ Show 20 Lines • Show All 142 Lines • Show Last 20 Lines |