@hanzo/insights-react 1.8.1 → 1.9.1

package/src/components/__tests__/{PostHogErrorBoundary.test.tsx → InsightsErrorBoundary.test.tsx}

@@ -2,20 +2,20 @@
 
 import * as React from 'react'
 import { render } from '@testing-library/react'
-import { __POSTHOG_ERROR_MESSAGES, PostHogErrorBoundary } from '../PostHogErrorBoundary'
-import posthog from '@hanzo/insights'
+import { __INSIGHTS_ERROR_MESSAGES, InsightsErrorBoundary } from '../InsightsErrorBoundary'
+import insights from '@hanzo/insights'
 
-describe('PostHogErrorBoundary component', () => {
+describe('InsightsErrorBoundary component', () => {
     mockFunction(console, 'error')
     mockFunction(console, 'warn')
-    mockFunction(posthog, 'captureException')
+    mockFunction(insights, 'captureException')
 
     const renderWithError = (props: any) => render(<RenderWithError {...props} />)
     const renderWithoutError = (props?: any) => render(<RenderWithoutError {...props} />)
 
     it('should call captureException with error message', () => {
         const { container } = renderWithError({ message: 'Test error', fallback: <div></div> })
-        expect(posthog.captureException).toHaveBeenCalledWith(new Error('Test error'), undefined)
+        expect(insights.captureException).toHaveBeenCalledWith(new Error('Test error'), undefined)
         expect(container.innerHTML).toBe('<div></div>')
         expect(console.error).toHaveBeenCalledTimes(1)
         expect((console.error as any).mock.calls[0][1].message).toEqual('Test error')
@@ -23,22 +23,22 @@ describe('PostHogErrorBoundary component', () => {
 
     it('should warn user when fallback is null', () => {
         const { container } = renderWithError({ fallback: null })
-        expect(posthog.captureException).toHaveBeenCalledWith(new Error('Error'), undefined)
+        expect(insights.captureException).toHaveBeenCalledWith(new Error('Error'), undefined)
         expect(container.innerHTML).toBe('')
-        expect(console.warn).toHaveBeenCalledWith(__POSTHOG_ERROR_MESSAGES.INVALID_FALLBACK)
+        expect(console.warn).toHaveBeenCalledWith(__INSIGHTS_ERROR_MESSAGES.INVALID_FALLBACK)
     })
 
     it('should warn user when fallback is a string', () => {
         const { container } = renderWithError({ fallback: 'hello' })
-        expect(posthog.captureException).toHaveBeenCalledWith(new Error('Error'), undefined)
+        expect(insights.captureException).toHaveBeenCalledWith(new Error('Error'), undefined)
         expect(container.innerHTML).toBe('')
-        expect(console.warn).toHaveBeenCalledWith(__POSTHOG_ERROR_MESSAGES.INVALID_FALLBACK)
+        expect(console.warn).toHaveBeenCalledWith(__INSIGHTS_ERROR_MESSAGES.INVALID_FALLBACK)
     })
 
     it('should add additional properties before sending event (as object)', () => {
         const props = { team_id: '1234' }
         renderWithError({ message: 'Kaboom', additionalProperties: props })
-        expect(posthog.captureException).toHaveBeenCalledWith(new Error('Kaboom'), props)
+        expect(insights.captureException).toHaveBeenCalledWith(new Error('Kaboom'), props)
     })
 
     it('should add additional properties before sending event (as function)', () => {
@@ -50,7 +50,7 @@ describe('PostHogErrorBoundary component', () => {
                 return props
             },
         })
-        expect(posthog.captureException).toHaveBeenCalledWith(new Error('Kaboom'), props)
+        expect(insights.captureException).toHaveBeenCalledWith(new Error('Kaboom'), props)
     })
 
     it('should render children without errors', () => {
@@ -62,13 +62,13 @@ describe('PostHogErrorBoundary component', () => {
 describe('captureException processing', () => {
     mockFunction(console, 'error')
     mockFunction(console, 'warn')
-    mockFunction(posthog, 'capture')
+    mockFunction(insights, 'capture')
 
     const renderWithError = (props: any) => render(<RenderWithError {...props} />)
 
     it('should call capture with a stacktrace', () => {
         renderWithError({ message: 'Kaboom', fallback: <div></div>, additionalProperties: {} })
-        const captureCalls = (posthog.capture as jest.Mock).mock.calls
+        const captureCalls = (insights.capture as jest.Mock).mock.calls
         expect(captureCalls.length).toBe(1)
         const exceptionList = captureCalls[0][1].$exception_list
         expect(exceptionList.length).toBe(1)
@@ -95,16 +95,16 @@ function ComponentWithError({ message }: { message: string }): React.ReactElemen
 
 function RenderWithError({ message = 'Error', fallback, additionalProperties }: any) {
     return (
-        <PostHogErrorBoundary fallback={fallback} additionalProperties={additionalProperties}>
+        <InsightsErrorBoundary fallback={fallback} additionalProperties={additionalProperties}>
             <ComponentWithError message={message} />
-        </PostHogErrorBoundary>
+        </InsightsErrorBoundary>
     )
 }
 
 function RenderWithoutError({ additionalProperties }: any) {
     return (
-        <PostHogErrorBoundary fallback={<div></div>} additionalProperties={additionalProperties}>
+        <InsightsErrorBoundary fallback={<div></div>} additionalProperties={additionalProperties}>
             <div>Amazing content</div>
-        </PostHogErrorBoundary>
+        </InsightsErrorBoundary>
     )
 }

package/src/components/__tests__/{PostHogFeature.test.tsx → InsightsFeature.test.tsx}

@@ -1,8 +1,8 @@
 import * as React from 'react'
 import { useState } from 'react'
 import { render, screen, fireEvent } from '@testing-library/react'
-import { PostHogProvider, PostHog } from '../../context'
-import { PostHogFeature } from '../'
+import { InsightsProvider, Insights } from '../../context'
+import { InsightsFeature } from '../'
 import '@testing-library/jest-dom'
 
 const FEATURE_FLAG_STATUS: Record<string, string | boolean> = {
@@ -20,16 +20,16 @@ const FEATURE_FLAG_PAYLOADS: Record<string, any> = {
     },
 }
 
-describe('PostHogFeature component', () => {
-    let posthog: PostHog
+describe('InsightsFeature component', () => {
+    let insights: Insights
 
-    const renderWith = (instance: PostHog, flag = 'test', matchValue: string | boolean | undefined = true) =>
+    const renderWith = (instance: Insights, flag = 'test', matchValue: string | boolean | undefined = true) =>
         render(
-            <PostHogProvider client={instance}>
-                <PostHogFeature flag={flag} match={matchValue}>
+            <InsightsProvider client={instance}>
+                <InsightsFeature flag={flag} match={matchValue}>
                     <div data-testid="helloDiv">Hello</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
     beforeEach(() => {
@@ -44,7 +44,7 @@ describe('PostHogFeature component', () => {
         // eslint-disable-next-line compat/compat
         window.IntersectionObserver = mockIntersectionObserver
 
-        posthog = {
+        insights = {
             isFeatureEnabled: (flag: string) => !!FEATURE_FLAG_STATUS[flag],
             getFeatureFlag: (flag: string) => FEATURE_FLAG_STATUS[flag],
             getFeatureFlagPayload: (flag: string) => FEATURE_FLAG_PAYLOADS[flag],
@@ -62,44 +62,44 @@ describe('PostHogFeature component', () => {
             featureFlags: {
                 hasLoadedFlags: true,
             },
-        } as unknown as PostHog
+        } as unknown as Insights
     })
 
     it('should track interactions with the feature component', () => {
-        renderWith(posthog)
+        renderWith(insights)
 
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).toHaveBeenCalledWith('$feature_interaction', {
+        expect(insights.capture).toHaveBeenCalledWith('$feature_interaction', {
             feature_flag: 'test',
             $set: { '$feature_interaction/test': true },
         })
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should not fire for every interaction with the feature component', () => {
-        renderWith(posthog)
+        renderWith(insights)
 
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).toHaveBeenCalledWith('$feature_interaction', {
+        expect(insights.capture).toHaveBeenCalledWith('$feature_interaction', {
             feature_flag: 'test',
             $set: { '$feature_interaction/test': true },
         })
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
 
         fireEvent.click(screen.getByTestId('helloDiv'))
         fireEvent.click(screen.getByTestId('helloDiv'))
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should track an interaction with each child node of the feature component', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'test'} match={true}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'test'} match={true}>
                     <div data-testid="helloDiv">Hello</div>
                     <div data-testid="worldDiv">World!</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         fireEvent.click(screen.getByTestId('helloDiv'))
@@ -107,29 +107,29 @@ describe('PostHogFeature component', () => {
         fireEvent.click(screen.getByTestId('worldDiv'))
         fireEvent.click(screen.getByTestId('worldDiv'))
         fireEvent.click(screen.getByTestId('worldDiv'))
-        expect(posthog.capture).toHaveBeenCalledWith('$feature_interaction', {
+        expect(insights.capture).toHaveBeenCalledWith('$feature_interaction', {
             feature_flag: 'test',
             $set: { '$feature_interaction/test': true },
         })
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should not fire events when interaction is disabled', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'test'} match={true} trackInteraction={false}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'test'} match={true} trackInteraction={false}>
                     <div data-testid="helloDiv">Hello</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         fireEvent.click(screen.getByTestId('helloDiv'))
         fireEvent.click(screen.getByTestId('helloDiv'))
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should fire events when interaction is disabled but re-enabled after', () => {
@@ -146,37 +146,37 @@ describe('PostHogFeature component', () => {
                     >
                         Click me
                     </div>
-                    <PostHogFeature flag={'test'} match={true} trackInteraction={trackInteraction}>
+                    <InsightsFeature flag={'test'} match={true} trackInteraction={trackInteraction}>
                         <div data-testid="helloDiv">Hello</div>
-                    </PostHogFeature>
+                    </InsightsFeature>
                 </>
             )
         }
 
         render(
-            <PostHogProvider client={posthog}>
+            <InsightsProvider client={insights}>
                 <DynamicUpdateComponent />
-            </PostHogProvider>
+            </InsightsProvider>
         )
 
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         fireEvent.click(screen.getByTestId('clicker'))
         fireEvent.click(screen.getByTestId('helloDiv'))
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).toHaveBeenCalledWith('$feature_interaction', {
+        expect(insights.capture).toHaveBeenCalledWith('$feature_interaction', {
             feature_flag: 'test',
             $set: { '$feature_interaction/test': true },
         })
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should not show the feature component if the flag is not enabled', () => {
-        renderWith(posthog, 'test_value')
+        renderWith(insights, 'test_value')
 
         expect(screen.queryByTestId('helloDiv')).not.toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         // check if any elements are found
         const allTags = screen.queryAllByText(/.*/)
@@ -189,101 +189,101 @@ describe('PostHogFeature component', () => {
 
     it('should fallback when provided', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'test_false'} match={true} fallback={<div data-testid="nope">Nope</div>}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'test_false'} match={true} fallback={<div data-testid="nope">Nope</div>}>
                     <div data-testid="helloDiv">Hello</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         expect(screen.queryByTestId('helloDiv')).not.toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         fireEvent.click(screen.getByTestId('nope'))
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should handle showing multivariate flags with bool match', () => {
-        renderWith(posthog, 'multivariate_feature')
+        renderWith(insights, 'multivariate_feature')
 
         expect(screen.queryByTestId('helloDiv')).not.toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should handle showing multivariate flags with incorrect match', () => {
-        renderWith(posthog, 'multivariate_feature', 'string-valueCXCC')
+        renderWith(insights, 'multivariate_feature', 'string-valueCXCC')
 
         expect(screen.queryByTestId('helloDiv')).not.toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should handle showing multivariate flags', () => {
-        renderWith(posthog, 'multivariate_feature', 'string-value')
+        renderWith(insights, 'multivariate_feature', 'string-value')
 
         expect(screen.queryByTestId('helloDiv')).toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         fireEvent.click(screen.getByTestId('helloDiv'))
-        expect(posthog.capture).toHaveBeenCalledWith('$feature_interaction', {
+        expect(insights.capture).toHaveBeenCalledWith('$feature_interaction', {
             feature_flag: 'multivariate_feature',
             feature_flag_variant: 'string-value',
             $set: { '$feature_interaction/multivariate_feature': 'string-value' },
         })
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should handle payload flags', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'example_feature_payload'} match={'test'}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'example_feature_payload'} match={'test'}>
                     {(payload: any) => {
                         return <div data-testid={`hi_${payload.name}`}>Hullo</div>
                     }}
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         expect(screen.queryByTestId('hi_example_feature_1_payload')).toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
 
         fireEvent.click(screen.getByTestId('hi_example_feature_1_payload'))
-        expect(posthog.capture).toHaveBeenCalledTimes(1)
+        expect(insights.capture).toHaveBeenCalledTimes(1)
     })
 
     it('should not render when flag does not exist and no match is specified', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'nonexistent_flag'}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'nonexistent_flag'}>
                     <div data-testid="helloDiv">Hello</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         expect(screen.queryByTestId('helloDiv')).not.toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should render fallback when flag does not exist (like new-cta example)', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'new-cta'} fallback={<div data-testid="oldButton">Old Button</div>}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'new-cta'} fallback={<div data-testid="oldButton">Old Button</div>}>
                     <div data-testid="newButton">New Button</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         expect(screen.queryByTestId('newButton')).not.toBeInTheDocument()
         expect(screen.queryByTestId('oldButton')).toBeInTheDocument()
-        expect(posthog.capture).not.toHaveBeenCalled()
+        expect(insights.capture).not.toHaveBeenCalled()
     })
 
     it('should render content when match=false and flag variant is false', () => {
         render(
-            <PostHogProvider client={posthog}>
-                <PostHogFeature flag={'test_false'} match={false}>
+            <InsightsProvider client={insights}>
+                <InsightsFeature flag={'test_false'} match={false}>
                     <div data-testid="disabledUI">Show when disabled</div>
-                </PostHogFeature>
-            </PostHogProvider>
+                </InsightsFeature>
+            </InsightsProvider>
         )
 
         expect(screen.queryByTestId('disabledUI')).toBeInTheDocument()

package/src/components/index.ts

@@ -1,7 +1,7 @@
-export * from './PostHogFeature'
-export * from './PostHogCaptureOnViewed'
+export * from './InsightsFeature'
+export * from './InsightsCaptureOnViewed'
 export {
-    PostHogErrorBoundary,
-    PostHogErrorBoundaryProps,
-    PostHogErrorBoundaryFallbackProps,
-} from './PostHogErrorBoundary'
+    InsightsErrorBoundary,
+    InsightsErrorBoundaryProps,
+    InsightsErrorBoundaryFallbackProps,
+} from './InsightsErrorBoundary'

package/src/context/InsightsContext.ts

@@ -0,0 +1,9 @@
+import insightsJs, { BootstrapConfig } from '@hanzo/insights'
+import { createContext } from 'react'
+
+export type Insights = typeof insightsJs
+
+export const InsightsContext = createContext<{ client: Insights; bootstrap?: BootstrapConfig }>({
+    client: insightsJs,
+    bootstrap: undefined,
+})

package/src/context/InsightsProvider.tsx

@@ -0,0 +1,108 @@
+/* eslint-disable no-console */
+import insightsJs, { InsightsConfig as InsightsConfig } from '@hanzo/insights'
+
+import React, { useEffect, useMemo, useRef } from 'react'
+import { Insights, InsightsContext } from './InsightsContext'
+import { isDeepEqual } from '../utils/object-utils'
+
+interface PreviousInitialization {
+    apiKey: string
+    options: Partial<InsightsConfig>
+}
+
+type WithOptionalChildren<T> = T & { children?: React.ReactNode | undefined }
+
+/**
+ * Props for the InsightsProvider component.
+ * This is a discriminated union type that ensures mutually exclusive props:
+ *
+ * - If `client` is provided, `apiKey` and `options` must not be provided
+ * - If `apiKey` is provided, `client` must not be provided, and `options` is optional
+ */
+type InsightsProviderProps =
+    | { client: Insights; apiKey?: never; options?: never }
+    | { apiKey: string; options?: Partial<InsightsConfig>; client?: never }
+
+/**
+ * InsightsProvider is a React context provider for Hanzo Insights analytics.
+ * It can be initialized in two mutually exclusive ways:
+ *
+ * 1. By providing an existing Insights `client` instance
+ * 2. By providing an `apiKey` (and optionally `options`) to create a new client
+ *
+ * These initialization methods are mutually exclusive - you must use one or the other,
+ * but not both simultaneously.
+ */
+export function InsightsProvider({ children, client, apiKey, options }: WithOptionalChildren<InsightsProviderProps>) {
+    const previousInitializationRef = useRef<PreviousInitialization | null>(null)
+
+    const insights = useMemo(() => {
+        if (client) {
+            if (apiKey) {
+                console.warn(
+                    '[Insights] You have provided both `client` and `apiKey` to `InsightsProvider`. `apiKey` will be ignored in favour of `client`.'
+                )
+            }
+            if (options) {
+                console.warn(
+                    '[Insights] You have provided both `client` and `options` to `InsightsProvider`. `options` will be ignored in favour of `client`.'
+                )
+            }
+            return client
+        }
+
+        if (apiKey) {
+            return insightsJs
+        }
+
+        console.warn(
+            '[Insights] No `apiKey` or `client` were provided to `InsightsProvider`. Using default global instance. You must initialize it manually. This is not recommended behavior.'
+        )
+        return insightsJs
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [client, apiKey, JSON.stringify(options)])
+
+    useEffect(() => {
+        if (client) {
+            return
+        }
+        const previousInitialization = previousInitializationRef.current
+
+        if (!previousInitialization) {
+            if (insightsJs.__loaded) {
+                console.warn('[Insights] `insights` was already loaded elsewhere. This may cause issues.')
+            }
+
+            insightsJs.init(apiKey, options)
+
+            previousInitializationRef.current = {
+                apiKey: apiKey,
+                options: options ?? {},
+            }
+        } else {
+            if (apiKey !== previousInitialization.apiKey) {
+                console.warn(
+                    "[Insights] You have provided a different `apiKey` to `InsightsProvider` than the one that was already initialized. This is not supported by our provider and we'll keep using the previous key. If you need to toggle between API Keys you need to control the `client` yourself and pass it in as a prop rather than an `apiKey` prop."
+                )
+            }
+
+            if (options && !isDeepEqual(options, previousInitialization.options)) {
+                insightsJs.set_config(options)
+            }
+
+            previousInitializationRef.current = {
+                apiKey: apiKey,
+                options: options ?? {},
+            }
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [client, apiKey, JSON.stringify(options)])
+
+    return (
+        <InsightsContext.Provider
+            value={{ client: insights, bootstrap: options?.bootstrap ?? client?.config?.bootstrap }}
+        >
+            {children}
+        </InsightsContext.Provider>
+    )
+}

package/src/context/__tests__/{PostHogContext.test.tsx → InsightsContext.test.tsx}

@@ -1,15 +1,15 @@
 import * as React from 'react'
 import { render } from '@testing-library/react'
-import { PostHogProvider, PostHog } from '..'
+import { InsightsProvider, Insights } from '..'
 
-describe('PostHogContext component', () => {
-    const posthog = {} as unknown as PostHog
+describe('InsightsContext component', () => {
+    const insights = {} as unknown as Insights
 
     it('should return a client instance from the context if available', () => {
         render(
-            <PostHogProvider client={posthog}>
+            <InsightsProvider client={insights}>
                 <div>Hello</div>
-            </PostHogProvider>
+            </InsightsProvider>
         )
     })
 
@@ -20,16 +20,16 @@ describe('PostHogContext component', () => {
         expect(() => {
             render(
                 // we have to cast `as any` so that we can test for when
-                // posthog might not exist - in SSR for example
-                <PostHogProvider client={undefined as any}>
+                // insights might not exist - in SSR for example
+                <InsightsProvider client={undefined as any}>
                     <div>Hello</div>
-                </PostHogProvider>
+                </InsightsProvider>
             )
         }).not.toThrow()
 
         // eslint-disable-next-line no-console
         expect(console.warn).toHaveBeenCalledWith(
-            '[PostHog.js] No `apiKey` or `client` were provided to `PostHogProvider`. Using default global `window.posthog` instance. You must initialize it manually. This is not recommended behavior.'
+            '[Insights] No `apiKey` or `client` were provided to `InsightsProvider`. Using default global instance. You must initialize it manually. This is not recommended behavior.'
         )
     })
 })