fix: add logout button in mobile dropdown and name in desktop

components/Current/Header/MainMenu/index.tsx

@@ -1,8 +1,7 @@
 "use client"
-import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { login } from "@/constants/routes/handleAuth"
+import { logout } from "@/constants/routes/handleAuth"
 import { myPages } from "@/constants/routes/myPages"
 import useDropdownStore from "@/stores/main-menu"
 
@@ -11,6 +10,7 @@ import Avatar from "@/components/MyPages/Avatar"
 import Link from "@/components/TempDesignSystem/Link"
 
 import BookingButton from "../BookingButton"
+import LoginButton from "../LoginButton"
 
 import styles from "./mainMenu.module.css"
 
@@ -103,12 +103,10 @@ export function MainMenu({
                     />
                   </li>
                   <li className={styles.mobileLinkRow}>
-                    <Link
+                    <LoginButton
                       className={styles.mobileLinkButton}
-                      href={login[lang]}
-                    >
-                      {intl.formatMessage({ id: "Log in" })}
-                    </Link>
+                      lang={lang}
+                    />
                   </li>
                 </>
               )}
@@ -141,10 +139,16 @@ export function MainMenu({
                 </li>
               ))}
             </ul>
-
             {languageSwitcher ? (
               <li className={styles.mobileLi}>{languageSwitcher}</li>
             ) : null}
+            {!!user ? (
+              <li className={`${styles.mobileLi} ${styles.logout}`}>
+                <Link href={logout[lang]} className={styles.mobileLink}>
+                  {intl.formatMessage({ id: "Log out" })}
+                </Link>
+              </li>
+            ) : null}
           </ul>
           <div className={styles.buttonContainer}>
             <div className={styles.myPagesDesktopLink}>