Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Widget: a "New reply" button when the visitor has scrolled up

Đang mở
#420 3 bình luận 0 reaction 1 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@srujankaleru2007 đang làm issue này rồi.

Từ ngày 28/10/2026.

  • #447 của @srujankaleru2007 — đang mở

Đánh giá

Issue này chưa được đánh giá.

Mô tả

enhancement hacktoberfest widget

A streaming reply no longer pulls the chat log down while the visitor reads an earlier message (#402): the log only follows new text when it's within 48px of the bottom. A visitor who scrolled up doesn't see that a reply is arriving below, though. This adds a small "New reply" pill, from the widget design, that shows in that case and takes them down.

What it should do

  • When text arrives for a reply, or a new message is added, while the log is scrolled up (not nearBottom()), show a pill at the bottom of the log: "New reply ↓".
  • Clicking it scrolls to the bottom (smoothly, unless prefers-reduced-motion) and hides it. Scrolling to the bottom by hand hides it too.
  • It's a real <button> with a visible focus ring (--cc-focus-ring). It isn't announced by itself; the live region from #410 already reads the finished reply.
  • The text is a new locale string, newReply, with an English default. Other languages fall back to English until #55 adds it.

Where

  • packages/widget/src/dom/messages.ts: nearBottom() (line 170) is the check, and the stream render and addMessage are where it's used. scrollToBottom() is at line 285.
  • Styles in packages/widget/src/styles/widget.css. Use the theme tokens so it works in light and dark, and logical properties for RTL.
  • The panel has about 900 B left of its 17 kB budget (pnpm size), so keep it small.

Acceptance criteria

  • Unit tests: shown when text arrives while scrolled up, hidden when scrolled down by hand, and click scrolls and hides (see the scroll test in packages/widget/tests/dom/stream.test.ts, which fakes scrollHeight and clientHeight)
  • Not shown while the log is at the bottom
  • The existing e2e test new text doesn't pull the log down (e2e/tests/stream-render.spec.ts) still passes, and a line there checks that the pill is visible
  • A changeset for @chatcops/widget (minor)
  • pnpm test:coverage, pnpm lint and pnpm size pass
Ngôn ngữ chính
TypeScript
Star
13
Fork
7
Merge trung bình
3 giờ 39 phút
Pull request đã merge (30 ngày)
275

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của codercops/chatcops

Tất cả issue của codercops/chatcops

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.