diff --git a/src/components/home-main-content/home-main-content.jsx b/src/components/home-main-content/home-main-content.jsx index ba8949e25..37c4af279 100644 --- a/src/components/home-main-content/home-main-content.jsx +++ b/src/components/home-main-content/home-main-content.jsx @@ -4,10 +4,19 @@ import HomeHighlightCards from '../home-highlight-cards/home-highlight-cards'; import { mainContent, sectionHeader, highlightCardsHeader } from './home-main-content.module.scss'; import { faChartColumn } from '@fortawesome/free-solid-svg-icons'; import CustomLink from '../links/custom-link/custom-link'; +import Analytics from '../../utils/analytics/analytics'; +import { ga4DataLayerPush } from '../../helpers/google-analytics/google-analytics-helper'; const HomeMainContent = () => { + const analyticsHandler = label => { + Analytics.event({ + category: 'Homepage Navigation', + action: 'Citation Click', + label: label, + }); + }; const datasetSearchPage = ( - + analyticsHandler('Dataset Search')}> Dataset Search page ); diff --git a/src/components/topics-section/homepage-tile/homepage-tile.jsx b/src/components/topics-section/homepage-tile/homepage-tile.jsx index ca3e6999b..00576e9bb 100644 --- a/src/components/topics-section/homepage-tile/homepage-tile.jsx +++ b/src/components/topics-section/homepage-tile/homepage-tile.jsx @@ -22,6 +22,7 @@ import { Grid } from '@material-ui/core'; import Analytics from '../../../utils/analytics/analytics'; import { ga4DataLayerPush } from '../../../helpers/google-analytics/google-analytics-helper'; +let homepageTile; const ExplainerTile = ({ content, images, width, layout, hasMobileImage, explainerTile }) => { let desktopImage, mobileImage; if (images) { @@ -87,10 +88,28 @@ const ExplainerTile = ({ content, images, width, layout, hasMobileImage, explain }); }; + const handleMouseEnter = label => { + homepageTile = setTimeout(() => { + Analytics.event({ + category: 'Homepage Cards', + action: 'Card Hover', + label: label, + }); + }, 3000); + }; + const handleMouseLeave = () => { + clearTimeout(homepageTile); + }; return ( <> {content.path ? ( - analyticsHandler('Citation Click', content.analyticsName)}> + analyticsHandler('Citation Click', content.analyticsName)} + onMouseEnter={() => handleMouseEnter(content.analyticsName)} + onMouseLeave={handleMouseLeave} + > {card} ) : (