reviews + UI

frontend/style/components/header.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react"
 import Link from "next/link"
+import { useRouter } from "next/navigation"
 import { Search } from "./search"
 import { Button } from "./ui/button"
 import { ShoppingCart, Heart, User, Menu, X } from "lucide-react"
@@ -13,19 +14,24 @@ import { useAuth } from "@/contexts/auth-context"
 import { Badge } from "./ui/badge"
 import { CartSummary } from "./cart-summary"
 
-
 export function Header() {
   const [isMenuOpen, setIsMenuOpen] = useState(false)
   const [isCartOpen, setIsCartOpen] = useState(false)
   const { getTotalItems, getTotalUniqueItems } = useCart()
   const { getTotalFavorites } = useFavorites()
   const { isLoggedIn } = useAuth()
+  const router = useRouter()
+
+  const handleNavigate = (path: string) => {
+    router.push(path)
+    setIsMenuOpen(false) // Закрываем меню после навигации
+  }
 
   return (
     <header className="border-b sticky top-0 bg-white z-50">
-      <div className="container mx-auto px-4 py-4 w-[95%]">
+      <div className="container mx-auto px-4 py-4">
         <div className="flex flex-wrap items-center justify-between">
-          <div className="flex items-center w-full sm:w-auto mb-4 sm:mb-0 pl-0">
+          <div className="flex items-center w-full sm:w-auto mb-4 sm:mb-0">
             <Link href="/" className="text-2xl font-bold text-blue-600 mr-4">
               STORE
             </Link>
@@ -56,10 +62,19 @@ export function Header() {
                   )}
                 </Link>
               </Button>
-              <Sheet open={isCartOpen} onOpenChange={setIsCartOpen}>
+              <Link href="/cart">
+              <Button variant="ghost" size="icon" className="relative">
+                <ShoppingCart className="h-5 w-5" />
+                </Button>
+                </Link>
+
+              {/* <Sheet open={isCartOpen} onOpenChange={setIsCartOpen}>
                 <SheetTrigger asChild>
                   <Button variant="ghost" size="icon" className="relative">
                     <ShoppingCart className="h-5 w-5" />
+                    <Link href="/cart" onClick={() => setIsCartOpen(false)}>
+	                        
+                      </Link>
                     {getTotalUniqueItems() > 0 && (
                       <Badge
                         variant="destructive"
@@ -71,6 +86,14 @@ export function Header() {
                   </Button>
                 </SheetTrigger>
                 <SheetContent side="right" className="w-full sm:max-w-md">
+                  
+                  <div className="mt-6">
+                    <Button asChild className="w-full">
+                      <Link href="/cart" onClick={() => setIsCartOpen(false)}>
+	                        Перейти в корзину
+                      </Link>
+                    </Button>
+                  </div>
                   <div className="flex justify-between items-center mb-6">
                     <h2 className="text-2xl font-bold">Корзина</h2>
                     <SheetClose asChild>
@@ -83,12 +106,13 @@ export function Header() {
                   <div className="mt-6">
                     <Button asChild className="w-full">
                       <Link href="/cart" onClick={() => setIsCartOpen(false)}>
-                        Перейти в корзину
+	                        Перейти в корзину
                       </Link>
                     </Button>
                   </div>
+                 
                 </SheetContent>
-              </Sheet>
+              </Sheet> */}
             </div>
             <div className="sm:hidden">
               <Sheet open={isMenuOpen} onOpenChange={setIsMenuOpen}>
@@ -97,34 +121,34 @@ export function Header() {
                     <Menu className="h-5 w-5" />
                   </Button>
                 </SheetTrigger>
-                <SheetContent side="right" className="w-full sm:max-w-md">
-                  <div className="flex justify-between items-center mb-6">
-                    <h2 className="text-2xl font-bold">Меню</h2>
-                    <SheetClose asChild>
-                      <Button variant="ghost" size="icon">
-                        <X className="h-5 w-5" />
-                      </Button>
-                    </SheetClose>
-                  </div>
+                <SheetContent side="right" className="h-[100vh] pt-16">
                   <nav className="flex flex-col gap-4">
-                    <CatalogMenu />
-                    <Link
-                      href={isLoggedIn ? "/profile" : "/login"}
+                    <div className="border-b pb-4">
+                      <CatalogMenu onSelect={() => setIsMenuOpen(false)} />
+                    </div>
+                    <button
+                      onClick={() => handleNavigate(isLoggedIn ? "/profile" : "/login")}
                       className="flex items-center gap-2 p-2 hover:bg-gray-100 rounded-md"
                     >
                       <User className="h-5 w-5" />
                       <span>Личный кабинет</span>
-                    </Link>
-                    <Link href="/favorites" className="flex items-center gap-2 p-2 hover:bg-gray-100 rounded-md">
+                    </button>
+                    <button
+                      onClick={() => handleNavigate("/favorites")}
+                      className="flex items-center gap-2 p-2 hover:bg-gray-100 rounded-md"
+                    >
                       <Heart className="h-5 w-5" />
                       <span>Избранное</span>
                       {getTotalFavorites() > 0 && <Badge variant="destructive">{getTotalFavorites()}</Badge>}
-                    </Link>
-                    <Link href="/cart" className="flex items-center gap-2 p-2 hover:bg-gray-100 rounded-md">
+                    </button>
+                    <button
+                      onClick={() => handleNavigate("/cart")}
+                      className="flex items-center gap-2 p-2 hover:bg-gray-100 rounded-md"
+                    >
                       <ShoppingCart className="h-5 w-5" />
                       <span>Корзина</span>
                       {getTotalUniqueItems() > 0 && <Badge variant="destructive">{getTotalUniqueItems()}</Badge>}
-                    </Link>
+                    </button>
                   </nav>
                 </SheetContent>
               </Sheet>