Add a changelog.json entry for the next release (includes cookie updates)

[frandiox]

The main code block (step 2 of the cookie migration feat) contains the following as markdown:

---

React Router + Hydrogen on Oxygen

If you scaffolded from the default Hydrogen skeleton and deploy to Oxygen, the createRequestHandler utility from @shopify/hydrogen/oxygen (now also exported from @shopify/hydrogen) already sets up a Storefront API proxy on the same domain as your storefront.

In most cases, no changes are required; just confirm your server entry still uses it:

// server.ts (Oxygen)
import {createRequestHandler, createHydrogenContext} from '@shopify/hydrogen';

export default {
  async fetch(request, env) {
    const hydrogenContext = createHydrogenContext({
      env,
      request,
      /* ... */
    });

    const handleRequest = createRequestHandler({
      /* ... */
      getLoadContext: () => hydrogenContext,
      // Alternatively, pass at least storefront client:
      // getLoadContext: () => ({storefront: createStorefrontClient(...)})
    });

    return handleRequest(request);
  },
};

Keep using <Analytics.Provider> component or useCustomerPrivacy hook to get cookies in the browser automatically.

For a full example, refer to our skeleton template.

React Router + Hydrogen on other hosts

Hosts that support Web Fetch API (Request/Response)

On hosts that support the standard Web Fetch API (Workers-style environments), import createRequestHandler from @shopify/hydrogen (instead of react-router) and route requests through it:

import {createRequestHandler, createHydrogenContext} from '@shopify/hydrogen';

const hydrogenContext = createHydrogenContext({
  /* ... */
});

const handleRequest = createRequestHandler({
  /* ... */
  getLoadContext: () => hydrogenContext,
});

Node.js and other hosts

For Node-like environments, adapt Node requests to Fetch with @remix-run/node-fetch-server, then delegate to Hydrogen's handler:

import {createRequestHandler, createHydrogenContext} from '@shopify/hydrogen';
import {createRequestListener} from '@remix-run/node-fetch-server';
import http from 'http';

const handleNodeRequest = createRequestListener((request) => {
  const hydrogenContext = createHydrogenContext({
    /* ... */
  });

  const handleWebRequest = createRequestHandler({
    /* ... */
    getLoadContext: () => hydrogenContext,
  });

  return handleWebRequest(request);
});

http.createServer(handleNodeRequest);

Alternatively, if you can't delegate to Hydrogen's createRequestHandler, you can provide a custom Storefront API proxy in your server. See Hydrogen's implementation as a reference. In this case, ensure you manually pass sameDomainForStorefrontApi: true in the consent object for <Analytics.Provider> or as a prop to the useCustomerPrivacy hook.