@osano/osano-cmp-react-native 0.12.0 → 0.13.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@osano/osano-cmp-react-native",
-	"version": "0.12.0",
+	"version": "0.13.0",
 	"description": "Package and example for the react-native Osano CMP SDK",
 	"main": "lib/commonjs/index",
 	"module": "lib/module/index",
@@ -31,7 +31,8 @@
 	],
 	"scripts": {
 		"example": "yarn workspace osano-cmp-sdk-example",
-		"test": "jest src/services/__tests__/consent.test.ts src/__tests__/index.test.tsx",
+		"test": "jest src/services/__tests__/consent.test.ts src/__tests__/index.test.tsx src/services/__tests__/google-consent-mode.test.ts src/__tests__/OsanoLogger.test.ts",
+		"test:google-consent-mode": "jest src/services/__tests__/google-consent-mode.test.ts",
 		"typecheck": "tsc --noEmit",
 		"lint": "eslint \"**/*.{js,ts,tsx}\"",
 		"clean": "del-cli android/build example/android/build example/android/app/build example/ios/build lib",
@@ -64,6 +65,7 @@
 		"access": "public"
 	},
 	"devDependencies": {
+		"@biomejs/biome": "2.1.2",
 		"@commitlint/config-conventional": "^17.0.2",
 		"@docusaurus/core": "3.5.2",
 		"@docusaurus/module-type-aliases": "3.5.2",

package/src/ConsentManager.ts

@@ -1,5 +1,16 @@
-import type { Config, Mode, Palette } from './types/consent-config';
-import { EventEmitter, type EventSubscription } from './utils/EventEmitter';
+import { NativeModules, Platform } from 'react-native';
+import { CLEAR_CONSENT, SAVE_SUCCESS } from './actions';
+import { ConsentCategory, mappedJurisdictions } from './constants';
+import flavors, { defaultFlavor, type Flavor } from './flavors';
+import type { Store } from './hooks/useThunkReducer';
+import Tcf from './iab/tcf';
+import type {
+	GppVersionType,
+	TcfController,
+	TcfVersionType,
+	Tcf_v2,
+	UspVersionType,
+} from './iab/tcf/types';
 import type {
 	GvlVendor_v2,
 	GvlVendor_v3,
@@ -7,7 +18,8 @@ import type {
 	IabFrameworkType,
 	IabState,
 } from './iab/types';
-import { NativeModules, Platform } from 'react-native';
+import { getDeviceId } from './native/OsanoCmp';
+import { getConsent } from './selectors';
 import {
 	clearConsent as clearStoredConsent,
 	fetchConfig,
@@ -16,24 +28,15 @@ import {
 	hasStaleConfig,
 	storeConfig,
 } from './services/consent';
-import flavors, { defaultFlavor, type Flavor } from './flavors';
-import { get, merge } from './utils';
+import { GoogleConsentModeMapper } from './services/google-consent-mode-mapper';
 import type { OsanoOverrides } from './types';
-import type {
-	GppVersionType,
-	TcfController,
-	TcfVersionType,
-	Tcf_v2,
-	UspVersionType,
-} from './iab/tcf/types';
-import Tcf from './iab/tcf';
-import Translator from './utils/Translator';
-import { ConsentCategory, mappedJurisdictions } from './constants';
-import { getDeviceId } from './native/OsanoCmp';
-import type { Store } from './hooks/useThunkReducer';
+import type { Config, Mode, Palette } from './types/consent-config';
+import type { GoogleConsentModeCallback } from './types/google-consent-mode';
 import type { OsanoAction, OsanoState } from './types/store';
-import { CLEAR_CONSENT, SAVE_SUCCESS } from './actions';
-import { getConsent } from './selectors';
+import { get, merge } from './utils';
+import { EventEmitter, type EventSubscription } from './utils/EventEmitter';
+import { osanoLogger as OsanoLogger } from './utils/OsanoLogger';
+import Translator from './utils/Translator';
 
 const CONFIG_ID_ERROR = new Error('customerId and configId must be set');
 const CONFIG_NOT_FOUND_ERROR = new Error('Config not found');
@@ -162,12 +165,15 @@ async function fetchConfigWithRetries(
 			const config = await fetchConfig(customerId, configId);
 			return config;
 		} catch (error) {
-			if (attempt === retries) {
+			if (attempt < retries) {
+				OsanoLogger.warn(
+					`Attempt ${attempt} failed. Retrying in ${delay}ms...`,
+				);
+				await new Promise((resolve) => setTimeout(resolve, delay));
+				delay *= 2; // Exponential backoff
+			} else {
 				throw error;
 			}
-			console.warn(`Attempt ${attempt} failed. Retrying in ${delay}ms...`);
-			await new Promise((resolve) => setTimeout(resolve, delay));
-			delay *= 2; // Exponential backoff
 		}
 	}
 
@@ -616,6 +622,7 @@ export class ConsentManager {
 	private _consent?: ConsentCategory[];
 	private _translator: Translator = new Translator(this);
 	private _overridePalette?: Palette;
+	private _googleConsentModeCallback?: GoogleConsentModeCallback;
 
 	private _deviceId = '';
 	public get deviceId(): string {
@@ -670,7 +677,10 @@ export class ConsentManager {
 				try {
 					getDeviceId().then(setDeviceId);
 				} catch (err) {
-					console.log(`Error getting device id: ${err}`);
+					OsanoLogger.error(
+						`Error getting device id: ${err}`,
+						err instanceof Error ? err : undefined,
+					);
 				}
 				this._locale = NativeModules.I18nManager.localeIdentifier;
 				break;
@@ -679,7 +689,10 @@ export class ConsentManager {
 				try {
 					getDeviceId().then(setDeviceId);
 				} catch (err) {
-					console.log(`Error getting device id: ${err}`);
+					OsanoLogger.error(
+						`Error getting device id: ${err}`,
+						err instanceof Error ? err : undefined,
+					);
 				}
 				this._locale =
 					NativeModules.SettingsManager.settings.AppleLanguages[0] || //iOS 13
@@ -783,6 +796,7 @@ export class ConsentManager {
 							})
 							.then((consent) => {
 								this.consent = consent;
+								this.triggerGoogleConsentUpdate(consent);
 								return this._translator
 									.load(locale, onLangLoadSuccess, onLangLoadFailure)
 									.then((results) => {
@@ -847,6 +861,60 @@ export class ConsentManager {
 		return this._consent?.includes(category) ?? false;
 	}
 
+	/**
+	 * Set the Google Consent Mode callback function
+	 *
+	 * @param callback - Function to call when consent updates occur
+	 * @returns this ConsentManager instance for method chaining
+	 */
+	public setGoogleConsentModeCallback(
+		callback: GoogleConsentModeCallback,
+	): this {
+		this._googleConsentModeCallback = callback;
+		return this;
+	}
+
+	/**
+	 * Trigger Google Consent Mode update with current consent categories
+	 *
+	 * @param categories - Array of consent categories that have been granted
+	 * @public
+	 */
+	public triggerGoogleConsentUpdate(categories: ConsentCategory[]): void {
+		if (!this._config.googleConsent) {
+			OsanoLogger.debug('Google Consent Mode: disabled in configuration');
+			return;
+		}
+
+		if (!this._googleConsentModeCallback) {
+			OsanoLogger.debug('Google Consent Mode: callback not set');
+			return;
+		}
+
+		try {
+			OsanoLogger.debug(
+				`Google Consent Mode: triggering callback with categories: ${JSON.stringify(categories)}`,
+			);
+
+			const categorySet = new Set(categories);
+			const googleConsentMap =
+				GoogleConsentModeMapper.buildGoogleConsentMap(categorySet);
+
+			const consentStringMap = googleConsentMap.toStringMap();
+
+			OsanoLogger.debug(
+				`Google Consent Mode: consent map: ${JSON.stringify(consentStringMap)}`,
+			);
+			this._googleConsentModeCallback(consentStringMap);
+			OsanoLogger.debug('Google Consent Mode: callback executed successfully');
+		} catch (error) {
+			OsanoLogger.warn(
+				`Google Consent Mode: Error triggering callback: ${error}`,
+			);
+			// Don't re-throw - callback errors shouldn't break consent flow
+		}
+	}
+
 	public get loaded(): boolean {
 		return this._loaded;
 	}

package/src/ConsentUiBuilder.tsx

@@ -1,25 +1,26 @@
+import React, { useCallback, useEffect, useMemo } from 'react';
+import { StyleSheet, View } from 'react-native';
 import {
 	type GetState,
 	type MiddlewareNext,
 	type Store,
 	type ThunkDispatch,
 } from './hooks/useThunkReducer';
+import type { GoogleConsentModeCallback } from './types/google-consent-mode';
 import { type OsanoAction, type OsanoState } from './types/store';
-import React, { useCallback, useEffect, useMemo } from 'react';
-import { StyleSheet, View } from 'react-native';
 
+import { setConfig } from './actions';
 import { ConsentManager } from './ConsentManager';
-import { Dialog } from './views/Dialog';
-import { Drawer } from './views/Drawer';
 import { OsanoPrivateContext } from './context';
 import { createSharedStyles } from './styles';
-import { setConfig } from './actions';
+import { Dialog } from './views/Dialog';
+import { Drawer } from './views/Drawer';
 
 export const ConsentUiBuilder: React.FC<{
 	addMiddleware: (
 		m: (
-			store: Store<OsanoState, OsanoAction>
-		) => (next: MiddlewareNext<OsanoAction>) => MiddlewareNext<OsanoAction>
+			store: Store<OsanoState, OsanoAction>,
+		) => (next: MiddlewareNext<OsanoAction>) => MiddlewareNext<OsanoAction>,
 	) => void;
 	cmp: React.MutableRefObject<ConsentManager>;
 	dispatch: ThunkDispatch<OsanoState, OsanoAction, any>;
@@ -27,8 +28,8 @@ export const ConsentUiBuilder: React.FC<{
 	hideDisclosures: boolean;
 	removeMiddleware: (
 		m: (
-			store: Store<OsanoState, OsanoAction<any, any>>
-		) => (next: MiddlewareNext<OsanoAction>) => MiddlewareNext<OsanoAction>
+			store: Store<OsanoState, OsanoAction<any, any>>,
+		) => (next: MiddlewareNext<OsanoAction>) => MiddlewareNext<OsanoAction>,
 	) => void;
 }> = (props): React.ReactElement<View> => {
 	const {
@@ -45,16 +46,23 @@ export const ConsentUiBuilder: React.FC<{
 		(
 			path: string | string[],
 			translationProps = {},
-			defaultPhrase?: string
+			defaultPhrase?: string,
 		) => {
 			const translated = cmp.current.translator.translate(
 				path,
 				translationProps,
-				defaultPhrase
+				defaultPhrase,
 			);
 			return translated;
 		},
-		[cmp]
+		[cmp],
+	);
+
+	const setGoogleConsentModeCallback = useCallback(
+		(callback: GoogleConsentModeCallback) => {
+			cmp.current.setGoogleConsentModeCallback(callback);
+		},
+		[cmp],
 	);
 
 	const privateContext = useMemo(() => {
@@ -71,6 +79,7 @@ export const ConsentUiBuilder: React.FC<{
 			locale: cmp.current.translator.locale,
 			sharedStyles: createSharedStyles(cmp.current.config || {}),
 			stack,
+			setGoogleConsentModeCallback,
 		};
 	}, [
 		addMiddleware,
@@ -82,6 +91,7 @@ export const ConsentUiBuilder: React.FC<{
 		handleTranslate,
 		getState,
 		stack,
+		setGoogleConsentModeCallback,
 	]);
 
 	// Update our store with the config when CMP loads or config changes
@@ -92,7 +102,7 @@ export const ConsentUiBuilder: React.FC<{
 					config: cmp.current.config,
 					customerId: cmp.current.customerId,
 					configId: cmp.current.configId,
-				})
+				}),
 			);
 		}
 	}, [cmp, dispatch, cmp.current.loaded, cmp.current.config]);

package/src/commands.ts

@@ -7,17 +7,17 @@ import {
 	SAVE_SUCCESS,
 } from './actions';
 import type { ConsentManager } from './ConsentManager';
-import type { OsanoAction, OsanoState } from './types/store';
 import {
 	getConsent,
 	hasFetchedDisclosuresForCategory,
 	isLoadingDisclosures,
 } from './selectors';
+import type { OsanoAction, OsanoState } from './types/store';
 
 import { type ConsentCategory as ConsentCategoryType } from './constants';
-import { fetchDisclosures } from './services/disclosures';
-import { recordConsent } from './services/consent';
 import type { AsyncAction } from './hooks/useThunkReducer';
+import { recordConsent } from './services/consent';
+import { fetchDisclosures } from './services/disclosures';
 
 export const toggleDisclosure =
 	(payload: {
@@ -47,7 +47,7 @@ export const toggleDisclosure =
 				customerId,
 				configId,
 				undefined /* category */,
-				state.locale
+				state.locale,
 			)
 				.then((response) => {
 					const disclosureResults = response || [];
@@ -70,7 +70,7 @@ export const toggleDisclosure =
 
 export const saveConsent =
 	(
-		cmp: ConsentManager
+		cmp: ConsentManager,
 	): AsyncAction<
 		OsanoState,
 		OsanoAction<
@@ -87,9 +87,12 @@ export const saveConsent =
 		const consent = getConsent(state);
 		dispatch({ type: SAVE_BEGIN });
 		return recordConsent(cmp, consent)
-			.then((newConsent: ConsentCategoryType[] | null) =>
-				dispatch({ type: SAVE_SUCCESS, payload: newConsent })
-			)
+			.then((newConsent: ConsentCategoryType[] | null) => {
+				dispatch({ type: SAVE_SUCCESS, payload: newConsent });
+				if (newConsent) {
+					cmp.triggerGoogleConsentUpdate(newConsent);
+				}
+			})
 			.catch(() => {
 				dispatch({ type: SAVE_FAILURE, payload: oldConsent });
 			});

package/src/components/Button.tsx

@@ -1,24 +1,24 @@
-import { Path, Polygon, Svg } from 'react-native-svg';
+import React, { useCallback, useContext, useMemo } from 'react';
 import {
 	Pressable,
 	type PressableProps,
 	type StyleProp,
 	Text,
 	type TextStyle,
-	type ViewStyle,
 	type View,
+	type ViewStyle,
 } from 'react-native';
-import React, { useCallback, useContext, useMemo } from 'react';
+import { Path, Polygon, Svg } from 'react-native-svg';
 import { acceptAll, close, denyAll, goBack, showDrawer } from '../actions';
 import { saveConsent } from '../commands';
 
-import Locale from './Locale';
 import { OsanoPrivateContext } from '../context';
 import {
 	setAllPurposeConsent,
 	setAllSpecialFeatureConsent,
 	setAllVendorConsent,
 } from '../iab/tcf/actions';
+import Locale from './Locale';
 
 type ButtonProps = React.PropsWithoutRef<
 	Omit<PressableProps, 'style' | 'title'> & {
@@ -44,7 +44,7 @@ export const Button: React.FC<ButtonProps> = (props) => {
 			paddingHorizontal: 16,
 			flexBasis: 'auto',
 		}),
-		[buttonBackgroundColor, buttonForegroundColor]
+		[buttonBackgroundColor, buttonForegroundColor],
 	);
 	const buttonText: StyleProp<TextStyle> = useMemo(
 		() => ({
@@ -52,7 +52,7 @@ export const Button: React.FC<ButtonProps> = (props) => {
 			fontSize: 16,
 			fontWeight: 'bold',
 		}),
-		[buttonForegroundColor]
+		[buttonForegroundColor],
 	);
 
 	return (
@@ -71,7 +71,7 @@ export const Button: React.FC<ButtonProps> = (props) => {
 
 export const DenyButton = (props: ButtonProps) => {
 	const { cmp, dispatch } = useContext(OsanoPrivateContext);
-	const { onPress, title , testID} = props;
+	const { onPress, title, testID } = props;
 
 	const handleReject = useCallback(() => {
 		dispatch(setAllVendorConsent(false));
@@ -84,9 +84,9 @@ export const DenyButton = (props: ButtonProps) => {
 
 	return Button({
 		...props,
-		title: title || `buttons.deny`,
+		title: title || 'buttons.denyNonEssential',
 		onPress: onPress || handleReject,
-		testID: testID || 'Deny'
+		testID: testID || 'DenyNonEssential',
 	});
 };
 
@@ -104,7 +104,7 @@ export const AcceptButton = (props: ButtonProps) => {
 		...props,
 		title: title || 'buttons.accept',
 		onPress: onPress || handleAcceptConsent,
-		testID: 'Accept'
+		testID: 'Accept',
 	});
 };
 
@@ -113,7 +113,7 @@ export const CloseButton = React.forwardRef(
 		props: PressableProps & {
 			color?: string;
 		},
-		ref: React.Ref<View>
+		ref: React.Ref<View>,
 	) => {
 		const { color = '#fafafa', onPress, ...remain } = props;
 		const { cmp, dispatch } = useContext(OsanoPrivateContext);
@@ -134,13 +134,13 @@ export const CloseButton = React.forwardRef(
 				</Svg>
 			</Pressable>
 		);
-	}
+	},
 );
 
 export const BackButton = (
 	props: PressableProps & {
 		color?: string;
-	}
+	},
 ) => {
 	const { color = '#fafafa', onPress, ...remain } = props;
 	const { dispatch } = useContext(OsanoPrivateContext);
@@ -169,7 +169,7 @@ export const ManagePreferencesButton = (props: ButtonProps) => {
 		onPress: onPress || handleShowDrawer,
 		title: `buttons.dialog.openDrawer.${config?.jurisdiction}`,
 		defaultPhrase: 'buttons.managePreferences',
-		testID: `Manage Preferences`
+		testID: `Manage Preferences`,
 	});
 };
 
@@ -179,7 +179,7 @@ export const RejectAllButton = (props: ButtonProps) => {
 		...props,
 		title: `buttons.dialog.denyAll.${config?.jurisdiction}`,
 		defaultPhrase: 'buttons.denyAll',
-		testID: `Reject All`
+		testID: `Reject All`,
 	});
 };
 
@@ -196,7 +196,7 @@ export const SaveButton = (props: ButtonProps) => {
 		...props,
 		title: title || `buttons.save`,
 		onPress: onPress || handleSave,
-		testID: `Save`
+		testID: `Save`,
 	});
 };
 
@@ -216,6 +216,6 @@ export const AcceptAllButton = (props: ButtonProps) => {
 		...remain,
 		onPress: onPress || handleAcceptAllConsent,
 		title: `buttons.acceptAll`,
-		testID: `Accept All`
+		testID: `Accept All`,
 	});
 };

package/src/context.ts

@@ -5,14 +5,15 @@ import type {
 	Store,
 	ThunkDispatch,
 } from './hooks/useThunkReducer';
+import type { GoogleConsentModeCallback } from './types/google-consent-mode';
 import type { OsanoAction, OsanoState } from './types/store';
 
-import { ConsentCategory } from './constants';
 import React from 'react';
-import Translator from './utils/Translator';
-import { createSharedStyles } from './styles';
+import { ConsentCategory } from './constants';
 import { initialState } from './reducer';
+import { createSharedStyles } from './styles';
 import { noop } from './utils';
+import Translator from './utils/Translator';
 
 type OsanoPublicContextType = {
 	locale: string;
@@ -48,6 +49,7 @@ type OsanoPrivateContextType = {
 	locale: string;
 	sharedStyles: ReturnType<typeof createSharedStyles>;
 	translate: Translator['translate'];
+	setGoogleConsentModeCallback: (callback: GoogleConsentModeCallback) => void;
 };
 
 export const OsanoPublicContext = React.createContext<OsanoPublicContextType>({
@@ -77,5 +79,6 @@ export const OsanoPrivateContext = React.createContext<OsanoPrivateContextType>(
 		locale: 'en',
 		sharedStyles: createSharedStyles(),
 		translate: () => '',
+		setGoogleConsentModeCallback: noop,
 	},
 );

package/src/iab/tcf/constants.ts

@@ -21,6 +21,52 @@ export const DisplayStatusCodes = {
 	DISABLED: 'disabled',
 };
 
+export const IABKeys = {
+	LEGACY: {
+		CMP_PRESENT: 'IABConsent_CMPPresent',
+		SUBJECT_TO_GDPR: 'IABConsent_SubjectToGDPR',
+		CONSENT_STRING: 'IABConsent_ConsentString',
+		PARSED_PURPOSE_CONSENTS: 'IABConsent_ParsedPurposeConsents',
+		PARSED_VENDOR_CONSENTS: 'IABConsent_ParsedVendorConsents',
+	},
+	IABTCF: {
+		CMP_SDK_ID: 'IABTCF_CmpSdkID',
+		CMP_SDK_VERSION: 'IABTCF_CmpSdkVersion',
+		POLICY_VERSION: 'IABTCF_PolicyVersion',
+		GDPR_APPLIES: 'IABTCF_gdprApplies',
+		PUBLISHER_CC: 'IABTCF_PublisherCC',
+		PURPOSE_ONE_TREATMENT: 'IABTCF_PurposeOneTreatment',
+		USE_NON_STANDARD_TEXTS: 'IABTCF_UseNonStandardTexts',
+		TC_STRING: 'IABTCF_TCString',
+		VENDOR_CONSENTS: 'IABTCF_VendorConsents',
+		VENDOR_LEGITIMATE_INTERESTS: 'IABTCF_VendorLegitimateInterests',
+		PURPOSE_CONSENTS: 'IABTCF_PurposeConsents',
+		PURPOSE_LEGITIMATE_INTERESTS: 'IABTCF_PurposeLegitimateInterests',
+		SPECIAL_FEATURES_OPT_INS: 'IABTCF_SpecialFeaturesOptIns',
+		ADDTL_CONSENT: 'IABTCF_AddtlConsent',
+		ENABLE_ADVERTISER_CONSENT_MODE: 'IABTCF_EnableAdvertiserConsentMode',
+	},
+} as const;
+
+export const getAllIABKeys = () => [
+	...Object.values(IABKeys.LEGACY),
+	...Object.values(IABKeys.IABTCF),
+];
+
+export const DEFAULT_STORAGE_KEYS = {
+	LEGACY: Object.values(IABKeys.LEGACY),
+	IABTCF: [
+		IABKeys.IABTCF.GDPR_APPLIES,
+		IABKeys.IABTCF.TC_STRING,
+		IABKeys.IABTCF.PURPOSE_CONSENTS,
+		IABKeys.IABTCF.VENDOR_CONSENTS,
+		IABKeys.IABTCF.ADDTL_CONSENT,
+		IABKeys.IABTCF.ENABLE_ADVERTISER_CONSENT_MODE,
+	],
+} as const;
+
+export const CUSTOM_STORAGE_KEYS = Object.values(IABKeys.IABTCF);
+
 export const purposeIds = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
 export const purposeMap: Record<ConsentCategoryType, number[]> = {
 	[ConsentCategory.ESSENTIAL]: [1],