V0.7.1 New user online and pin features

frontend/src/components/MessageInput.jsx

@@ -12,7 +12,7 @@ function isEmojiOnly(str) {
   return emojiRegex.test(str.trim());
 }
 
-export default function MessageInput({ group, replyTo, onCancelReply, onSend, onTyping }) {
+export default function MessageInput({ group, replyTo, onCancelReply, onSend, onTyping, onlineUserIds = new Set() }) {
   const [text, setText] = useState('');
   const [imageFile, setImageFile] = useState(null);
   const [imagePreview, setImagePreview] = useState(null);
@@ -269,7 +269,10 @@ export default function MessageInput({ group, replyTo, onCancelReply, onSend, on
               className={`mention-item ${i === mentionIndex ? 'active' : ''}`}
               onMouseDown={(e) => { e.preventDefault(); insertMention(u); }}
             >
-              <div className="mention-avatar">{(u.display_name || u.name)?.[0]?.toUpperCase()}</div>
+              <div className="mention-avatar-wrap">
+                <div className="mention-avatar">{(u.display_name || u.name)?.[0]?.toUpperCase()}</div>
+                {onlineUserIds.has(u.id) && <span className="mention-online-dot" />}
+              </div>
               <span>{u.display_name || u.name}</span>
               <span className="mention-role">{u.role}</span>
             </button>