Fix bounce rate from redirect and callback flows (#3619)

Various flows, like the legacy domain redirect or the OpenID callback
flows, are only shown temporarily without any user interaction, causing
false bounce rates to be registered. To resolve this, we explicitly
track the page views only on pages we know are actually user
interactive: landing, authorization and dashboard.

# Changes

- Move `analytics.pageView()` call from root layout to specific pages
known to be user interactive.
- Remove `building` condition in `manuallyReroute` since it's called in
a lifecycle method for a while now (used to be within the render
itself).

Author: sea-snake

src/frontend/src/lib/utils/reroute.ts

@@ -31,23 +31,21 @@ export const reroute: Reroute = ({ url }) => {
 
 // SSG routes don't reroute by default anymore, so this method is used
 // there to manually add the rerouting back after the page has loaded.
-export const manuallyReroute = async () => {
-  if (!building) {
-    const next = await reroute({
-      url: new URL(window.location.href),
-      fetch: window.fetch,
-    });
-    if (nonNullish(next)) {
-      // Capture current URL
-      const currentURL = new URL(window.location.href);
-      // Cast to string since `nonNullish` doesn't exclude `void` type
-      const nextURL = new URL(next as string, window.location.origin);
-      // Copy over the current query params
-      nextURL.search = currentURL.search;
-      // Reroute to destination
-      await goto(nextURL, { replaceState: true });
-      // After rerouting, change the URL back to what the user expects to see
-      replaceState(currentURL, {});
-    }
+export const manuallyReroute = async (): Promise<boolean> => {
+  const next = await reroute({
+    url: new URL(window.location.href),
+    fetch: window.fetch,
+  });
+  if (next !== undefined) {
+    // Capture current URL
+    const currentURL = new URL(window.location.href);
+    const nextURL = new URL(next, window.location.origin);
+    // Copy over the current query params
+    nextURL.search = currentURL.search;
+    // Reroute to destination
+    await goto(nextURL, { replaceState: true });
+    // After rerouting, change the URL back to what the user expects to see
+    replaceState(currentURL, {});
   }
+  return next !== undefined;
 };

src/frontend/src/routes/(new-styling)/(channel)/authorize/+layout.svelte

@@ -22,6 +22,8 @@
   import { waitFor } from "$lib/utils/utils";
   import FeaturedIcon from "$lib/components/ui/FeaturedIcon.svelte";
   import { CircleAlertIcon, RotateCcwIcon } from "@lucide/svelte";
+  import { onMount } from "svelte";
+  import { analytics } from "$lib/utils/analytics/analytics";
 
   const { children, data }: LayoutProps = $props();
 
@@ -71,6 +73,11 @@
       lastUsedIdentities.map(({ identityNumber }) => identityNumber),
     ),
   );
+
+  // Track page view for authorization flow
+  onMount(() => {
+    analytics.pageView();
+  });
 </script>
 
 <div class="flex min-h-[100dvh] flex-col" data-page="new-authorize-view">

src/frontend/src/routes/(new-styling)/+page.svelte

@@ -44,6 +44,8 @@
   import Popover from "$lib/components/ui/Popover.svelte";
   import IdentitySwitcher from "$lib/components/ui/IdentitySwitcher.svelte";
   import { AuthLastUsedFlow } from "$lib/flows/authLastUsedFlow.svelte";
+  import { onMount } from "svelte";
+  import { analytics } from "$lib/utils/analytics/analytics";
 
   const authLastUsedFlow = new AuthLastUsedFlow();
 
@@ -91,11 +93,6 @@
     });
   };
 
-  // Add rerouting back on this SSG route
-  $effect(() => {
-    manuallyReroute();
-  });
-
   let triggerAnimation =
     $state<(opts: FlairAnimationOptions) => Promise<void>>();
   let clearAnimation = $state<() => void>();
@@ -141,6 +138,16 @@
     authenticationV2Funnel.trigger(AuthenticationV2Events.GoToDashboard);
     authenticationV2Funnel.close();
   });
+
+  onMount(async () => {
+    // Add rerouting back on this SSG route
+    const rerouted = await manuallyReroute();
+    // Track page view for landing page unless we have rerouted,
+    // in which case it will be tracked on the destination page.
+    if (!rerouted) {
+      analytics.pageView();
+    }
+  });
 </script>
 
 <div class="flex min-h-[100dvh] flex-col">

src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte

@@ -44,6 +44,8 @@
   import { Trans } from "$lib/components/locale";
   import { getMetadataString } from "$lib/utils/openID";
   import ProgressRing from "$lib/components/ui/ProgressRing.svelte";
+  import { analytics } from "$lib/utils/analytics/analytics";
+  import { onMount } from "svelte";
 
   const { children, data }: LayoutProps = $props();
 
@@ -121,6 +123,11 @@
   afterNavigate(() => {
     isMobileSidebarOpen = false;
   });
+
+  // Track page view for dashboard
+  onMount(() => {
+    analytics.pageView();
+  });
 </script>
 
 {#snippet recoveryPhraseSetUp()}

src/frontend/src/routes/+layout.svelte

@@ -58,7 +58,6 @@
 
     // Initialize analytics
     initAnalytics(canisterConfig.analytics_config[0]?.[0]);
-    analytics.pageView();
   });
 </script>