moderation: add chat bans for groups/channels with web actions

web/src/api/chats.ts

@@ -329,6 +329,14 @@ export async function removeChatMember(chatId: number, userId: number): Promise<
   await http.delete(`/chats/${chatId}/members/${userId}`);
 }
 
+export async function banChatMember(chatId: number, userId: number): Promise<void> {
+  await http.post(`/chats/${chatId}/bans/${userId}`);
+}
+
+export async function unbanChatMember(chatId: number, userId: number): Promise<void> {
+  await http.delete(`/chats/${chatId}/bans/${userId}`);
+}
+
 export async function leaveChat(chatId: number): Promise<void> {
   await http.post(`/chats/${chatId}/leave`);
 }

web/src/components/ChatInfoPanel.tsx

@@ -2,6 +2,7 @@ import { useEffect, useMemo, useState } from "react";
 import { createPortal } from "react-dom";
 import {
   addChatMember,
+  banChatMember,
   createInviteLink,
   getChatAttachments,
   getMessages,
@@ -785,6 +786,24 @@ export function ChatInfoPanel({ chatId, open, onClose }: Props) {
               Transfer ownership
             </button>
           ) : null}
+          {(myRoleNormalized === "owner" || (myRoleNormalized === "admin" && memberCtx.member.role === "member")) ? (
+            <button
+              className="block w-full rounded px-2 py-1.5 text-left text-sm text-red-300 hover:bg-slate-800"
+              onClick={async () => {
+                try {
+                  await banChatMember(chatId, memberCtx.member.user_id);
+                  await refreshMembers(chatId);
+                } catch {
+                  setError("Failed to ban member");
+                } finally {
+                  setMemberCtx(null);
+                }
+              }}
+              type="button"
+            >
+              Ban from chat
+            </button>
+          ) : null}
           {(myRoleNormalized === "owner" || (myRoleNormalized === "admin" && memberCtx.member.role === "member")) ? (
             <button
               className="block w-full rounded px-2 py-1.5 text-left text-sm text-red-300 hover:bg-slate-800"
@@ -800,7 +819,7 @@ export function ChatInfoPanel({ chatId, open, onClose }: Props) {
               }}
               type="button"
             >
-              Remove from chat
+              Remove from chat (without ban)
             </button>
           ) : null}
           <button