Page MenuHomePhorge
Files F33304901

D8767.1768788834.diff
No OneTemporary
Actions

Size
5 KB
Referenced Files
None
Subscribers
None

D8767.1768788834.diff
View Options

diff --git a/lib/types/siwe-types.js b/lib/types/siwe-types.js
--- a/lib/types/siwe-types.js
+++ b/lib/types/siwe-types.js
@@ -27,6 +27,7 @@
export type SIWEAuthServerCall = {
+message: string,
+signature: string,
+ +doNotRegister?: boolean,
...LogInExtraInfo,
};
diff --git a/web/account/siwe-login-form.react.js b/web/account/siwe-login-form.react.js
--- a/web/account/siwe-login-form.react.js
+++ b/web/account/siwe-login-form.react.js
@@ -1,6 +1,7 @@
// @flow
import '@rainbow-me/rainbowkit/styles.css';
+import classNames from 'classnames';
import invariant from 'invariant';
import * as React from 'react';
import { useDispatch } from 'react-redux';
@@ -15,6 +16,7 @@
} from 'lib/actions/siwe-actions.js';
import ConnectedWalletInfo from 'lib/components/connected-wallet-info.react.js';
import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
+import stores from 'lib/facts/stores.js';
import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
import type { LogInStartingPayload } from 'lib/types/account-types.js';
import type {
@@ -25,6 +27,7 @@
useDispatchActionPromise,
useServerCall,
} from 'lib/utils/action-utils.js';
+import { ServerError } from 'lib/utils/errors.js';
import {
createSIWEMessage,
getSIWEStatementForPublicKey,
@@ -40,6 +43,8 @@
import { useSelector } from '../redux/redux-utils.js';
import { webLogInExtraInfoSelector } from '../selectors/account-selectors.js';
+type SIWELogInError = 'account_does_not_exist';
+
type SIWELoginFormProps = {
+cancelSIWEAuthFlow: () => void,
};
@@ -87,17 +92,28 @@
useSignedIdentityKeysBlob();
const callSIWEAuthEndpoint = React.useCallback(
- (message: string, signature: string, extraInfo) => {
+ async (message: string, signature: string, extraInfo) => {
invariant(
signedIdentityKeysBlob,
'signedIdentityKeysBlob must be set in attemptSIWEAuth',
);
- return siweAuthCall({
- message,
- signature,
- signedIdentityKeysBlob,
- ...extraInfo,
- });
+ try {
+ return await siweAuthCall({
+ message,
+ signature,
+ signedIdentityKeysBlob,
+ doNotRegister: true,
+ ...extraInfo,
+ });
+ } catch (e) {
+ if (
+ e instanceof ServerError &&
+ e.message === 'account_does_not_exist'
+ ) {
+ setError('account_does_not_exist');
+ }
+ throw e;
+ }
},
[signedIdentityKeysBlob, siweAuthCall],
);
@@ -156,6 +172,17 @@
[],
);
+ const [error, setError] = React.useState<?SIWELogInError>();
+
+ const mainMiddleAreaClassName = classNames({
+ [css.mainMiddleArea]: true,
+ [css.hidden]: !!error,
+ });
+ const errorOverlayClassNames = classNames({
+ [css.errorOverlay]: true,
+ [css.hidden]: !error,
+ });
+
if (
siweAuthLoadingStatus === 'loading' ||
!siweNonce ||
@@ -169,6 +196,33 @@
);
}
+ let errorText;
+ if (error === 'account_does_not_exist') {
+ errorText = (
+ <>
+ <p className={css.redText}>
+ No Comm account found for that Ethereum wallet!
+ </p>
+ <p>
+ We require that users register on their mobile devices. Comm relies on
+ a primary device capable of scanning QR codes in order to authorize
+ secondary devices.
+ </p>
+ <p>
+ You can install our iOS app&nbsp;
+ <a href={stores.appStoreUrl} target="_blank" rel="noreferrer">
+ here
+ </a>
+ , or our Android app&nbsp;
+ <a href={stores.googlePlayUrl} target="_blank" rel="noreferrer">
+ here
+ </a>
+ .
+ </p>
+ </>
+ );
+ }
+
return (
<div className={css.siweLoginFormContainer}>
<h4>Sign in with Ethereum</h4>
@@ -179,21 +233,26 @@
<div className={css.connectButtonContainer}>
<ConnectedWalletInfo />
</div>
- <div className={css.messageSigningStatements}>
- <p>{siweMessageSigningExplanationStatements}</p>
- <p>
- By signing up, you agree to our{' '}
- <a href="https://comm.app/terms">Terms of Use</a> &{' '}
- <a href="https://comm.app/privacy">Privacy Policy</a>.
- </p>
+ <div className={css.middleArea}>
+ <div className={mainMiddleAreaClassName}>
+ <div className={css.messageSigningStatements}>
+ <p>{siweMessageSigningExplanationStatements}</p>
+ <p>
+ By signing up, you agree to our{' '}
+ <a href="https://comm.app/terms">Terms of Use</a> &{' '}
+ <a href="https://comm.app/privacy">Privacy Policy</a>.
+ </p>
+ </div>
+ <Button
+ variant="filled"
+ onClick={onSignInButtonClick}
+ buttonColor={signInButtonColor}
+ >
+ Sign in using this wallet
+ </Button>
+ </div>
+ <div className={errorOverlayClassNames}>{errorText}</div>
</div>
- <Button
- variant="filled"
- onClick={onSignInButtonClick}
- buttonColor={signInButtonColor}
- >
- Sign in using this wallet
- </Button>
<OrBreak />
<Button
variant="filled"
diff --git a/web/account/siwe.css b/web/account/siwe.css
--- a/web/account/siwe.css
+++ b/web/account/siwe.css
@@ -38,3 +38,29 @@
display: flex;
flex-direction: column;
}
+
+div.middleArea {
+ position: relative;
+}
+div.mainMiddleArea {
+ display: flex;
+ flex-direction: column;
+}
+div.errorOverlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ gap: 12px;
+}
+div.hidden {
+ visibility: hidden;
+}
+
+div.siweLoginFormContainer p.redText {
+ color: var(--error-primary);
+}

File Metadata

Mime Type
text/plain
Expires
Mon, Jan 19, 2:13 AM (3 h, 17 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5953924
Default Alt Text
D8767.1768788834.diff (5 KB)

Event Timeline