diff --git a/.changeset/chilly-trains-fix.md b/.changeset/chilly-trains-fix.md new file mode 100644 index 000000000..05127c6de --- /dev/null +++ b/.changeset/chilly-trains-fix.md @@ -0,0 +1,5 @@ +--- +"@scaleway/use-analytics": patch +--- + +Add timeout option also when shouldRenderOnlyWhenReady is not set diff --git a/packages/use-analytics/src/analytics/constants.ts b/packages/use-analytics/src/analytics/constants.ts index 4a186570a..4058d49dd 100644 --- a/packages/use-analytics/src/analytics/constants.ts +++ b/packages/use-analytics/src/analytics/constants.ts @@ -1,5 +1,7 @@ import type { ConsentOptions, LoadOptions } from '@rudderstack/analytics-js' +export const defaultTimeout = 5000 + export const defaultConsentOptions: ConsentOptions = { trackConsent: false, /** diff --git a/packages/use-analytics/src/analytics/useAnalytics.tsx b/packages/use-analytics/src/analytics/useAnalytics.tsx index f92b56d37..910109521 100644 --- a/packages/use-analytics/src/analytics/useAnalytics.tsx +++ b/packages/use-analytics/src/analytics/useAnalytics.tsx @@ -5,7 +5,7 @@ import type { ReactNode } from 'react' import { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect' import { destSDKBaseURL, pluginsSDKBaseURL } from '../constants' import type { CategoryKind } from '../types' -import { defaultConsentOptions, defaultLoadOptions } from './constants' +import { defaultConsentOptions, defaultLoadOptions, defaultTimeout } from './constants' import { normalizeIdsMigration } from './normalizeIdsMigration' type Analytics = RudderAnalytics @@ -50,7 +50,7 @@ export type AnalyticsProviderProps = { loadOptions?: LoadOptions /** - * This option force provider to render children only when isAnalytics is ready + * This option force provider to render children only when isAnalytics is ready, you can also set a timeout to prevent blocking indefinitely and use isAnalyticsReady to show a loading screen. */ shouldRenderOnlyWhenReady?: boolean /** @@ -92,11 +92,9 @@ export function AnalyticsProvider({ // This effect will unlock the case where we have a failure with the load of the analytics.load as rudderstack doesn't provider any solution for this case. useEffect(() => { let timer: ReturnType | undefined - if (!isAnalyticsReady && timeout) { - if (shouldRenderOnlyWhenReady) { - timer = setTimeout(() => setIsAnalyticsReady(true), timeout) + if (!isAnalyticsReady && (Number.isFinite(timeout) || shouldRenderOnlyWhenReady)) { + timer = setTimeout(() => setIsAnalyticsReady(true), timeout ?? defaultTimeout) onError?.(new Error('Analytics Setup Timeout')) - } } return () => {