change design

src/pages/MainFeed.jsx

@@ -1,8 +1,9 @@
-import { useState, useEffect, useCallback, useMemo } from "react";
+import { useState, useEffect, useCallback, useMemo, useRef } from "react";
 import { useNavigate, useLocation } from "react-router-dom";
 import "../styles/index.css";
 import { getImageUrl } from "../config/authConstants";
 import Sidebar from "../components/Sidebar";
+import BottomNav from "../components/nav/BottomNav";
 import RightSidebar from "../components/RightSidebar";
 import CreateUpdatePost from "./CreateUpdatePost";
 import ImageViewer from "../components/ImageViewer";
@@ -45,6 +46,11 @@ export default function MainFeed() {
   const [searchQuery, setSearchQuery] = useState("");
   const [liked, setLiked] = useState(new Set());
 
+  const feedRef = useRef(null);
+
+  const isSearchView = new URLSearchParams(location.search).get("view") === "search";
+  const hasActiveFilters = searchQuery.trim().length > 0 || selectedCities.length > 0;
+
   const feed = useFeedPosts();
   const myPosts = useMyPosts(user?.id);
   const cityFeed = useCityFeed(selectedCities);
@@ -135,6 +141,28 @@ export default function MainFeed() {
     else modals.open("edit", ad);
   }, [isAuthenticated, modals]);
 
+  const handleHomeClick = useCallback(() => {
+    setActiveNav("home");
+    if (isSearchView) navigate("/feed");
+    feedRef.current?.scrollTo({ top: 0, behavior: "smooth" });
+  }, [isSearchView, navigate]);
+
+  const handleSearchClick = useCallback(() => {
+    setActiveNav("home");
+    setSearchQuery("");
+    setSelectedCities([]);
+    if (!isSearchView) navigate("/feed?view=search");
+    feedRef.current?.scrollTo({ top: 0, behavior: "smooth" });
+  }, [isSearchView, navigate]);
+
+  // Карта с объявлениями — иконка добавлена, функционал ещё не реализован
+  const handleMapClick = useCallback(() => {}, []);
+
+  const handleProfileClick = useCallback(() => {
+    if (!isAuthenticated) modals.open("auth");
+    else modals.open("profile");
+  }, [isAuthenticated, modals]);
+
   const filteredAds = useMemo(() => {
     let result;
     if (activeNav === "myads") {
@@ -161,7 +189,7 @@ export default function MainFeed() {
   const listError = activeNav === "myads" ? myPosts.error : feed.error;
 
   return (
-      <div className="f-app">
+      <div className={`f-app${isSearchView ? " f-search-view" : ""}`}>
         <Sidebar
             open={sidebarOpen}
             activeNav={activeNav}
@@ -171,31 +199,28 @@ export default function MainFeed() {
             onLoginClick={() => modals.open("auth")}
             onRulesClick={() => modals.open("rules")}
             onReviewsClick={() => navigate("/reviews")}
+            onCreatePost={handleCreatePost}
+            onProfileClick={() => modals.open("profile")}
+            profileData={profileData}
         />
 
-        <div className="f-main">
-          <FeedTopBar
-              onMenuClick={() => setSidebarOpen(v => !v)}
-              onCreatePost={handleCreatePost}
-              isAuthenticated={isAuthenticated}
-              profileData={profileData}
-              onProfileClick={() => modals.open("profile")}
-              onLoginClick={() => modals.open("auth")}
-              t={t}
-          />
+        <div className="f-main f-main-feed">
+          <FeedTopBar onMenuClick={() => setSidebarOpen(v => !v)} />
 
-          <FeedSearchBar value={searchQuery} onChange={setSearchQuery} t={t} />
+          <div className="f-search-panel">
+            <FeedSearchBar value={searchQuery} onChange={setSearchQuery} t={t} />
 
-          {activeNav === "home" && (
-              <div className="f-city-filter-wrap">
-                <CityFilter cities={cities} value={selectedCities} onChange={setSelectedCities} />
-              </div>
-          )}
+            {activeNav === "home" && (
+                <div className="f-city-filter-wrap">
+                  <CityFilter cities={cities} value={selectedCities} onChange={setSelectedCities} />
+                </div>
+            )}
+          </div>
 
           <TypeFilterBar value={typeFilter} onChange={setTypeFilter} t={t} />
 
           <div className="f-wrap">
-            <div className="f-feed">
+            <div className="f-feed" ref={feedRef}>
               <FeedContent
                   loading={listLoading}
                   cityLoading={cityFeed.cityLoading}
@@ -221,7 +246,14 @@ export default function MainFeed() {
                   </div>
               )}
             </div>
-            <RightSidebar />
+            <RightSidebar
+                ads={filteredAds}
+                profileData={profileData}
+                isAuthenticated={isAuthenticated}
+                onProfileClick={() => modals.open("profile")}
+                onLoginClick={() => modals.open("auth")}
+                onNavClick={setActiveNav}
+            />
           </div>
         </div>
 
@@ -253,6 +285,18 @@ export default function MainFeed() {
                 postData={modals.modal.payload.ad}
             />
         )}
+
+        <BottomNav
+            activeTab={isSearchView ? "search" : "home"}
+            hasFilters={hasActiveFilters}
+            profileData={profileData}
+            onHome={handleHomeClick}
+            onMap={handleMapClick}
+            onCreatePost={handleCreatePost}
+            onSearch={handleSearchClick}
+            onProfile={handleProfileClick}
+            t={t}
+        />
       </div>
   );
 }