Mirrors/gomuks
1
0
Fork 1
mirror of https://github.com/tulir/gomuks.git synced 2025-04-20 18:43:41 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

web/roomlist: limit unread counter values

Browse source
This commit is contained in:
Tulir Asokan 2024-12-08 17:32:05 +02:00
parent 4ea43b77c7
commit 332d71cadd
2 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
web/src/ui/roomlist/Entry.tsx
View file

@ -55,6 +55,15 @@ interface InnerProps {
const EntryInner = ({ room }: InnerProps) => { const EntryInner = ({ room }: InnerProps) => {
const [previewText, croppedPreviewText] = usePreviewText(room.preview_event, room.preview_sender) const [previewText, croppedPreviewText] = usePreviewText(room.preview_event, room.preview_sender)
const unreadCount = room.unread_messages || room.unread_notifications || room.unread_highlights
const countIsBig = Boolean(room.unread_notifications || room.unread_highlights)
let unreadCountDisplay = unreadCount.toString()
if (unreadCount > 999 && countIsBig) {
unreadCountDisplay = "99+"
} else if (unreadCount > 9999 && countIsBig) {
unreadCountDisplay = "999+"
}
return <> return <>
<div className="room-entry-left"> <div className="room-entry-left">
<img <img
@ -69,12 +78,12 @@ const EntryInner = ({ room }: InnerProps) => {
{previewText && <div className="message-preview" title={previewText}>{croppedPreviewText}</div>} {previewText && <div className="message-preview" title={previewText}>{croppedPreviewText}</div>}
</div> </div>
{(room.unread_messages || room.marked_unread) ? <div className="room-entry-unreads"> {(room.unread_messages || room.marked_unread) ? <div className="room-entry-unreads">
<div className={`unread-count ${ <div title={unreadCount.toString()} className={`unread-count ${
room.marked_unread ? "marked-unread" : ""} ${ room.marked_unread ? "marked-unread" : ""} ${
room.unread_notifications ? "notified" : ""} ${ room.unread_notifications ? "notified" : ""} ${
room.unread_highlights ? "highlighted" : ""}`} room.unread_highlights ? "highlighted" : ""}`}
> >
{room.unread_messages || room.unread_notifications || room.unread_highlights} {unreadCountDisplay}
</div> </div>
</div> : null} </div> : null}
</> </>

1
web/src/ui/roomlist/RoomList.css
View file

@ -104,6 +104,7 @@ div.room-entry {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 3rem; width: 3rem;
margin-right: .25rem;
> div.unread-count { > div.unread-count {
--unread-count-size: 1rem; --unread-count-size: 1rem;