canastack-admin
/
sw-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix auto-scroll on post open - only scroll on new comment (v0.0.90) 

- Add justCommentedRef to track when user submits a comment
- Only scroll to comments bottom when user adds new comment
- Don't auto-scroll when modal opens with existing comments

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Your Name 2026-01-20 07:07:29 +00:00
parent d051a9337c
commit f4fe10d804
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,7 +1,7 @@
{ {
"name": "sociowire-frontend", "name": "sociowire-frontend",
"private": true, "private": true,
"version": "0.0.89", "version": "0.0.90",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite --host 0.0.0.0", "dev": "vite --host 0.0.0.0",

10
src/components/Posts/PostDetailModal.jsx
View File

@ -504,6 +504,7 @@ export default function PostDetailModal({ post, onClose, onPostUpdated, onPostDe
const [fullscreen, setFullscreen] = useState(false); const [fullscreen, setFullscreen] = useState(false);
const commentsEndRef = useRef(null); const commentsEndRef = useRef(null);
const justCommentedRef = useRef(false);
const postId = post?.id || post?._id; const postId = post?.id || post?._id;
const isAuthor = username && (post?.author === username || post?.username === username); const isAuthor = username && (post?.author === username || post?.username === username);
const postType = useMemo(() => getPostType(post), [post]); const postType = useMemo(() => getPostType(post), [post]);
@ -568,7 +569,13 @@ export default function PostDetailModal({ post, onClose, onPostUpdated, onPostDe
}, [postId]); }, [postId]);
useEffect(() => { refreshComments(true); }, [refreshComments]); useEffect(() => { refreshComments(true); }, [refreshComments]);
useEffect(() => { if (showComments) commentsEndRef.current?.scrollIntoView({ behavior: "smooth" }); }, [comments, showComments]); useEffect(() => {
// Only scroll to bottom when user just added a comment, not on initial load
if (showComments && justCommentedRef.current) {
commentsEndRef.current?.scrollIntoView({ behavior: "smooth" });
justCommentedRef.current = false;
}
}, [comments, showComments]);
// Handlers // Handlers
const handleLike = useCallback(async () => { const handleLike = useCallback(async () => {
@ -602,6 +609,7 @@ export default function PostDetailModal({ post, onClose, onPostUpdated, onPostDe
setCommentSending(true); setCommentSending(true);
const tempId = `temp_${Date.now()}`; const tempId = `temp_${Date.now()}`;
const newComment = { id: tempId, body, username: username || "You", created_at: new Date().toISOString(), _pending: true }; const newComment = { id: tempId, body, username: username || "You", created_at: new Date().toISOString(), _pending: true };
justCommentedRef.current = true;
setComments(prev => [...prev, newComment]); setComments(prev => [...prev, newComment]);
setCounts(c => ({ ...c, comments: c.comments + 1 })); setCounts(c => ({ ...c, comments: c.comments + 1 }));
const res = await createPostComment(postId, body); const res = await createPostComment(postId, body);