feat: encode shipping info to base64

react/client.ts

@@ -1,8 +1,6 @@
 import { SHIPPING_INFO_COOKIE } from './constants'
 import { setCookie } from './utils/cookie'
 
-export const ALL_SEMICOLON_REGEX = /;/g
-
 export const getAddress = (
   countryCode: string,
   zipCode: string,
@@ -22,8 +20,8 @@ export const updateSession = (
   )}${pickup ? `;pickupPoint=${pickup.pickupPoint.id}` : ''}`
 
   // __RUNTIME__.segmentToken is not reliable for the facets. It might not be updated. For this reason we must try to get the info from our custom cookie first
-  // Replacing ";" by ":" because ";" is not allowed in cookies
-  setCookie(SHIPPING_INFO_COOKIE, facetsValue.replace(ALL_SEMICOLON_REGEX, ':'))
+  // Encode to base64 because ";" is not allowed in cookies
+  setCookie(SHIPPING_INFO_COOKIE, btoa(facetsValue))
 
   return fetch('/api/sessions', {
     method: 'POST',

react/utils/cookie.ts

@@ -1,7 +1,5 @@
 import { SHIPPING_INFO_COOKIE } from '../constants'
 
-export const ALL_COLON_REGEX = /:/g
-
 export function getCookie(name: string) {
   const value = `; ${document.cookie}`
   const parts = value.split(`; ${name}=`)
@@ -25,12 +23,10 @@ export function setCookie(name: string, val: string) {
 export function getFacetsData(facetsDataTarget: string) {
   // __RUNTIME__.segmentToken is not reliable for the facets. It might not be updated. For this reason we must try to get the info from our custom cookie first
 
-  let facets = getCookie(SHIPPING_INFO_COOKIE)
+  let facets = atob(getCookie(SHIPPING_INFO_COOKIE) ?? '')
 
   if (!facets) {
-    const segment =
-      getCookie(SHIPPING_INFO_COOKIE) ??
-      (window as any)?.__RUNTIME__.segmentToken
+    const segment = (window as any)?.__RUNTIME__.segmentToken
 
     if (!segment) {
       return
@@ -43,9 +39,7 @@ export function getFacetsData(facetsDataTarget: string) {
     return
   }
 
-  //  In case the facets came from the shipping_info cookie we must replace ":" by ";" because ";" is not allowed in cookies.
   const facetsTarget = facets
-    .replace(ALL_COLON_REGEX, ';')
     .split(';')
     .find((facet: string) => facet.indexOf(facetsDataTarget) > -1)