feat: chat messages — instant scroll, in-room search, room search reset on back

- openRoom: set instantScrollRef before setMessages → scrollTop=scrollHeight synchronously, no visible jump
- In-room search: 🔍 button in messages header, filter messages client-side, empty state
- Room search state reset when opening/closing room

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/components/chat/ChatWidget.tsx

@@ -146,6 +146,12 @@ export function ChatWidget() {
   // Toast notifications
   const [toasts, setToasts] = useState<ToastNotif[]>([])
 
+  // In-room search
+  const [roomSearch, setRoomSearch]       = useState('')
+  const [roomSearchOpen, setRoomSearchOpen] = useState(false)
+  const roomSearchInputRef = useRef<HTMLInputElement>(null)
+
+  const messagesContainerRef = useRef<HTMLDivElement>(null)
   const messagesEndRef  = useRef<HTMLDivElement>(null)
   const searchInputRef  = useRef<HTMLInputElement>(null)
   const fileInputRef    = useRef<HTMLInputElement>(null)
@@ -154,6 +160,7 @@ export function ChatWidget() {
   const prevMsgCountRef = useRef<number>(0)
   const typingTimerRef  = useRef<ReturnType<typeof setTimeout> | null>(null)
   const isTypingRef     = useRef(false)
+  const instantScrollRef = useRef(false)
 
   const totalUnread = rooms.reduce((s, r) => s + (Number(r.unreadCount) || 0), 0)
 
@@ -223,8 +230,17 @@ export function ChatWidget() {
     return () => clearInterval(t)
   }, [open, slug])
 
-  // Auto-scroll
+  // Auto-scroll — instant on initial load, smooth on new messages
-  useEffect(() => { messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' }) }, [messages])
+  useEffect(() => {
+    const el = messagesContainerRef.current
+    if (!el) return
+    if (instantScrollRef.current) {
+      el.scrollTop = el.scrollHeight
+      instantScrollRef.current = false
+    } else {
+      messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' })
+    }
+  }, [messages])
 
   // Poll messages + typing
   useEffect(() => {
@@ -313,10 +329,12 @@ export function ChatWidget() {
 
   const openRoom = async (room: ChatRoom) => {
     setActiveRoom(room); setView('messages'); setLoadingMsgs(true)
+    setRoomSearch(''); setRoomSearchOpen(false)
     prevMsgCountRef.current = 0; isTypingRef.current = false
     try {
       const msgs = await api.chat.getMessages(slug, room.id)
       prevMsgCountRef.current = msgs.length
+      instantScrollRef.current = true
       setMessages(msgs)
       await api.chat.markRead(slug, room.id)
       setRooms(prev => prev.map(r => r.id === room.id ? { ...r, unreadCount: 0 } : r))
@@ -406,6 +424,7 @@ export function ChatWidget() {
   const goBack = () => {
     if (view === 'messages') {
       sendTyping(false)
+      setRoomSearch(''); setRoomSearchOpen(false)
       setView('rooms'); setActiveRoom(null); setEditingMsgId(null); setTypingNames([])
     }
     else if (view === 'search') { setView('rooms'); setSearchQuery('') }
@@ -480,6 +499,12 @@ export function ChatWidget() {
                 <button onClick={() => setView('settings')} className="p-1.5 hover:bg-white/20 rounded-lg transition-colors"><Settings size={15} /></button>
               </div>
             )}
+            {view === 'messages' && activeRoom?.type !== 'notifications' && (
+              <button onClick={() => { setRoomSearchOpen(v => !v); setTimeout(() => roomSearchInputRef.current?.focus(), 50) }}
+                className={cn('p-1.5 rounded-lg transition-colors shrink-0', roomSearchOpen ? 'bg-white/30' : 'hover:bg-white/20')}>
+                <Search size={15} />
+              </button>
+            )}
           </div>
 
           {/* ── Rooms ── */}
@@ -591,15 +616,33 @@ export function ChatWidget() {
           {/* ── Messages ── */}
           {view === 'messages' && (
             <>
-              <div className="flex-1 overflow-y-auto px-3 py-3 space-y-2">
+              {/* In-room search bar */}
+              {roomSearchOpen && (
+                <div className="px-3 py-2 border-b border-slate-200 dark:border-slate-700 shrink-0 bg-white dark:bg-slate-800">
+                  <div className="flex items-center gap-2 bg-slate-100 dark:bg-slate-700 rounded-xl px-3 py-1.5">
+                    <Search size={13} className="text-slate-400 shrink-0" />
+                    <input ref={roomSearchInputRef} value={roomSearch} onChange={e => setRoomSearch(e.target.value)}
+                      placeholder="Поиск в чате..."
+                      className="flex-1 bg-transparent text-sm text-slate-800 dark:text-slate-200 placeholder-slate-400 outline-none" />
+                    {roomSearch && <button onClick={() => setRoomSearch('')} className="text-slate-400 hover:text-slate-600"><X size={12} /></button>}
+                  </div>
+                </div>
+              )}
+              <div ref={messagesContainerRef} className="flex-1 overflow-y-auto px-3 py-3 space-y-2">
                 {loadingMsgs ? (
                   <div className="flex items-center justify-center h-32"><Loader2 size={20} className="animate-spin text-slate-400" /></div>
                 ) : messages.length === 0 ? (
                   <div className="text-center py-10 text-sm text-slate-400">
                     {activeRoom?.type === 'notifications' ? 'Уведомлений пока нет' : 'Нет сообщений. Напишите первым!'}
                   </div>
-                ) : (
+                ) : (() => {
-                  messages.map(msg => (
+                  const filtered = roomSearch.trim()
+                    ? messages.filter(m => !m.deletedAt && m.text.toLowerCase().includes(roomSearch.toLowerCase()))
+                    : messages
+                  if (filtered.length === 0) return (
+                    <div className="text-center py-10 text-sm text-slate-400">Ничего не найдено</div>
+                  )
+                  return filtered.map(msg => (
                     <MessageBubble
                       key={msg.id}
                       msg={msg}
@@ -618,7 +661,7 @@ export function ChatWidget() {
                       onReaction={emoji => toggleReaction(msg, emoji)}
                     />
                   ))
-                )}
+                })()}
 
                 {/* Typing indicator */}
                 {typingNames.length > 0 && (