first commit

src/components/FavoriteInfo.tsx

@@ -0,0 +1,62 @@
+import React from "react";
+import { useFavorites } from "@/contexts/FavoritesContext";
+
+const FavoriteInfo = () => {
+  const { favorites } = useFavorites();
+  
+  const getCountText = (count: number) => {
+    const lastDigit = count % 10;
+    const lastTwoDigits = count % 100;
+    
+    if (lastTwoDigits >= 11 && lastTwoDigits <= 14) {
+      return `${count} товаров`;
+    }
+    
+    if (lastDigit === 1) {
+      return `${count} товар`;
+    } else if (lastDigit >= 2 && lastDigit <= 4) {
+      return `${count} товара`;
+    } else {
+      return `${count} товаров`;
+    }
+  };
+
+  return (
+    <section className="section-info">
+      <div className="w-layout-blockcontainer container info w-container">
+        <div className="w-layout-vflex flex-block-9">
+          <div className="w-layout-hflex flex-block-7">
+            <a href="/" className="link-block w-inline-block">
+              <div>Главная</div>
+            </a>
+            <div className="text-block-3">→</div>
+            <a href="/catalog" className="link-block w-inline-block">
+              <div>Каталог</div>
+            </a>
+            <div className="text-block-3">→</div>
+            <a href="#" className="link-block-2 w-inline-block">
+              <div>Избранное</div>
+            </a>
+          </div>
+          <div className="w-layout-hflex flex-block-8">
+            <div className="w-layout-hflex flex-block-10">
+              <h1 className="heading">Избранное</h1>
+              <div className="text-block-4">
+                {favorites.length > 0 
+                  ? `Вы добавили ${getCountText(favorites.length)} в избранное`
+                  : 'Нет избранных товаров'
+                }
+              </div>
+            </div>
+            <div className="w-layout-hflex flex-block-11">
+              <img src="/images/qwestions.svg" loading="lazy" alt="" className="image-4" />
+              <div className="text-block-5">Как пользоваться избранным?</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default FavoriteInfo;