fix(payments): clear previous access token on signin

Because:

- Payments server reads potentially stale access token from previous
  session instead of using new access token from current session.

This commit:

- Clears access token from localStorage when signing in from payments
  server checkout page.

Closes #FXA-11638

Author: StaberindeZA

packages/fxa-payments-server/src/components/NewUserEmailForm/index.tsx

@@ -15,6 +15,7 @@ import { useCallbackOnce } from '../../lib/hooks';
 import { apiFetchAccountStatus } from '../../lib/apiClient';
 import { CheckoutType } from 'fxa-shared/subscriptions/types';
 import { metadataFromPlan } from 'fxa-shared/subscriptions/metadata';
+import { ACCESS_TOKEN_KEY } from '../..';
 
 const CHECKOUT_TYPE = CheckoutType.WITHOUT_ACCOUNT;
 const DEFAULT_NEWSLETTER_STRING_ID =
@@ -116,6 +117,8 @@ export const NewUserEmailForm = ({
   }, [onFormEngaged]);
 
   const onClickSignInButton = () => {
+    // Clear any remaining access token from a previous session
+    localStorage.removeItem(ACCESS_TOKEN_KEY)
     selectedPlan.other = 'click-signnin';
     Amplitude.createAccountSignIn({
       ...selectedPlan,
@@ -289,7 +292,7 @@ export async function emailInputValidationAndAccountCheck(
 
   const errorMsg = getString
     ? /* istanbul ignore next - not testing l10n here */
-      getString('new-user-email-validate')
+    getString('new-user-email-validate')
     : 'Email is not valid';
 
   const accountExistsMsg = (
@@ -355,7 +358,7 @@ export function emailConfirmationValidation(
 
   const errorMsg = getString
     ? /* istanbul ignore next - not testing l10n here */
-      getString('new-user-email-validate-confirm')
+    getString('new-user-email-validate-confirm')
     : 'Emails do not match';
 
   return {

packages/fxa-payments-server/src/index.tsx

@@ -17,6 +17,8 @@ import { actions } from './store/actions';
 import './styles/tailwind.out.css';
 import './index.scss';
 
+export const ACCESS_TOKEN_KEY = 'fxa-access-token';
+
 async function init() {
   readConfigFromMeta(headQuerySelector);
 
@@ -109,7 +111,6 @@ async function getHashParams() {
   return hashParams;
 }
 
-const ACCESS_TOKEN_KEY = 'fxa-access-token';
 type getVerifiedAccessTokenArgs = { accessToken?: string | null };
 async function getVerifiedAccessToken({
   accessToken = '',