From f6baf7ed3e32d40b5ee18edafe82ee4d37b202b9 Mon Sep 17 00:00:00 2001 From: glpshchn <464976@niuitmo.ru> Date: Fri, 5 Dec 2025 00:16:35 +0300 Subject: [PATCH] Update files --- frontend/src/components/CommentsModal.jsx | 104 +++++++++++++++----- frontend/src/components/FollowListModal.css | 24 ++--- frontend/src/components/FollowListModal.jsx | 4 +- 3 files changed, 92 insertions(+), 40 deletions(-) diff --git a/frontend/src/components/CommentsModal.jsx b/frontend/src/components/CommentsModal.jsx index 0f817a3..9fa295a 100644 --- a/frontend/src/components/CommentsModal.jsx +++ b/frontend/src/components/CommentsModal.jsx @@ -14,37 +14,57 @@ export default function CommentsModal({ post, onClose, onUpdate }) { const [loadingPost, setLoadingPost] = useState(false) // Загрузить полные данные поста с комментариями - const loadFullPost = useCallback(async () => { - if (!post?._id) { + const loadFullPost = useCallback(async (postId) => { + if (!postId) { return } try { setLoadingPost(true) - const response = await getPosts() - const foundPost = response.posts?.find(p => p._id === post._id) + // Загрузить посты с фильтром по автору поста для оптимизации + // Если это не помогает, загружаем больше постов + const authorId = post?.author?._id || post?.author + const response = authorId + ? await getPosts({ userId: authorId, limit: 100 }) + : await getPosts({ limit: 200 }) + + const foundPost = response.posts?.find(p => p._id === postId) if (foundPost) { + // Проверяем, что комментарии populate'ены с авторами + const commentsWithAuthors = (foundPost.comments || []).filter(c => { + return c && c.author && (typeof c.author === 'object') + }) + setComments(commentsWithAuthors) setFullPost(foundPost) - // Убедимся, что комментарии загружены с авторами - const commentsWithAuthors = foundPost.comments || [] + } else { + // Если не нашли, используем переданные данные + const commentsWithAuthors = (post.comments || []).filter(c => { + return c && c.author && (typeof c.author === 'object') + }) setComments(commentsWithAuthors) } } catch (error) { console.error('[CommentsModal] Ошибка загрузки поста:', error) + // Fallback на переданные данные + const commentsWithAuthors = (post.comments || []).filter(c => { + return c && c.author && (typeof c.author === 'object') + }) + setComments(commentsWithAuthors) } finally { setLoadingPost(false) } - }, [post?._id]) + }, [post?.author]) useEffect(() => { - if (post) { + if (post && post._id) { // Сначала установим переданные данные setFullPost(post) - setComments(post.comments || []) - // Затем загрузим полные данные - if (post._id) { - loadFullPost() - } + const initialComments = (post.comments || []).filter(c => { + return c && c.author && (typeof c.author === 'object') + }) + setComments(initialComments) + // Затем загрузим полные данные для обновления + loadFullPost(post._id) } }, [post?._id, loadFullPost]) @@ -63,24 +83,47 @@ export default function CommentsModal({ post, onClose, onUpdate }) { hapticFeedback('light') const result = await commentPost(post._id, comment) - if (result && result.comments) { - // Обновить комментарии из ответа API - setComments(result.comments) + console.log('[CommentsModal] Результат добавления комментария:', result) + + if (result && result.comments && Array.isArray(result.comments)) { + // Фильтруем комментарии с авторами (проверяем, что author - объект) + const commentsWithAuthors = result.comments.filter(c => { + return c && c.author && (typeof c.author === 'object') + }) + + console.log('[CommentsModal] Отфильтрованные комментарии:', commentsWithAuthors.length, 'из', result.comments.length) + + setComments(commentsWithAuthors) // Обновить полный пост if (fullPost) { - setFullPost({ ...fullPost, comments: result.comments }) + setFullPost({ ...fullPost, comments: commentsWithAuthors }) } - } - setComment('') - hapticFeedback('success') - // Обновить данные поста - await loadFullPost() - if (onUpdate) { - onUpdate() + setComment('') + hapticFeedback('success') + + // Обновить данные поста для синхронизации (но не блокируем UI) + loadFullPost(post._id).catch(err => { + console.error('[CommentsModal] Ошибка при обновлении после добавления:', err) + }) + + if (onUpdate) { + onUpdate() + } + } else { + console.error('[CommentsModal] Неожиданный формат ответа:', result) + hapticFeedback('error') + // Попробуем перезагрузить комментарии + await loadFullPost(post._id) } } catch (error) { - console.error('Ошибка добавления комментария:', error) + console.error('[CommentsModal] Ошибка добавления комментария:', error) hapticFeedback('error') + // Попробуем перезагрузить комментарии в случае ошибки + try { + await loadFullPost(post._id) + } catch (reloadError) { + console.error('[CommentsModal] Ошибка при перезагрузке:', reloadError) + } } finally { setLoading(false) } @@ -169,10 +212,18 @@ export default function CommentsModal({ post, onClose, onUpdate }) { ) : ( comments - .filter(c => c && c.author) // Фильтруем комментарии без автора + .filter(c => { + // Фильтруем комментарии без автора или с неполным автором + return c && c.author && (typeof c.author === 'object') && c.content + }) .map((c, index) => { // Используем _id если есть, иначе index const commentId = c._id || c.id || `comment-${index}` + // Проверяем, что автор полностью загружен + if (!c.author || typeof c.author !== 'object') { + console.warn('[CommentsModal] Комментарий без автора:', c) + return null + } return (
) }) + .filter(Boolean) // Убираем null значения )}
diff --git a/frontend/src/components/FollowListModal.css b/frontend/src/components/FollowListModal.css index 827793c..11f79fa 100644 --- a/frontend/src/components/FollowListModal.css +++ b/frontend/src/components/FollowListModal.css @@ -103,16 +103,16 @@ } .user-item-wrapper { - padding: 8px 16px; + padding: 4px 12px; } .user-item { display: flex; align-items: center; - gap: 12px; + gap: 10px; cursor: pointer; transition: background 0.2s; - padding: 8px; + padding: 6px; border-radius: 8px; position: relative; } @@ -122,8 +122,8 @@ } .user-avatar { - width: 36px; - height: 36px; + width: 32px; + height: 32px; border-radius: 50%; object-fit: cover; flex-shrink: 0; @@ -134,23 +134,23 @@ min-width: 0; display: flex; flex-direction: column; - gap: 2px; + gap: 1px; } .user-name { - font-size: 15px; + font-size: 14px; font-weight: 600; color: var(--text-primary); - line-height: 1.2; + line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .user-username { - font-size: 13px; + font-size: 12px; color: var(--text-secondary); - line-height: 1.2; + line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; @@ -158,8 +158,8 @@ /* Follow Button Icon */ .follow-btn-icon { - width: 36px; - height: 36px; + width: 32px; + height: 32px; border-radius: 50%; background: var(--bg-primary); color: var(--text-primary); diff --git a/frontend/src/components/FollowListModal.jsx b/frontend/src/components/FollowListModal.jsx index 15c6e57..e91bcba 100644 --- a/frontend/src/components/FollowListModal.jsx +++ b/frontend/src/components/FollowListModal.jsx @@ -112,9 +112,9 @@ export default function FollowListModal({ users, title, onClose, currentUser }) onClick={(e) => handleFollowToggle(user._id, e)} > {isFollowing ? ( - + ) : ( - + )} )}