@shopify/react-tracking-pixel
Version:
Allows React apps to easily embed tracking pixel iframes
16 lines (15 loc) • 936 B
JavaScript
import React from 'react';
import { Preconnect } from '@shopify/react-html';
const IFRAME_STYLES = { display: 'none' };
function TrackingPixel({ url, preconnectHosts = [] }) {
const preconnectHostsMarkup = preconnectHosts.map(preconnectHost => (React.createElement(Preconnect, { key: preconnectHost, source: preconnectHost })));
return (React.createElement(React.Fragment, null,
preconnectHostsMarkup,
React.createElement("iframe", { src: url, sandbox: "allow-scripts", title: url, scrolling: "no", frameBorder: 0, height: 1, width: 1, style: IFRAME_STYLES })));
}
export default React.memo(TrackingPixel, (oldProps, newProps) => {
const samePreconnectHosts = (oldProps.preconnectHosts == null && newProps.preconnectHosts == null) ||
(newProps.preconnectHosts || []).join() ===
(oldProps.preconnectHosts || []).join();
return oldProps.url === newProps.url && samePreconnectHosts;
});