robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged PR 1230: update google analytics

Browse Source 
Related work items: #12116, #12117
This commit is contained in:
Robert Bond
2024-08-29 14:00:51 +00:00
parent 570b7ff79d c0404d138a
commit 2839a91195
9 changed files with 110 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.local
+2 -1
View File
@@ -46,7 +46,8 @@ RELAYPATH = "dev-pedw-hc"
//RELAYPATH = "prod-pedw-hc"
GOOGLE_TAG_MANAGER = GTM-T78CBC3
//GOOGLE_TAG_MANAGER = GTM-T78CBC3
GOOGLE_TAG_MANAGER = G-GTWW3JT03Z
SHOWLOGIN = true
SHOWREPRESENTATIONS = true
SHOWFILEUPLOAD = "false"
components/case/documents.js
+12 -4
View File
@@ -7,6 +7,7 @@ import { connect } from "react-redux";
import transLookup from "../../data/lookuptranslations.json";
import { formatDates } from "../utils";
import PaginationControl from "./pagination";
import { sendGAEvent } from "@next/third-parties/google";
import {
getSearchDocumentDetails,
@@ -66,9 +67,6 @@ const DocumentDetails = (props) => {
console.log(currentDate);
var valid = startDate < currentDate && endDate > currentDate;
console.log(valid);
ShowDocLinks = valid;
};
@@ -307,7 +305,17 @@ const DocumentDetails = (props) => {
}
key={key}
onClick={() => {
toggleDownLoadLink(key);
toggleDownLoadLink(key),
sendGAEvent(
"event",
"DownloadedFile",
{
caseReference:
props.caseReference,
filename:
detailsObj.pinswg_name,
}
);
}}
>
<span className="results-visually-hidden">
components/homepage/casesearch.js
+14 -1
View File
@@ -3,6 +3,7 @@ import Link from "next/link";
import { useRouter } from "next/router";
import { connect } from "react-redux";
import { Field, reduxForm } from "redux-form";
import { sendGAEvent } from "@next/third-parties/google";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
@@ -126,7 +127,19 @@ let CaseSearch = (props) => {
/>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
<button
type="submit"
className="govuk-button"
onClick={() => {
sendGAEvent(
"event",
"SearchButtonClicked",
{
searchTerm: basicSearch.value,
}
);
}}
>
{t("home:casesearch-card-button")}
</button>
</div>
components/myportal/searchcases.js
+14 -1
View File
@@ -3,6 +3,7 @@ import Link from "next/link";
import { useRouter } from "next/router";
import { connect } from "react-redux";
import { Field, reduxForm } from "redux-form";
import { sendGAEvent } from "@next/third-parties/google";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
@@ -132,7 +133,19 @@ let CaseSearch = (props) => {
/>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
<button
type="submit"
className="govuk-button"
onClick={() => {
sendGAEvent(
"event",
"MyPortalSearchButtonClicked",
{
searchTerm: basicSearch.value,
}
);
}}
>
{t("myportal:searchcases-card-button")}
</button>
</div>
components/search/searchresults.js
+32 -22
View File
@@ -34,6 +34,8 @@ import {
getWatchedCasesProxy,
} from "../../actions";
import { sendGAEvent } from "@next/third-parties/google";
const SearchResults = (props) => {
const {
searchString,
@@ -261,28 +263,36 @@ const SearchResults = (props) => {
}
className="govuk-link--no-underline"
onClick={() => {
setCurrentReference({
"ticketnumber":
item.ticketnumber,
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showLoginCheck":
props.showLoginCheck,
"specialistProcess":
detailsObj.pinswg_speacialistcaseprocess !=
null ||
detailsObj.pinswg_specialistcaseprocess !=
null
? detailsObj.pinswg_speacialistcaseprocess ||
detailsObj.pinswg_specialistcaseprocess
: "",
});
sendGAEvent(
"event",
"CaseViewed",
{
caseReference:
item.ticketnumber,
}
),
setCurrentReference({
"ticketnumber":
item.ticketnumber,
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showLoginCheck":
props.showLoginCheck,
"specialistProcess":
detailsObj.pinswg_speacialistcaseprocess !=
null ||
detailsObj.pinswg_specialistcaseprocess !=
null
? detailsObj.pinswg_speacialistcaseprocess ||
detailsObj.pinswg_specialistcaseprocess
: "",
});
}}
>
<span className="results-visually-hidden">
components/tracking/index.js
+24 -8
View File
@@ -1,21 +1,37 @@
import Script from "next/script";
import React, { Fragment } from "react";
import { GoogleTagManager } from "@next/third-parties/google";
export const Tracking = ({ googleTagManagerID, nonce }) => (
<Fragment>
<>
<Script
strategy="afterInteractive"
src={`https://www.googletagmanager.com/gtag/js?id=${googleTagManagerID}`}
/>
<Script
id="google-analytics"
strategy="afterInteractive"
nonce={nonce}
dangerouslySetInnerHTML={{
__html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','${googleTagManagerID}');`,
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('consent', 'default', {
'analytics_storage': 'denied'
});
gtag('config', '${googleTagManagerID}', {
page_path: window.location.pathname,
});
`,
}}
/>
</Fragment>
{/* <GoogleAnalytics gaId={googleTagManagerID} /> */}
{/* <GoogleTagManager gtmId={googleTagManagerID} /> */}
</>
);
export const TrackingNoScript = ({ googleTagManagerID }) => (
package.json
+1
View File
@@ -20,6 +20,7 @@
"@azure/storage-blob": "^12.17.0",
"@azure/storage-queue": "^12.16.0",
"@next-auth/prisma-adapter": "^1.0.7",
"@next/third-parties": "latest",
"@prisma/client": "^5.7.0",
"@react-pdf/renderer": "^3.1.14",
"@redux-devtools/extension": "^3.3.0",
pages/_app.js
+3 -1
View File
@@ -6,7 +6,8 @@ import { useStore, Provider } from "react-redux";
import { persistStore } from "redux-persist";
import { PersistGate } from "redux-persist/integration/react";
import { SessionProvider as AuthProvider } from "next-auth/react";
import { Tracking } from "../components/tracking";
import { GoogleAnalytics } from "@next/third-parties/google";
const MyApp = ({ Component, pageProps: { session, ...pageProps } }) => {
const store = useStore((state) => state);
const persistor = persistStore(store, {}, function () {
@@ -21,6 +22,7 @@ const MyApp = ({ Component, pageProps: { session, ...pageProps } }) => {
loading={<Loading />}
>
<Component {...pageProps} />
<GoogleAnalytics gaId="G-GTWW3JT03Z" />
</PersistGate>
</Provider>
</AuthProvider>
pages/_document.js
+8 -6
View File
@@ -38,11 +38,12 @@ class MyDocument extends Document {
csp += `base-uri 'self';`;
csp += `form-action 'self' ` + process.env.NEXTAUTH_URL + ` ;`;
csp += `object-src 'self' data:;`;
csp +=
`script-src 'self' ` +
process.env.NEXTAUTH_URL +
` 'unsafe-inline' https://www.googletagmanager.com https://maps.googleapis.com 'nonce-${generatedNonce}' 'unsafe-eval';`;
csp += `style-src 'self' https://fonts.googleapis.com 'unsafe-inline' data:;`;
csp += `default-src 'self' https://www.google-analytics.com;`;
csp += `connect-src 'self' https://region1.google-analytics.com;`;
csp += `script-src 'self' 'unsafe-eval' 'unsafe-inline' https://region1.google-analytics.com https://www.google-analytics.com/ https://tagmanager.google.com/ https://www.googletagmanager.com/;`;
csp += `style-src 'self' 'unsafe-inline' https://pro.fontawesome.com/ https://www.google-analytics.com https://tagmanager.google.com/ https://www.googletagmanager.com/ https://fonts.googleapis.com/;`;
csp += `img-src 'self' 'unsafe-inline' https://fonts.gstatic.com https://www.googletagmanager.com https://www.google-analytics.com https://ssl.gstatic.com/ data:;`;
csp += `font-src 'self' 'unsafe-inline' https://pro.fontawesome.com/ https://fonts.gstatic.com/ data:;`;
return (
<Html lang={locale}>
@@ -50,10 +51,11 @@ class MyDocument extends Document {
<meta httpEquiv="Content-Security-Policy" content={csp} />
{useGATracking && (
<Tracking
googleTagManagerID={googleTagManagerID}
googleTagManagerID="G-GTWW3JT03Z"
nonce={generatedNonce}
/>
)}
{/* <GoogleAnalytics gaId={googleTagManagerID} /> */}
</Head>
<body className="js-enabled">
{useGATracking && (