[v3] Add multi-site suffix to auth token keys

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

@@ -67,9 +67,9 @@ describe('Auth', () => {
         expect(auth.get('refresh_token_guest')).toBe(refreshToken)
         expect(auth.get('access_token')).toBe(accessToken)
         // @ts-expect-error private property
-        expect([...auth.stores['cookie'].map.keys()]).toEqual([`siteId_cc-nx-g`])
+        expect([...auth.stores['cookie'].map.keys()]).toEqual([`cc-nx-g_siteId`])
         // @ts-expect-error private property
-        expect([...auth.stores['local'].map.keys()]).toEqual([`siteId_access_token`])
+        expect([...auth.stores['local'].map.keys()]).toEqual([`access_token_siteId`])
     })
     test('set registered refresh token will clear guest refresh token, vise versa', () => {
         const auth = new Auth(config)
@@ -300,7 +300,7 @@ describe('Auth', () => {
         // @ts-expect-error private method
         authA.set('refresh_token_guest', refreshTokenGuest)
         // @ts-expect-error private property
-        expect([...authA.stores['memory'].map.keys()]).toEqual([`siteA_cc-nx-g`])
+        expect([...authA.stores['memory'].map.keys()]).toEqual([`cc-nx-g_siteA`])
 
         // Create a second auth instance and ensure that its memory store has previous
         // guest tokens set from the first store (this emulates a second lambda request.)
@@ -309,7 +309,7 @@ describe('Auth', () => {
         authB.set('refresh_token_guest', refreshTokenGuest)
 
         // @ts-expect-error private property
-        expect([...authB.stores['memory'].map.keys()]).toEqual([`siteA_cc-nx-g`, `siteB_cc-nx-g`])
+        expect([...authB.stores['memory'].map.keys()]).toEqual([`cc-nx-g_siteA`, `cc-nx-g_siteB`])
 
         // Set mock value back to expected.
         // @ts-expect-error read-only property

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

@@ -163,9 +163,9 @@ class Auth {
             fetchOptions: config.fetchOptions
         })
 
-        const storageOptions = {keyPrefix: config.siteId}
+        const storageOptions = {keySuffix: config.siteId}
         const serverStorageOptions = {
-            keyPrefix: config.siteId,
+            keySuffix: config.siteId,
             sharedContext: true // This allows use to reused guest authentication tokens accross lambda runs.
         }
 

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

@@ -24,14 +24,13 @@ const testCases = [
     {
         description: 'MemoryStorage works with options',
         storageOptions: {
-            keyPrefix: 'prefix',
-            keyPrefixSeparator: '$'
+            keySuffix: 'suffix'
         },
         validate: (storage: BaseStorage) => {
             storage.set(key, value)
             expect(storage.get(key)).toBe(value)
             // @ts-expect-error private property
-            expect([...storage.map.keys()]).toEqual([`prefix$${key}`])
+            expect([...storage.map.keys()]).toEqual([`${key}_suffix`])
             storage.delete(key)
             expect(storage.get(key)).toBe('')
         }

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

@@ -9,25 +9,23 @@ import Cookies from 'js-cookie'
 export type StorageType = 'cookie' | 'local' | 'memory'
 
 export interface BaseStorageOptions {
-    keyPrefix?: string
-    keyPrefixSeparator?: string
+    keySuffix?: string
 }
 
 export interface MemoryStorageOptions extends BaseStorageOptions {
     sharedContext?: boolean
 }
 export abstract class BaseStorage {
-    protected options: Required<BaseStorageOptions>
+    protected options: BaseStorageOptions = {}
 
-    constructor(options: BaseStorageOptions = {keyPrefixSeparator: '_'}) {
+    constructor(options?: BaseStorageOptions) {
         this.options = {
-            keyPrefixSeparator: options.keyPrefix ? options.keyPrefixSeparator ?? '_' : '',
-            keyPrefix: options.keyPrefix ?? ''
+            keySuffix: options?.keySuffix ?? ''
         }
     }
 
-    protected getPrefixedKey(key: string): string {
-        return `${this.options.keyPrefix}${this.options.keyPrefixSeparator}${key}`
+    protected getSuffixedKey(key: string): string {
+        return this.options.keySuffix ? `${key}_${this.options.keySuffix}` : key
     }
     abstract set(key: string, value: string, options?: unknown): void
     abstract get(key: string): string
@@ -49,16 +47,16 @@ export class CookieStorage extends BaseStorage {
         }
     }
     set(key: string, value: string, options?: Cookies.CookieAttributes) {
-        const prefixedKey = this.getPrefixedKey(key)
-        Cookies.set(prefixedKey, value, {...options, secure: true})
+        const suffixedKey = this.getSuffixedKey(key)
+        Cookies.set(suffixedKey, value, {...options, secure: true})
     }
     get(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        return Cookies.get(prefixedKey) || ''
+        const suffixedKey = this.getSuffixedKey(key)
+        return Cookies.get(suffixedKey) || ''
     }
     delete(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        Cookies.remove(prefixedKey)
+        const suffixedKey = this.getSuffixedKey(key)
+        Cookies.remove(suffixedKey)
     }
 }
 
@@ -77,26 +75,26 @@ export class LocalStorage extends BaseStorage {
         }
     }
     set(key: string, value: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        const oldValue = this.get(prefixedKey)
-        window.localStorage.setItem(prefixedKey, value)
+        const suffixedKey = this.getSuffixedKey(key)
+        const oldValue = this.get(suffixedKey)
+        window.localStorage.setItem(suffixedKey, value)
         const event = new StorageEvent('storage', {
-            key: prefixedKey,
+            key: suffixedKey,
             oldValue: oldValue,
             newValue: value
         })
         window.dispatchEvent(event)
     }
     get(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        return window.localStorage.getItem(prefixedKey) || ''
+        const suffixedKey = this.getSuffixedKey(key)
+        return window.localStorage.getItem(suffixedKey) || ''
     }
     delete(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        const oldValue = this.get(prefixedKey)
-        window.localStorage.removeItem(prefixedKey)
+        const suffixedKey = this.getSuffixedKey(key)
+        const oldValue = this.get(suffixedKey)
+        window.localStorage.removeItem(suffixedKey)
         const event = new StorageEvent('storage', {
-            key: prefixedKey,
+            key: suffixedKey,
             oldValue: oldValue,
             newValue: null
         })
@@ -114,15 +112,15 @@ export class MemoryStorage extends BaseStorage {
         this.map = options?.sharedContext ? globalMap : new Map()
     }
     set(key: string, value: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        this.map.set(prefixedKey, value)
+        const suffixedKey = this.getSuffixedKey(key)
+        this.map.set(suffixedKey, value)
     }
     get(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        return this.map.get(prefixedKey) || ''
+        const suffixedKey = this.getSuffixedKey(key)
+        return this.map.get(suffixedKey) || ''
     }
     delete(key: string) {
-        const prefixedKey = this.getPrefixedKey(key)
-        this.map.delete(prefixedKey)
+        const suffixedKey = this.getSuffixedKey(key)
+        this.map.delete(suffixedKey)
     }
 }