From b934d6b2908a49b78ee2053a1abe221ad06a3199 Mon Sep 17 00:00:00 2001
From: Travis Ralston <travisr@element.io>
Date: Thu, 28 Aug 2025 15:41:58 -0600
Subject: [PATCH 1/2] Break a bunch of rules and render an indicator in the
 view model

---
 .../user_info/admin/UserInfoBanButtonViewModel.tsx     | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx b/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
index 525b10e0936..46583d1f1ff 100644
--- a/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
+++ b/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 import { logger } from "@sentry/browser";
 import { type Room } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
+import React, { type ReactNode } from "react";
 
 import { useMatrixClientContext } from "../../../../../contexts/MatrixClientContext";
 import { _t } from "../../../../../languageHandler";
@@ -29,7 +30,7 @@ export interface BanButtonState {
 }
 /**
  * The view model for the room ban button used in the UserInfoAdminToolsContainer
- * @param {RoomAdminToolsProps} props - the object containing the necceray props for banButton the view model
+ * @param {RoomAdminToolsProps} props - the object containing the necessary props for banButton the view model
  * @param {Room} props.room - the room to ban/unban the user in
  * @param {RoomMember} props.member - the member to ban/unban
  * @param {boolean} props.isUpdating - whether the operation is currently in progress
@@ -67,8 +68,15 @@ export const useBanButtonViewModel = (props: RoomAdminToolsProps): BanButtonStat
                 : _t("user_info|ban_room_confirm_title", { roomName: room.name }),
             askReason: !isBanned,
             danger: !isBanned,
+            children: [] as ReactNode,
         };
 
+        const msc4333Config = cli.msc4333Moderation.getModerationConfigFor(props.room.roomId);
+        if (msc4333Config) {
+            commonProps["children"] = [<p key={1}>Test</p>];
+        }
+        console.log(msc4333Config);
+
         let finished: Promise<[success?: boolean, reason?: string, rooms?: Room[]]>;
 
         if (room.isSpaceRoom()) {

From 527b44bb7a7dd8a79ced42d7f8a2e7e8fe435a60 Mon Sep 17 00:00:00 2001
From: Travis Ralston <travisr@element.io>
Date: Thu, 28 Aug 2025 18:36:10 -0600
Subject: [PATCH 2/2] Make it work

---
 .../admin/UserInfoBanButtonViewModel.tsx      | 22 +++++++++++++------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx b/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
index 46583d1f1ff..52eba9b3bb1 100644
--- a/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
+++ b/src/components/viewmodels/right_panel/user_info/admin/UserInfoBanButtonViewModel.tsx
@@ -72,10 +72,10 @@ export const useBanButtonViewModel = (props: RoomAdminToolsProps): BanButtonStat
         };
 
         const msc4333Config = cli.msc4333Moderation.getModerationConfigFor(props.room.roomId);
-        if (msc4333Config) {
-            commonProps["children"] = [<p key={1}>Test</p>];
+        if (msc4333Config && !isBanned) {
+            const managementRoom = cli.getRoom(msc4333Config.managementRoomId);
+            commonProps["children"] = [<p key={1}>You are banning this user using {managementRoom?.name} (via {msc4333Config.botUserId}).</p>];
         }
-        console.log(msc4333Config);
 
         let finished: Promise<[success?: boolean, reason?: string, rooms?: Room[]]>;
 
@@ -127,10 +127,18 @@ export const useBanButtonViewModel = (props: RoomAdminToolsProps): BanButtonStat
         }
 
         const fn = (roomId: string): Promise<unknown> => {
-            if (isBanned) {
-                return cli.unban(roomId, member.userId);
-            } else {
-                return cli.ban(roomId, member.userId, reason || undefined);
+            try {
+                if (isBanned) {
+                    return cli.unban(roomId, member.userId);
+                } else {
+                    if (msc4333Config) {
+                        return cli.sendMessage(msc4333Config.managementRoomId, msc4333Config.banCommand.render(member.userId, roomId, reason || ""))
+                    }
+                    return cli.ban(roomId, member.userId, reason || undefined);
+                }
+            } catch (e) {
+                console.error(e);
+                throw e; // re-throw
             }
         };