Page MenuHomePhabricator
Files F3352218

D6326.id21166.diff
No OneTemporary
Actions

D6326.id21166.diff
View Options

diff --git a/web/account/siwe.react.js b/web/account/siwe.react.js
--- a/web/account/siwe.react.js
+++ b/web/account/siwe.react.js
@@ -9,6 +9,7 @@
RainbowKitProvider,
useConnectModal,
} from '@rainbow-me/rainbowkit';
+import invariant from 'invariant';
import _merge from 'lodash/fp/merge';
import * as React from 'react';
import { FaEthereum } from 'react-icons/fa';
@@ -16,6 +17,7 @@
chain,
configureChains,
createClient,
+ useAccount,
useSigner,
WagmiConfig,
} from 'wagmi';
@@ -25,17 +27,25 @@
import {
getSIWENonce,
getSIWENonceActionTypes,
+ siweAuth,
+ siweAuthActionTypes,
} from 'lib/actions/siwe-actions';
import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors';
+import type { LogInStartingPayload } from 'lib/types/account-types.js';
import {
useDispatchActionPromise,
useServerCall,
} from 'lib/utils/action-utils';
-import { siweMessageSigningExplanationStatements } from 'lib/utils/siwe-utils.js';
+import {
+ createSIWEMessage,
+ siweMessageSigningExplanationStatements,
+ siweStatementWithoutPublicKey,
+} from 'lib/utils/siwe-utils.js';
import Button from '../components/button.react';
import LoadingIndicator from '../loading-indicator.react';
import { useSelector } from '../redux/redux-utils';
+import { webLogInExtraInfoSelector } from '../selectors/account-selectors.js';
import css from './siwe.css';
// details can be found https://0.6.x.wagmi.sh/docs/providers/configuring-chains
@@ -63,12 +73,15 @@
);
function SIWE(): React.Node {
const { openConnectModal } = useConnectModal();
+ const { address } = useAccount();
const { data: signer } = useSigner();
const dispatchActionPromise = useDispatchActionPromise();
const getSIWENonceCall = useServerCall(getSIWENonce);
const getSIWENonceCallLoadingStatus = useSelector(
getSIWENonceLoadingStatusSelector,
);
+ const siweAuthCall = useServerCall(siweAuth);
+ const logInExtraInfo = useSelector(webLogInExtraInfoSelector);
const [siweNonce, setSIWENonce] = React.useState<?string>(null);
@@ -91,6 +104,41 @@
[],
);
+ const callSIWEAuthEndpoint = React.useCallback(
+ async (message: string, signature: string, extraInfo) => {
+ return await siweAuthCall({
+ message,
+ signature,
+ ...extraInfo,
+ });
+ },
+ [siweAuthCall],
+ );
+
+ const attemptSIWEAuth = React.useCallback(
+ async (message: string, signature: string) => {
+ const extraInfo = logInExtraInfo();
+ dispatchActionPromise(
+ siweAuthActionTypes,
+ callSIWEAuthEndpoint(message, signature, extraInfo),
+ undefined,
+ ({ calendarQuery: extraInfo.calendarQuery }: LogInStartingPayload),
+ );
+ },
+ [callSIWEAuthEndpoint, dispatchActionPromise, logInExtraInfo],
+ );
+
+ const onSignInButtonClick = React.useCallback(async () => {
+ invariant(siweNonce, 'nonce must be present during SIWE attempt');
+ const message = createSIWEMessage(
+ address,
+ siweStatementWithoutPublicKey,
+ siweNonce,
+ );
+ const signature = await signer.signMessage(message);
+ attemptSIWEAuth(message, signature);
+ }, [address, attemptSIWEAuth, signer, siweNonce]);
+
let siweLoginForm;
if (signer && !siweNonce) {
siweLoginForm = (
@@ -109,7 +157,7 @@
</div>
<p>{siweMessageSigningExplanationStatements[0]}</p>
<p>{siweMessageSigningExplanationStatements[1]}</p>
- <Button variant="filled" type="submit" onClick={undefined}>
+ <Button variant="filled" onClick={onSignInButtonClick}>
Sign in
</Button>
</div>

File Metadata

Mime Type
text/plain
Expires
Sun, Nov 24, 5:06 AM (20 h, 54 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2574043
Default Alt Text
D6326.id21166.diff (3 KB)

Event Timeline