@revjet/react-revjet-tag

React RevJet Tag

RevJet content Tag for React.

Usage Example

import React from 'react'
import { isViewableEvent, RevJetTag, TrackingEvent } from '@revjet/react-revjet-tag'

export interface AppProps {}

const tagProperties: TagProperties = {
	_tag: 'tagXXXX',
	_plc_id: '12345',
	_key: 'xxx',
	debug: 'emulate',
	_opts: {
		custom_domain: 'ads.revjet.com',
		autohide: false,
		responsive: true,
		responsive_height: 'dynamic',
		delivery_method: 'banner',
		_imp_banner_size: '640x480'
	},
	_custom_parameter: 'Custom Parameter'
}

export function App(_props: AppProps) {
	// Optional
	const onBeforeLoad = useCallback(() => {
		console.log('onBeforeLoad')
	}, [])

	// Optional
	const onLoad = useCallback(() => {
		console.log('onLoad')
	}, [])

	// Optional
	const onError = useCallback(
		(err) => {
			console.log('onError', err)
		},
		[]
	)

	// Optional
	const onTrackingEvent = useCallback((type: string, event: TrackingEvent) => {
		const properties = event.getProperties ? event.getProperties() : { type: type }
		if (isViewableEvent(event)) {
			console.log('Received viewable tracking event:', properties)
		} else {
			console.log('Received tracking event:', properties)
		}
	}, [])

	return (
		<div>
			<RevJetTag
				tagProperties={tagProperties}
				onBeforeLoad={onBeforeLoad}
				onLoad={onLoad}
				onError={onError}
				onTrackingEvent={onTrackingEvent}
			/>
		</div>
	)
}