pnpm add @aient/otel-browser

import { registerOTelBrowser } from '@aient/otel-browser'

registerOTelBrowser({
  publishableKey: import.meta.env.VITE_AIENT_PUBLISHABLE_KEY,
  serviceName: 'web',
  installationId: '0198d2f4-1111-7111-8111-111111111111', // caller-owned
  contextAttributes: { 'business.id': 'business_123' },
  release: {
    commit: import.meta.env.VITE_COMMIT_SHA,
    branch: import.meta.env.VITE_COMMIT_REF,
    environment: import.meta.env.MODE,
  },
})

'use client'

import { useEffect, useRef } from 'react'
import { registerOTelBrowser, type BrowserSDK } from '@aient/otel-browser'

export function TelemetryInit({ analyticsConsent, userId, pseudoId, businessId }: { analyticsConsent: boolean; userId?: string | null; pseudoId?: string | null; businessId?: string | null }) {
  const sdkRef = useRef<BrowserSDK | null>(null)

  useEffect(() => {
    const installationKey = 'my-app.otel.installation-id'
    if (!analyticsConsent) {
      localStorage.removeItem(installationKey)
      return
    }
    const installationId = localStorage.getItem(installationKey) ?? crypto.randomUUID()
    localStorage.setItem(installationKey, installationId)

    const sdk = registerOTelBrowser({
      publishableKey: process.env.NEXT_PUBLIC_AIENT_PUBLISHABLE_KEY!,
      serviceName: process.env.NEXT_PUBLIC_OTEL_SERVICE_NAME ?? 'web',
      installationId,
      release: {
        commit: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA ?? 'dev',
        branch: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_REF ?? 'local',
        environment: process.env.NEXT_PUBLIC_VERCEL_ENV ?? 'development',
      },
    })
    sdkRef.current = sdk
    return () => {
      sdkRef.current = null
      void sdk.shutdown()
    }
  }, [analyticsConsent])

  useEffect(() => {
    if (userId || pseudoId) {
      sdkRef.current?.identify({ ...(userId ? { userId } : {}), ...(pseudoId ? { pseudoId } : {}) })
    } else {
      sdkRef.current?.clearUser()
    }
  }, [analyticsConsent, userId, pseudoId])

  useEffect(() => {
    sdkRef.current?.setContextAttributes(businessId ? { 'business.id': businessId } : null)
  }, [analyticsConsent, businessId])

  return null
}