Track results through pageview property

digitalservicebund · Jul 5, 2024 · edcfa6c · edcfa6c
1 parent 8cc3208
commit edcfa6c
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 9 deletions.
diff --git a/packages/dito/app/root.tsx b/packages/dito/app/root.tsx
@@ -9,6 +9,7 @@ import {
   ScrollRestoration,
   isRouteErrorResponse,
   useRouteError,
+  useRouteLoaderData,
 } from "@remix-run/react";
 
 import sharedStyles from "@digitalcheck/shared/styles.css?url";
@@ -109,6 +110,23 @@ function Document({
   };
 }>) {
   const nonce = useNonce();
+  const data:
+    | {
+        positiveQuestions: string[];
+        unsureQuestions: string[];
+      }
+    | undefined = useRouteLoaderData("routes/vorpruefung.ergebnis");
+  let resultType: string | undefined;
+  if (data) {
+    const { positiveQuestions, unsureQuestions } = data;
+    if (positiveQuestions.length > 0) {
+      resultType = "positive";
+    } else if (unsureQuestions.length > 0) {
+      resultType = "unsure";
+    } else {
+      resultType = "negative";
+    }
+  }
   return (
     <html lang="de">
       <head>
@@ -120,6 +138,8 @@ function Document({
         />
         <script
           defer
+          // eslint-disable-next-line react/no-unknown-property
+          event-result={resultType}
           data-domain="digitalcheck-dito.prod.ds4g.net"
           src="https://plausible.io/js/script.tagged-events.outbound-links.file-downloads.js"
         ></script>

diff --git a/packages/dito/app/routes/vorpruefung.ergebnis.tsx b/packages/dito/app/routes/vorpruefung.ergebnis.tsx
@@ -22,23 +22,24 @@ export const meta: MetaFunction = () => {
   return [{ title: `${result.title} — ${siteMeta.title}` }];
 };
 
+const getQuestionIDsOfOption = (answers: Answers, option: Option["value"]) =>
+  Object.keys(answers).filter((key) => answers[key] === option);
+
 export async function loader({ request }: LoaderFunctionArgs) {
   const { answers } = await getAnswersFromCookie(request);
   // redirect to precheck if not all answers are present
   if (Object.keys(answers).length !== questions.length) {
     return redirect(PATH_PRECHECK);
   }
-  return json({ answers });
-}
-
-const getQuestionIDsOfOption = (answers: Answers, option: Option["value"]) =>
-  Object.keys(answers).filter((key) => answers[key] === option);
-
-export default function Result() {
-  const { answers } = useLoaderData<typeof loader>();
   const positiveQuestions = getQuestionIDsOfOption(answers, "yes");
   const unsureQuestions = getQuestionIDsOfOption(answers, "unsure");
   const negativeQuestions = getQuestionIDsOfOption(answers, "no");
+  return json({ positiveQuestions, unsureQuestions, negativeQuestions });
+}
+
+export default function Result() {
+  const { positiveQuestions, unsureQuestions, negativeQuestions } =
+    useLoaderData<typeof loader>();
 
   const { register, formState, trigger } = useForm<FieldValues>();
 
@@ -67,7 +68,6 @@ export default function Result() {
   };
 
   // We have at least one positive answer
-
   if (positiveQuestions.length > 0) {
     const reasonsText = getReasoningText("Ja", positiveQuestions);
     return (