fix: add correct login button instead of sending everyone to my pages

components/Blocks/DynamicContent/SignUpVerification/index.tsx

@@ -3,7 +3,7 @@ import { redirect } from "next/navigation"
 import { overview } from "@/constants/routes/myPages"
 
 import { auth } from "@/auth"
-import LoginButton from "@/components/Current/Header/LoginButton"
+import LoginButton from "@/components/LoginButton"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 

components/Current/Header/MainMenu/index.tsx

@@ -7,13 +7,13 @@ import { myPages } from "@/constants/routes/myPages"
 import useDropdownStore from "@/stores/main-menu"
 
 import Image from "@/components/Image"
+import LoginButton from "@/components/LoginButton"
 import Avatar from "@/components/MyPages/Avatar"
 import Link from "@/components/TempDesignSystem/Link"
 import useLang from "@/hooks/useLang"
 import { trackClick } from "@/utils/tracking"
 
 import BookingButton from "../BookingButton"
-import LoginButton from "../LoginButton"
 
 import styles from "./mainMenu.module.css"
 

components/Current/Header/TopMenu/index.tsx

@@ -2,12 +2,11 @@ import { logout } from "@/constants/routes/handleAuth"
 import { overview } from "@/constants/routes/myPages"
 import { getName } from "@/lib/trpc/memoizedRequests"
 
+import LoginButton from "@/components/LoginButton"
 import Link from "@/components/TempDesignSystem/Link"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 
-import LoginButton from "../LoginButton"
-
 import styles from "./topMenu.module.css"
 
 import type { TopMenuProps } from "@/types/components/current/header/topMenu"
@@ -67,7 +66,7 @@ export default async function TopMenu({
             ) : (
               <LoginButton
                 position="hamburger menu"
-                trackingId="loginStartTopMeny"
+                trackingId="loginStartTopMenu"
                 className={`${styles.sessionLink} ${styles.loginLink}`}
               >
                 {formatMessage({ id: "Log in" })}

components/Header/MainMenu/MyPagesMenuWrapper/index.tsx

@@ -1,5 +1,4 @@
 import { MembershipLevelEnum } from "@/constants/membershipLevels"
-import { myPages } from "@/constants/routes/myPages"
 import {
   getMembershipLevelSafely,
   getMyPagesNavigation,
@@ -7,7 +6,7 @@ import {
 } from "@/lib/trpc/memoizedRequests"
 import { serverClient } from "@/lib/trpc/server"
 
-import Link from "@/components/TempDesignSystem/Link"
+import LoginButton from "@/components/LoginButton"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 
@@ -50,16 +49,17 @@ export default async function MyPagesMenuWrapper() {
           />
         </>
       ) : (
-        <Link
+        <LoginButton
-          href={myPages[lang]}
           className={styles.loginLink}
           aria-label={intl.formatMessage({ id: "Log in/Join" })}
+          position="top menu"
+          trackingId="loginStartNewTopMenu"
         >
           <Avatar />
           <span className={styles.userName}>
             {intl.formatMessage({ id: "Log in/Join" })}
           </span>
-        </Link>
+        </LoginButton>
       )}
     </>
   )

components/LoginButton/index.tsx

@@ -27,7 +27,7 @@ export default function LoginButton({
   variant?: "default" | "signupVerification"
 }>) {
   const lang = useLang()
-  const pathName = useLazyPathname()
+  const pathName = useLazyPathname({ includeSearchParams: true })
 
   const href = pathName
     ? `${login[lang]}?redirectTo=${encodeURIComponent(pathName)}`

components/Sidebar/JoinLoyalty/index.tsx

@@ -1,8 +1,8 @@
 import { getName } from "@/lib/trpc/memoizedRequests"
 
-import LoginButton from "@/components/Current/Header/LoginButton"
 import ArrowRight from "@/components/Icons/ArrowRight"
 import { ScandicFriends } from "@/components/Levels"
+import LoginButton from "@/components/LoginButton"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"

hooks/useLazyPathname.ts

@@ -1,16 +1,27 @@
 "use client"
-import { usePathname } from "next/navigation"
+import { usePathname, useSearchParams } from "next/navigation"
 import { useEffect, useState } from "react"
 
 /*** This hook is used to get the current pathname (as reflected in window.location.href) of the page. During ssr, the value from usePathname()
  *  is the value return from NextResponse.rewrite() (e.g. the path from the app directory) instead of the actual pathname from the URL.
  */
-export function useLazyPathname() {
+export function useLazyPathname({ includeSearchParams = false } = {}) {
   const pathName = usePathname()
+  const searchParams = useSearchParams()
+
   const [updatedPathName, setUpdatedPathName] = useState<string | null>(null)
 
   useEffect(() => {
-    setUpdatedPathName(pathName)
+    if (!includeSearchParams) {
-  }, [pathName])
+      setUpdatedPathName(pathName)
-  return updatedPathName ? updatedPathName : null
+    } else {
+      const updatedPathname = searchParams.size
+        ? `${pathName}?${searchParams.toString()}`
+        : pathName
+
+      setUpdatedPathName(updatedPathname)
+    }
+  }, [pathName, searchParams, includeSearchParams])
+
+  return updatedPathName
 }