Page MenuHomePhorge
Files F32088798

log-in-form.react.js
No OneTemporary
Actions

Size
2 KB
Referenced Files
None
Subscribers
None

log-in-form.react.js
View Options

// @flow
import olm from '@matrix-org/olm';
import { useConnectModal } from '@rainbow-me/rainbowkit';
import * as React from 'react';
import { useDispatch } from 'react-redux';
import { useSigner } from 'wagmi';
import css from './log-in-form.css';
import SIWEButton from './siwe-button.react.js';
import SIWELoginForm from './siwe-login-form.react.js';
import TraditionalLoginForm from './traditional-login-form.react.js';
import OrBreak from '../components/or-break.react.js';
import {
setPrimaryIdentityKeys,
setNotificationIdentityKeys,
} from '../redux/crypto-store-reducer.js';
import { useSelector } from '../redux/redux-utils.js';
function LoginForm(): React.Node {
const { openConnectModal } = useConnectModal();
const { data: signer } = useSigner();
const dispatch = useDispatch();
const primaryIdentityPublicKeys = useSelector(
state => state.cryptoStore.primaryIdentityKeys,
);
const notificationIdentityPublicKeys = useSelector(
state => state.cryptoStore.notificationIdentityKeys,
);
React.useEffect(() => {
(async () => {
if (
primaryIdentityPublicKeys !== null &&
primaryIdentityPublicKeys !== undefined &&
notificationIdentityPublicKeys !== null &&
notificationIdentityPublicKeys !== undefined
) {
return;
}
await olm.init();
const identityAccount = new olm.Account();
identityAccount.create();
const { ed25519: identityED25519, curve25519: identityCurve25519 } =
JSON.parse(identityAccount.identity_keys());
dispatch({
type: setPrimaryIdentityKeys,
payload: { ed25519: identityED25519, curve25519: identityCurve25519 },
});
const notificationAccount = new olm.Account();
notificationAccount.create();
const {
ed25519: notificationED25519,
curve25519: notificationCurve25519,
} = JSON.parse(notificationAccount.identity_keys());
dispatch({
type: setNotificationIdentityKeys,
payload: {
ed25519: notificationED25519,
curve25519: notificationCurve25519,
},
});
})();
}, [dispatch, notificationIdentityPublicKeys, primaryIdentityPublicKeys]);
const [siweAuthFlowSelected, setSIWEAuthFlowSelected] =
React.useState<boolean>(false);
const onSIWEButtonClick = React.useCallback(() => {
setSIWEAuthFlowSelected(true);
openConnectModal && openConnectModal();
}, [openConnectModal]);
const cancelSIWEAuthFlow = React.useCallback(() => {
setSIWEAuthFlowSelected(false);
}, []);
if (siweAuthFlowSelected && signer) {
return (
<div className={css.modal_body}>
<SIWELoginForm cancelSIWEAuthFlow={cancelSIWEAuthFlow} />
</div>
);
}
return (
<div className={css.modal_body}>
<TraditionalLoginForm />
<OrBreak />
<SIWEButton onSIWEButtonClick={onSIWEButtonClick} />
</div>
);
}
export default LoginForm;

File Metadata

Mime Type
text/x-java
Expires
Sun, Dec 7, 7:53 AM (1 d, 5 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5834081
Default Alt Text
log-in-form.react.js (2 KB)

Event Timeline