Skip to main content

Permutive

Description​

Record Web integrates the Permutive audience segmentation SDK to track page views and user identity. Permutive enables contextual targeting and audience profiling based on user behaviour.

info

Permutive tracking is disabled by default. It activates only when NEXT_PUBLIC_PERMUTIVE_API_KEY is set.

Setup​

  1. Obtain the Workspace Public API Key from the client.
  2. Add it to your environment:
NEXT_PUBLIC_PERMUTIVE_API_KEY=YOUR_API_KEY
  1. Restart the dev server. The Permutive SDK will be injected automatically.

The Workspace ID is hardcoded as ba197bb2-11ba-4ec2-abfe-bd0e634be0e6.

How it works​

The Permutive SDK init snippet is loaded in src/app/layout.tsx via next/script with strategy="beforeInteractive", gated on NEXT_PUBLIC_PERMUTIVE_API_KEY. Loading it beforeInteractive guarantees the window.permutive stub exists before React effects (the tracking/identity hooks) run.

Two hooks are called from NavigationContext:

  • usePermutiveTracking(pathname) — fires permutive.track('Pageview', { url, title, referrer }) on every pathname change. The URL is https://recordplus.com{pathname}.
  • usePermutiveIdentity() — calls permutive.identify([{ tag: 'recordID', id: userId }]) when the user logs in and permutive.identify([]) on logout.

Validation​

Open browser DevTools → Network tab, filter for permutive.app. Each route change should produce a Pageview request. Verify that the url field in the request body matches https://recordplus.com{pathname}.

After login, check that the identity call fires with tag: 'recordID' and the user's ID.