From da09b163725afb2b58436afe1c485373bb07f669 Mon Sep 17 00:00:00 2001
From: SlimusMinus <moscow_city231@rambler.ru>
Date: Thu, 25 Jun 2026 00:51:16 +0300
Subject: [PATCH] added status found on post

---
 src/components/MainFeed.jsx   | 16 ++++++++++++++
 src/components/PostOnFeed.jsx | 18 +++++++++++----
 src/styles/card.css           | 41 +++++++++++++++++++++++++++++++++++
 3 files changed, 71 insertions(+), 4 deletions(-)

diff --git a/src/components/MainFeed.jsx b/src/components/MainFeed.jsx
index 26f5b43..ab3f91a 100644
--- a/src/components/MainFeed.jsx
+++ b/src/components/MainFeed.jsx
@@ -13,6 +13,7 @@ import RulesModal from "./RulesModal";
 import { useAuthContext } from "../context/AuthContext";
 import { useDeletePost } from "../hooks/useDeletePost";
 import { useFavorites } from "../hooks/useFavorites";
+import { usePostStatus } from "../hooks/usePostStatus";
 
 /**
  * MainFeed — корневой компонент приложения.
@@ -24,6 +25,7 @@ export default function MainFeed() {
   const { user, token, isAuthenticated, logout } = useAuthContext();
   const { deletePost } = useDeletePost();
   const { toggleFavorite, loadFavorites } = useFavorites();
+  const { markAsFound } = usePostStatus();
 
   // Открыт ли левый сайдбар (мобильный слайд-аут)
   const [sidebarOpen, setSidebarOpen] = useState(false);
@@ -172,6 +174,19 @@ export default function MainFeed() {
     }
   }, [deletePost, loadFeed, loadMyPosts]);
 
+  /** Отмечает объявление как "Вещь найдена" и перезагружает ленту */
+  const handleMarkFound = useCallback(async (postId) => {
+    if (!window.confirm("Отметить это объявление как \"Вещь найдена\"?")) {
+      return;
+    }
+    
+    const success = await markAsFound(postId, token);
+    if (success) {
+      loadFeed();
+      loadMyPosts();
+    }
+  }, [markAsFound, token, loadFeed, loadMyPosts]);
+
   // После создания или редактирования объявления перезагружаем ленту,
   // чтобы получить актуальные данные (включая изображения) из БД
   const handleNewAd    = useCallback(() => { loadFeed(); loadMyPosts(); }, [loadFeed, loadMyPosts]);
@@ -283,6 +298,7 @@ export default function MainFeed() {
             onLike={toggleLike}
             onEdit={activeNav === "Мои объявления" ? handleEdit : undefined}
             onDelete={activeNav === "Мои объявления" ? handleDelete : undefined}
+            onMarkFound={activeNav === "Мои объявления" ? handleMarkFound : undefined}
             isOwner={activeNav === "Мои объявления"}
         />
     ));
diff --git a/src/components/PostOnFeed.jsx b/src/components/PostOnFeed.jsx
index 60bea67..64610ff 100644
--- a/src/components/PostOnFeed.jsx
+++ b/src/components/PostOnFeed.jsx
@@ -9,7 +9,7 @@ import { useChats } from "../hooks/useChats";
 import { useAuthContext } from "../context/AuthContext";
 import { API_URL } from "../config/authConstants";
 
