benya/Messenger
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): show avatars in chat info moderation lists
Some checks are pending
CI / test (push) Has started running
Details

Browse Source
This commit is contained in:
Alex
2026-03-08 21:38:25 +03:00
parent 119b423632
commit 9f94084e3f
2 changed files with 32 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/core-checklist-status.md
View File

@@ -31,7 +31,7 @@ Legend:
22. Text Formatting - `PARTIAL` (bold/italic/underline/spoiler/mono/links + strikethrough + quote/code block; toolbar still evolving)
23. Groups - `PARTIAL` (create/add/remove/invite link; join-by-invite and invite permissions covered by integration tests; members API now returns profile fields (`username/name/avatar_url`) and web Chat Info consumes them to avoid extra per-member profile requests; advanced moderation still partial)
24. Roles - `DONE` (owner/admin/member)
25. Admin Rights - `PARTIAL` (delete/pin/edit info + explicit ban APIs for groups/channels including ban list endpoint; web Chat Info now shows searchable `Banned users` with right-click `Unban` action for owner/admin, plus member search and invite-link copy/regenerate actions; integration tests cover channel member read-only, channel admin full-delete, channel message delete-for-all permissions, group profile edit permissions, owner-only role management rules, and admin-visible/member-forbidden ban-list access; remaining UX moderation tools limited)
25. Admin Rights - `PARTIAL` (delete/pin/edit info + explicit ban APIs for groups/channels including ban list endpoint; web Chat Info now shows searchable `Banned users` with right-click `Unban` action for owner/admin, member search, avatars in moderation lists, and invite-link copy/regenerate actions; integration tests cover channel member read-only, channel admin full-delete, channel message delete-for-all permissions, group profile edit permissions, owner-only role management rules, and admin-visible/member-forbidden ban-list access; remaining UX moderation tools limited)
26. Channels - `PARTIAL` (create/post/edit/delete/subscribe/unsubscribe; integration tests now also cover invite-link permissions (member forbidden, admin allowed); UX edge-cases still polishing)
27. Channel Types - `DONE` (public/private)
28. Notifications - `PARTIAL` (browser notifications + mute/settings; chat mute is propagated in chat list payload, honored by web realtime notifications with mention override, and mute toggle now syncs instantly in chat store; backend now emits `chat_updated` after notification mute/unmute for cross-tab consistency; no mobile push infra)

42
web/src/components/ChatInfoPanel.tsx
View File

@@ -578,13 +578,24 @@ export function ChatInfoPanel({ chatId, open, onClose }: Props) {
}}
type="button"
>
<p className="flex items-center gap-1 truncate text-sm font-semibold">
<span className="truncate">{user?.name || `user #${member.user_id}`}</span>
{member.role === "owner" ? <span className="rounded bg-amber-500/20 px-1.5 py-0.5 text-[10px] text-amber-300">👑 owner</span> : null}
{member.role === "admin" ? <span className="rounded bg-sky-500/20 px-1.5 py-0.5 text-[10px] text-sky-300">👑 admin</span> : null}
</p>
<p className="truncate text-xs text-slate-400">@{user?.username || "unknown"}</p>
{canOpenMemberMenu ? <p className="mt-1 text-[11px] text-slate-500">Right click for actions</p> : null}
<div className="flex items-start gap-2">
{user?.avatar_url ? (
<img alt="avatar" className="h-8 w-8 shrink-0 rounded-full object-cover" src={user.avatar_url} />
) : (
<div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-sky-500/30 text-[11px] font-semibold uppercase text-sky-100">
{initialsFromName(user?.name || user?.username || `user ${member.user_id}`)}
</div>
)}
<div className="min-w-0 flex-1">
<p className="flex items-center gap-1 truncate text-sm font-semibold">
<span className="truncate">{user?.name || `user #${member.user_id}`}</span>
{member.role === "owner" ? <span className="rounded bg-amber-500/20 px-1.5 py-0.5 text-[10px] text-amber-300">👑 owner</span> : null}
{member.role === "admin" ? <span className="rounded bg-sky-500/20 px-1.5 py-0.5 text-[10px] text-sky-300">👑 admin</span> : null}
</p>
<p className="truncate text-xs text-slate-400">@{user?.username || "unknown"}</p>
{canOpenMemberMenu ? <p className="mt-1 text-[11px] text-slate-500">Right click for actions</p> : null}
</div>
</div>
</button>
);
})}
@@ -680,10 +691,19 @@ export function ChatInfoPanel({ chatId, open, onClose }: Props) {
}}
type="button"
>
<div className="min-w-0">
<p className="truncate text-xs font-semibold text-slate-200">{user?.name || `user #${ban.user_id}`}</p>
<p className="truncate text-[11px] text-slate-400">@{user?.username || "unknown"}</p>
<p className="truncate text-[10px] text-slate-500">Right click for actions</p>
<div className="flex min-w-0 items-start gap-2">
{user?.avatar_url ? (
<img alt="avatar" className="h-8 w-8 shrink-0 rounded-full object-cover" src={user.avatar_url} />
) : (
<div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-slate-700 text-[11px] font-semibold uppercase text-slate-200">
{initialsFromName(user?.name || user?.username || `user ${ban.user_id}`)}
</div>
)}
<div className="min-w-0">
<p className="truncate text-xs font-semibold text-slate-200">{user?.name || `user #${ban.user_id}`}</p>
<p className="truncate text-[11px] text-slate-400">@{user?.username || "unknown"}</p>
<p className="truncate text-[10px] text-slate-500">Right click for actions</p>
</div>
</div>
<span className="rounded bg-slate-700 px-2 py-1 text-[11px]">Banned</span>
</button>