diff --git a/frontend/app/components/auth/auth.spec.tsx b/frontend/app/components/auth/auth.spec.tsx
index 72e91311..130068ae 100644
--- a/frontend/app/components/auth/auth.spec.tsx
+++ b/frontend/app/components/auth/auth.spec.tsx
@@ -141,6 +141,7 @@ describe('', () => {
jest.spyOn(api, 'emailSignin').mockImplementationOnce(async () => null);
jest.spyOn(api, 'verifyEmailSignin').mockImplementationOnce(async () => ({} as User));
jest.spyOn(utils, 'getTokenInvalidReason').mockImplementationOnce(() => null);
+ jest.spyOn(utils, 'persistEmail').mockImplementationOnce(jest.fn());
render();
@@ -167,6 +168,7 @@ describe('', () => {
await waitFor(() => expect(api.verifyEmailSignin).toBeCalled());
expect(api.verifyEmailSignin).toBeCalledWith('token');
+ expect(utils.persistEmail).toBeCalledWith('email@email.com');
});
it('should show validation error for token', async () => {
diff --git a/frontend/app/components/auth/auth.tsx b/frontend/app/components/auth/auth.tsx
index 1223a7a8..591ec553 100644
--- a/frontend/app/components/auth/auth.tsx
+++ b/frontend/app/components/auth/auth.tsx
@@ -16,7 +16,7 @@ import { Button } from './components/button';
import { OAuth } from './components/oauth';
import { messages } from './auth.messsages';
import { useDropdown, useErrorMessage } from './auth.hooks';
-import { getProviders, getTokenInvalidReason } from './auth.utils';
+import { getProviders, getTokenInvalidReason, persistEmail } from './auth.utils';
import {
oauthSignin,
emailSignin,
@@ -31,6 +31,7 @@ import styles from './auth.module.css';
export function Auth() {
const intl = useIntl();
const telegramParamsRef = useRef(null);
+ const emailRef = useRef('');
const dispatch = useDispatch();
const [oauthProviders, formProviders] = getProviders();
@@ -121,6 +122,8 @@ export function Auth() {
const email = data.get('email') as string;
const username = data.get('username') as string;
+ emailRef.current = email;
+
await emailSignin(email, username);
setView('token');
break;
@@ -131,11 +134,13 @@ export function Auth() {
if (invalidReason) {
setError(invalidReason);
- } else {
- const user = await verifyEmailSignin(token);
- dispatch(setUser(user));
+ break;
}
+ const user = await verifyEmailSignin(token);
+ dispatch(setUser(user));
+ persistEmail(emailRef.current);
+
break;
}
}
diff --git a/frontend/app/components/auth/auth.utils.ts b/frontend/app/components/auth/auth.utils.ts
index 1e3c7dbd..b92e1cb9 100644
--- a/frontend/app/components/auth/auth.utils.ts
+++ b/frontend/app/components/auth/auth.utils.ts
@@ -4,6 +4,8 @@ import type { FormProvider, OAuthProvider } from 'common/types';
import { OAUTH_PROVIDERS } from './components/oauth.consts';
import { messages } from './auth.messsages';
+import { setItem, getItem } from 'common/local-storage';
+import { LS_EMAIL_KEY } from 'common/constants';
export function getProviders(): [OAuthProvider[], FormProvider[]] {
const oauthProviders: OAuthProvider[] = [];
@@ -27,3 +29,15 @@ export function getTokenInvalidReason(token: string): null | keyof typeof messag
return null;
}
+
+export function persistEmail(email: string) {
+ setItem(LS_EMAIL_KEY, email);
+}
+
+export function getPersistedEmail() {
+ return getItem(LS_EMAIL_KEY) || '';
+}
+
+export function resetPersistedEmail() {
+ setItem(LS_EMAIL_KEY, '');
+}
diff --git a/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.test.tsx b/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.test.tsx
index ef2faf54..d5bc5cc9 100644
--- a/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.test.tsx
+++ b/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.test.tsx
@@ -14,8 +14,8 @@ import { sleep } from 'utils/sleep';
import { Input } from 'components/input';
import { Button } from 'components/button';
import { Dropdown } from 'components/dropdown';
+import { persistEmail } from 'components/auth/auth.utils';
import enMessages from 'locales/en.json';
-import { LS_EMAIL_KEY } from 'common/constants';
import { SubscribeByEmail, SubscribeByEmailForm } from '.';
@@ -139,10 +139,12 @@ describe('', () => {
});
it('should fill in email from local storage', async () => {
- localStorage.setItem(LS_EMAIL_KEY, 'someone@email.com');
+ const expected = 'someone@email.com';
+ persistEmail(expected);
const wrapper = createWrapper();
const form = wrapper.find('form');
- expect(form.find('input').props().value).toEqual('someone@email.com');
+
+ expect(form.find('input').props().value).toBe(expected);
});
it('should send form by paste valid token', async () => {
diff --git a/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.tsx b/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.tsx
index e71768f1..005d2666 100644
--- a/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.tsx
+++ b/frontend/app/components/comment-form/__subscribe-by-email/comment-form__subscribe-by-email.tsx
@@ -5,7 +5,6 @@ import b from 'bem-react-helper';
import { useIntl, defineMessages, IntlShape, FormattedMessage } from 'react-intl';
import { User } from 'common/types';
-import { LS_EMAIL_KEY } from 'common/constants';
import { StoreState } from 'store';
import { setUserSubscribed } from 'store/user/actions';
import { sleep } from 'utils/sleep';
@@ -18,6 +17,7 @@ import { Button } from 'components/button';
import { Dropdown } from 'components/dropdown';
import { Preloader } from 'components/preloader';
import { TextareaAutosize } from 'components/textarea-autosize';
+import { getPersistedEmail } from 'components/auth/auth.utils';
import { isUserAnonymous } from 'utils/isUserAnonymous';
import { isJwtExpired } from 'utils/jwt';
@@ -126,7 +126,7 @@ export const SubscribeByEmailForm: FunctionComponent = () => {
const [step, setStep] = useState(subscribed ? Step.Subscribed : Step.Email);
const [token, setToken] = useState('');
- const [emailAddress, setEmailAddress] = useState(localStorage.getItem(LS_EMAIL_KEY) || '');
+ const [emailAddress, setEmailAddress] = useState(getPersistedEmail);
const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);
diff --git a/frontend/app/store/user/actions.ts b/frontend/app/store/user/actions.ts
index 4768d17a..4598f379 100644
--- a/frontend/app/store/user/actions.ts
+++ b/frontend/app/store/user/actions.ts
@@ -3,7 +3,7 @@ import { logout } from 'components/auth/auth.api';
import { User, BlockedUser, BlockTTL } from 'common/types';
import { ttlToTime } from 'utils/ttl-to-time';
import { getHiddenUsers } from 'utils/get-hidden-users';
-import { LS_EMAIL_KEY, LS_HIDDEN_USERS_KEY } from 'common/constants';
+import { LS_HIDDEN_USERS_KEY } from 'common/constants';
import { setItem } from 'common/local-storage';
import { StoreAction } from '../index';
@@ -20,6 +20,7 @@ import {
} from './types';
import { fetchComments, unsetCommentMode } from '../comments/actions';
import { COMMENTS_PATCH } from '../comments/types';
+import { resetPersistedEmail } from 'components/auth/auth.utils';
export function setUser(user: User | null = null): USER_SET_ACTION {
return {
@@ -33,7 +34,7 @@ export function signout(cleanSession = true): StoreAction> {
if (cleanSession) {
await logout();
}
- localStorage.removeItem(LS_EMAIL_KEY);
+ resetPersistedEmail();
dispatch(setUser());
dispatch(unsetCommentMode());
dispatch(fetchComments());