Files
supabase/apps/studio/hooks/misc/useTableCreateGeneratePolicies.ts
Pamela Chia 30093962d4 feat(telemetry): dedupe experiment exposure events by PostHog session ID (#42386)
## Summary

Adds session-based deduplication for experiment exposure events.
Previously, exposure events used `useRef` which reset on page refresh,
causing duplicate events. Now events dedupe by PostHog session ID using
`sessionStorage`, firing once per session even across page refreshes.

## Changes

- Add `captureExperimentExposure()` method to `PostHogClient` with
session-based dedupe
- Add `getSessionId()` method to retrieve PostHog session ID
- Create `useTrackExperimentExposure` hook for clean usage
- Migrate existing experiments to new hook:
  - RLS option experiment (`/new/[slug]`)
  - Realtime button experiment
  - Table create generate policies experiment

## How it works

1. Event triggered → if PostHog not ready, queue to `pendingExposures[]`
2. PostHog `loaded` → flush queue through `fireExposureIfNew()`
3. `fireExposureIfNew()` checks
`sessionStorage['ph_exposed:{experimentId}']`
4. If value matches current session ID → skip (already fired)
5. If differs or missing → fire event, store session ID

## Testing

- [x] Tested locally and on preview - verified on project creation page
- [x] PostHog events sent successfully (200 responses)
- [x] Session deduplication working (no duplicate events on page refresh
or org switch)
- [x] Lint passes with 0 errors

**Quick test:**
1. Go to `/new/<org-slug>` project creation page
2. Check `sessionStorage` for `ph_exposed:project_creation_rls_option`
key
3. Refresh page - event should not fire again (same session ID)

## Linear

Resolves GROWTH-608

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* More reliable experiment exposure reporting with session-aware
deduplication, queued delivery, and consent respect to ensure events are
recorded when available.
* **Bug Fixes**
* Prevents duplicate exposure events within a session and avoids firing
exposures without a valid session.
* **Refactor**
* Consolidated disparate exposure-tracking logic into a unified
hook-based approach, simplifying tracking across the app.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-02-02 22:01:34 +08:00

83 lines
2.3 KiB
TypeScript

import dayjs from 'dayjs'
import utc from 'dayjs/plugin/utc'
import { useTrackExperimentExposure } from 'hooks/misc/useTrackExperimentExposure'
import { usePHFlag } from 'hooks/ui/useFlag'
import { IS_PLATFORM } from 'lib/constants'
import { useMemo } from 'react'
dayjs.extend(utc)
export type TableCreateGeneratePoliciesVariant = 'control' | 'variation'
const VALID_VARIANTS: TableCreateGeneratePoliciesVariant[] = ['control', 'variation']
export function isValidExperimentVariant(
value: unknown
): value is TableCreateGeneratePoliciesVariant {
return (
typeof value === 'string' &&
VALID_VARIANTS.includes(value as TableCreateGeneratePoliciesVariant)
)
}
interface UseTableCreateGeneratePoliciesOptions {
/**
* Whether this is a new table being created
*/
isNewRecord?: boolean
/**
* Project creation timestamp
*/
projectInsertedAt?: string
}
interface UseTableCreateGeneratePoliciesResult {
/**
* Whether the generate policies feature is enabled
*/
enabled: boolean
}
/**
* Hook to manage the table create generate policies feature flag.
* Handles feature flag determination and exposure tracking.
*
* @param options Configuration for feature targeting
* @returns Feature state including whether it's enabled
*/
export function useTableCreateGeneratePolicies({
isNewRecord = false,
projectInsertedAt,
}: UseTableCreateGeneratePoliciesOptions): UseTableCreateGeneratePoliciesResult {
const tableCreateGeneratePoliciesFlag = usePHFlag<string>('tableCreateGeneratePolicies')
const enabled = useMemo(() => {
if (!IS_PLATFORM) return false
if (tableCreateGeneratePoliciesFlag !== 'variation') return false
return true
}, [tableCreateGeneratePoliciesFlag])
const daysSinceCreation = useMemo(() => {
if (!projectInsertedAt) return undefined
const insertedDate = dayjs.utc(projectInsertedAt)
if (!insertedDate.isValid()) return undefined
return dayjs.utc().diff(insertedDate, 'day')
}, [projectInsertedAt])
const shouldTrack =
IS_PLATFORM &&
isNewRecord &&
isValidExperimentVariant(tableCreateGeneratePoliciesFlag) &&
daysSinceCreation !== undefined
useTrackExperimentExposure(
'table_create_generate_policies',
shouldTrack ? tableCreateGeneratePoliciesFlag : undefined,
{ days_since_project_creation: daysSinceCreation }
)
return {
enabled,
}
}