@W-14686284@ Fix Preview 403 errors when opening storefront being previewed in a new tab (#1629)

* Store SLAS refresh token in Local storage

* Conditionally store SLAS refresh token

* Add LocalAndCookie storage

* Refactor LocalAndCookieStorage

* Conditionally use Cookie key for Storefront Preview

* PR Feedback

Author: adamraya

packages/commerce-sdk-react/src/auth/index.test.ts

@@ -36,7 +36,9 @@ jest.mock('commerce-sdk-isomorphic', () => {
 
 jest.mock('../utils', () => ({
     __esModule: true,
-    onClient: () => true
+    onClient: () => true,
+    getParentOrigin: jest.fn().mockResolvedValue(''),
+    isOriginTrusted: () => false
 }))
 
 /** The auth data we store has a slightly different shape than what we use. */

packages/commerce-sdk-react/src/auth/index.ts

@@ -15,7 +15,7 @@ import {jwtDecode, JwtPayload} from 'jwt-decode'
 import {ApiClientConfigParams, Prettify, RemoveStringIndex} from '../hooks/types'
 import {BaseStorage, LocalStorage, CookieStorage, MemoryStorage, StorageType} from './storage'
 import {CustomerType} from '../hooks/useCustomerType'
-import {onClient} from '../utils'
+import {getParentOrigin, isOriginTrusted, onClient} from '../utils'
 
 type TokenResponse = ShopperLoginTypes.TokenResponse
 type Helpers = typeof helpers
@@ -67,6 +67,8 @@ type AuthDataMap = Record<
     }
 >
 
+const isParentTrusted = isOriginTrusted(getParentOrigin())
+
 /**
  * A map of the data that this auth module stores. This maps the name of the property to
  * the storage type and the key when stored in that storage. You can also pass in a "callback"
@@ -107,16 +109,16 @@ const DATA_MAP: AuthDataMap = {
     },
     refresh_token_guest: {
         storageType: 'cookie',
-        key: 'cc-nx-g',
+        key: isParentTrusted ? 'cc-nx-g-iframe' : 'cc-nx-g',
         callback: (store) => {
-            store.delete('cc-nx')
+            store.delete(isParentTrusted ? 'cc-nx-iframe' : 'cc-nx')
         }
     },
     refresh_token_registered: {
         storageType: 'cookie',
-        key: 'cc-nx',
+        key: isParentTrusted ? 'cc-nx-iframe' : 'cc-nx',
         callback: (store) => {
-            store.delete('cc-nx-g')
+            store.delete(isParentTrusted ? 'cc-nx-g-iframe' : 'cc-nx-g')
         }
     },
     refresh_token_expires_in: {
@@ -129,16 +131,16 @@ const DATA_MAP: AuthDataMap = {
     // This triggers a new fetch for access_token using the current refresh_token from cookie storage and makes sure customer auth state is always in sync between SFRA and PWA sites in a hybrid setup.
     refresh_token_guest_copy: {
         storageType: 'local',
-        key: 'cc-nx-g',
+        key: isParentTrusted ? 'cc-nx-g-iframe' : 'cc-nx-g',
         callback: (store) => {
-            store.delete('cc-nx')
+            store.delete(isParentTrusted ? 'cc-nx-iframe' : 'cc-nx')
         }
     },
     refresh_token_registered_copy: {
         storageType: 'local',
-        key: 'cc-nx',
+        key: isParentTrusted ? 'cc-nx-iframe' : 'cc-nx',
         callback: (store) => {
-            store.delete('cc-nx-g')
+            store.delete(isParentTrusted ? 'cc-nx-g-iframe' : 'cc-nx-g')
         }
     },
     customer_type: {