feat(BOOK-212): Refactored LoginButton and added successful tracking functionality

Approved-by: Linus Flood

apps/scandic-web/components/RouteChange.tsx

@@ -6,6 +6,7 @@ import { startTransition, useEffect } from "react"
 import { isSameBookingWidgetParams } from "@scandic-hotels/booking-flow/utils/isSameBooking"
 import useRouterTransitionStore from "@scandic-hotels/common/stores/router-transition"
 import useTrackingStore from "@scandic-hotels/common/stores/tracking"
+import { trackEvent } from "@scandic-hotels/tracking/base"
 
 import useLang from "@/hooks/useLang"
 import { trackPageViewStart } from "@/utils/tracking"
@@ -57,5 +58,26 @@ export default function RouteChange() {
     startRouterTransition,
   ])
 
+  // Track login success if loginPosition param is present. The LoginButton component has a
+  // loginPosition prop that adds this param to the URL upon successful login.
+  useEffect(() => {
+    const loginPosition = searchParams.get("loginPosition")
+    if (loginPosition) {
+      const position = `${loginPosition}, ${pathName}`
+      trackEvent({
+        event: "loginSuccess",
+        login: {
+          position,
+        },
+      })
+
+      const params = new URLSearchParams(searchParams)
+      params.delete("loginPosition")
+      const search = params.toString()
+      const newUrl = search ? `${pathName}?${search}` : pathName
+      window.history.replaceState(null, "", newUrl)
+    }
+  }, [pathName, searchParams])
+
   return null
 }