-export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, isOwner }) {
+export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, onMarkFound, isOwner }) {
   const navigate = useNavigate();
   const { createOrGetChat } = useChats();
   const { isAuthenticated } = useAuthContext();
@@ -30,9 +30,12 @@ export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, isOwne
   const createdAt = ad.createdAt
       ? new Date(ad.createdAt).toLocaleDateString("ru-RU")
       : null;
+  
+  // Проверяем, закрыт ли пост (вещь найдена)
+  const isClosed = ad.status === 'CLOSED';
 
   return (
-      <div className="f-card">
+      <div className={`f-card${isClosed ? ' f-card-closed' : ''}`}>
         <div className="f-card-inner">
           <div className="f-card-img">
             {imageUrl
@@ -46,6 +49,7 @@ export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, isOwne
               <div className={`f-type-badge ${ad.type === "loss" ? "f-type-loss" : "f-type-found"}`}>
                 {ad.type === "loss" ? "Потеря" : "Находка"}
               </div>
+              {isClosed && <div className="f-status-badge f-status-closed">✓ Найдено</div>}
             </div>
             <div className="f-card-title">{ad.title}</div>
             <div className="f-card-desc">{ad.description}</div>
@@ -70,12 +74,12 @@ export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, isOwne
                 )}
               </div>
               <div className="f-card-foot-right">
-                {isAuthenticated && !isOwner && (
+                {isAuthenticated && !isOwner && !isClosed && (
                     <button className="f-card-contact" onClick={handleContact}>
                       Написать
                     </button>
                 )}
-                {onEdit && isOwner && (
+                {onEdit && isOwner && !isClosed && (
                     <button className="f-card-edit-btn"
                             onClick={e => { e.stopPropagation(); onEdit(ad); }}>
                       ✏️
@@ -87,6 +91,12 @@ export default function PostOnFeed({ ad, liked, onLike, onEdit, onDelete, isOwne
                       <TrashIcon />
                     </button>
                 )}
+                {onMarkFound && isOwner && !isClosed && (
+                    <button className="f-card-found-btn"
+                            onClick={e => { e.stopPropagation(); onMarkFound(ad.id); }}>
+                      ✓ Вещь найдена
+                    </button>
+                )}
                 <button className={`f-like-btn${liked ? " liked" : ""}`}
                         onClick={e => { e.stopPropagation(); onLike(ad.id); }}>
                   <HeartIcon filled={liked} />
diff --git a/src/styles/card.css b/src/styles/card.css
index 395cbae..ebde980 100644
--- a/src/styles/card.css
+++ b/src/styles/card.css
@@ -39,6 +39,15 @@
 .f-type-loss  { background: rgba(255,107,107,.2); color: #ff6b6b; border: 1px solid rgba(255,107,107,.3); }
 .f-type-found { background: rgba(45,224,200,.2);  color: #2de0c8; border: 1px solid rgba(45,224,200,.3); }
 
+/* Status badge for closed/found posts */
+.f-status-badge {
+  border-radius: 20px; padding: 3px 10px;
+  font-size: .72rem; font-weight: 900;
+}
+.f-status-closed {
+  background: rgba(72,187,120,.2); color: #48bb78; border: 1px solid rgba(72,187,120,.3);
+}
+
 /* Body */
 .f-card-body {
   flex: 1; padding: 14px 16px;
@@ -93,6 +102,23 @@
   border-color: rgba(255,107,107,.5); color: #ff6b6b; background: rgba(255,107,107,.08);
 }
 
+/* Closed/Found card styling */
+.f-card-closed {
+  opacity: 0.7;
+  border-color: rgba(72,187,120,.3);
+}
+.f-card-closed:hover {
+  border-color: rgba(72,187,120,.5);
+  transform: none;
+}
+.f-card-closed .f-card-img {
+  filter: grayscale(0.5);
+}
+.f-card-closed .f-card-title {
+  text-decoration: line-through;
+  opacity: 0.7;
+}
+
 /* Edit & Delete buttons */
 .f-card-edit-btn,
 .f-card-delete-btn {
@@ -109,6 +135,21 @@
   border-color: rgba(255,107,107,.5); color: #ff6b6b; background: rgba(255,107,107,.08);
 }
 
+/* Mark as Found button */
+.f-card-found-btn {
+  display: flex; align-items: center; gap: 5px;
+  background: rgba(72,187,120,.1); border: 1px solid rgba(72,187,120,.3);
+  border-radius: 20px; padding: 5px 11px;
+  cursor: pointer; transition: all .2s;
+  font-family: var(--font); font-size: .75rem; font-weight: 700;
+  color: #48bb78;
+}
+.f-card-found-btn:hover {
+  background: rgba(72,187,120,.2); border-color: rgba(72,187,120,.5);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(72,187,120,.2);
+}
+
 @media (max-width: 600px) {
   /* Карточка становится вертикальной */
   .f-card-inner {