From 945d779b45ebc9d087d9227c6b9a4e3f76e1931a Mon Sep 17 00:00:00 2001
From: lebaudantoine <lebaud.antoine131@gmail.com>
Date: Mon, 1 Jun 2026 15:22:01 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F(frontend)=20wrap=20MuteEvery?=
 =?UTF-8?q?oneButton=20with=20AdminOrOwnerOnly?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Avoids mounting the button's hooks and rendering its logic for users who
are not admin or owner, which previously happened on every re-render
of the parent.
---
 CHANGELOG.md                                  |  1 +
 .../Participants/MuteEveryoneButton.tsx       | 19 +++++++++++++------
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 84e26735..712599e5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -22,6 +22,7 @@ and this project adheres to
 - ✨(meet) use compatible with summary v2 #1362
 - ♻️(backend) refactor analytics backend from Protocol to abstract class
 - 🔥(summary) remove call to summary enabled feature flag
+- ♻️(frontend) wrap MuteEveryoneButton with AdminOrOwnerOnly
 
 ### Fixed
 
diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Participants/MuteEveryoneButton.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Participants/MuteEveryoneButton.tsx
index 137ef866..1bb314ff 100644
--- a/src/frontend/src/features/rooms/livekit/components/controls/Participants/MuteEveryoneButton.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/controls/Participants/MuteEveryoneButton.tsx
@@ -1,23 +1,20 @@
 import { Button } from '@/primitives'
 import { useTranslation } from 'react-i18next'
 import type { Participant } from 'livekit-client'
-import { useIsAdminOrOwner } from '@/features/rooms/livekit/hooks/useIsAdminOrOwner'
 import { useMuteParticipants } from '@/features/rooms/api/muteParticipants'
 import { RiMicOffLine } from '@remixicon/react'
 import { css } from '@/styled-system/css'
+import { AdminOrOwnerOnly } from '@/features/rooms/components/AdminOrOwnerOnly'
 
 type MuteEveryoneButtonProps = {
   participants: Array<Participant>
 }
 
-export const MuteEveryoneButton = ({
-  participants,
-}: MuteEveryoneButtonProps) => {
+const MuteEveryoneButtonInner = ({ participants }: MuteEveryoneButtonProps) => {
   const { muteParticipants } = useMuteParticipants()
   const { t } = useTranslation('rooms')
 
-  const isAdminOrOwner = useIsAdminOrOwner()
-  if (!isAdminOrOwner || !participants.length) return null
+  if (!participants.length) return null
 
   return (
     <Button
@@ -36,3 +33,13 @@ export const MuteEveryoneButton = ({
     </Button>
   )
 }
+
+export const MuteEveryoneButton = ({
+  participants,
+}: MuteEveryoneButtonProps) => {
+  return (
+    <AdminOrOwnerOnly>
+      <MuteEveryoneButtonInner participants={participants} />
+    </AdminOrOwnerOnly>
+  )
+}