fix: comments newest-first, input on top

src/components/TaskModal.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 import {
   Task, Member, Step, Message,
   updateTask, deleteTask, getMembers,
@@ -53,7 +53,6 @@ export default function TaskModal({ task, projectId, projectSlug, onClose, onUpd
   const [confirmDelete, setConfirmDelete] = useState(false);
   const [newStep, setNewStep] = useState("");
   const [newComment, setNewComment] = useState("");
-  const commentsEndRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
     getMembers().then(setMembers).catch(() => {});
@@ -61,10 +60,6 @@ export default function TaskModal({ task, projectId, projectSlug, onClose, onUpd
     getMessages({ task_id: task.id }).then(setComments).catch(() => {});
   }, [task.id]);
 
-  useEffect(() => {
-    commentsEndRef.current?.scrollIntoView({ behavior: "smooth" });
-  }, [comments]);
-
   const save = async (patch: Partial<Task>) => {
     setSaving(true);
     try {
@@ -242,8 +237,18 @@ export default function TaskModal({ task, projectId, projectSlug, onClose, onUpd
             {/* Comments */}
             <div>
               <div className="text-sm text-[var(--muted)] mb-2">Комментарии</div>
+              <div className="flex gap-2 mb-3">
+                <input
+                  value={newComment}
+                  onChange={(e) => setNewComment(e.target.value)}
+                  onKeyDown={(e) => e.key === "Enter" && handleAddComment()}
+                  placeholder="Написать комментарий..."
+                  className="flex-1 bg-[var(--bg)] border border-[var(--border)] rounded px-2 py-1.5 text-sm outline-none focus:border-[var(--accent)]"
+                />
+                <button onClick={handleAddComment} className="text-xs text-[var(--accent)] px-2">↵</button>
+              </div>
               <div className="space-y-3 max-h-[300px] overflow-y-auto">
-                {comments.map((msg) => (
+                {[...comments].reverse().map((msg) => (
                   <div key={msg.id} className="text-sm">
                     <div className="flex items-center gap-1 text-xs text-[var(--muted)] mb-0.5">
                       <span>{AUTHOR_ICON[msg.author_type] || "👤"}</span>
@@ -257,17 +262,6 @@ export default function TaskModal({ task, projectId, projectSlug, onClose, onUpd
                 {comments.length === 0 && (
                   <div className="text-sm text-[var(--muted)] italic">Нет комментариев</div>
                 )}
-                <div ref={commentsEndRef} />
-              </div>
-              <div className="flex gap-2 mt-3">
-                <input
-                  value={newComment}
-                  onChange={(e) => setNewComment(e.target.value)}
-                  onKeyDown={(e) => e.key === "Enter" && handleAddComment()}
-                  placeholder="Написать комментарий..."
-                  className="flex-1 bg-[var(--bg)] border border-[var(--border)] rounded px-2 py-1.5 text-sm outline-none focus:border-[var(--accent)]"
-                />
-                <button onClick={handleAddComment} className="text-xs text-[var(--accent)] px-2">↵</button>
               </div>
             </div>
           </div>