fix(chat): don't show private chat picker if disabled (#16556)

* fix: 🐛 don't show private chat picker if disabled

* style: 🚨

* refactor: ♻️ combine function

react/features/base/participants/functions.ts

@@ -768,17 +768,30 @@ export const setShareDialogVisiblity = (addPeopleFeatureEnabled: boolean, dispat
 };
 
 /**
- * Checks if private chat is enabled for the given participant.
+ * Checks if private chat is enabled for the given participant or local participant.
  *
  * @param {IParticipant|IVisitorChatParticipant|undefined} participant - The participant to check.
  * @param {IReduxState} state - The Redux state.
+ * @param {boolean} [checkSelf=false] - Whether to check for local participant's ability to send messages.
  * @returns {boolean} - True if private chat is enabled, false otherwise.
  */
-export function isPrivateChatEnabled(participant: IParticipant | IVisitorChatParticipant | undefined, state: IReduxState) {
+export function isPrivateChatEnabled(
+        participant: IParticipant | IVisitorChatParticipant | undefined,
+        state: IReduxState,
+        checkSelf: boolean = false
+): boolean {
     const { remoteVideoMenu = {} } = state['features/base/config'];
     const { disablePrivateChat } = remoteVideoMenu;
 
-    if ((!isVisitorChatParticipant(participant) && participant?.local) || disablePrivateChat === 'all') {
+    // If checking self capability (if the local participant can send messages) ignore the local participant blocking rule
+    const isLocal = !isVisitorChatParticipant(participant) && participant?.local;
+
+    if (isLocal && !checkSelf) {
+        return false;
+    }
+
+    // Check if private chat is disabled globally
+    if (disablePrivateChat === 'all') {
         return false;
     }
 
@@ -798,3 +811,15 @@ export function isPrivateChatEnabled(participant: IParticipant | IVisitorChatPar
 
     return !disablePrivateChat;
 }
+
+/**
+ * Checks if private chat is enabled for the local participant (can they send private messages).
+ *
+ * @param {IReduxState} state - The Redux state.
+ * @returns {boolean} - True if the local participant can send private messages, false otherwise.
+ */
+export function isPrivateChatEnabledSelf(state: IReduxState): boolean {
+    const localParticipant = getLocalParticipant(state);
+
+    return isPrivateChatEnabled(localParticipant, state, true);
+}

react/features/chat/components/web/Chat.tsx

@@ -6,7 +6,7 @@ import { makeStyles } from 'tss-react/mui';
 import { IReduxState } from '../../../app/types';
 import { translate } from '../../../base/i18n/functions';
 import { IconInfo, IconMessage, IconShareDoc, IconSubtitles } from '../../../base/icons/svg';
-import { getLocalParticipant, getRemoteParticipants } from '../../../base/participants/functions';
+import { getLocalParticipant, getRemoteParticipants, isPrivateChatEnabledSelf } from '../../../base/participants/functions';
 import Select from '../../../base/ui/components/web/Select';
 import Tabs from '../../../base/ui/components/web/Tabs';
 import { arePollsDisabled } from '../../../conference/functions.any';
@@ -242,6 +242,7 @@ const Chat = ({
     } = useSelector((state: IReduxState) => state['features/base/config']);
     const privateMessageRecipient = useSelector((state: IReduxState) => state['features/chat'].privateMessageRecipient);
     const participants = useSelector(getRemoteParticipants);
+    const isPrivateChatAllowed = useSelector((state: IReduxState) => isPrivateChatEnabledSelf(state));
 
     const options = useMemo(() => {
         const o = Array.from(participants?.values() || [])
@@ -431,12 +432,14 @@ const Chat = ({
                     <MessageContainer
                         messages = { _messages } />
                     <MessageRecipient />
-                    <Select
-                        containerClassName = { cx(classes.privateMessageRecipientsList) }
-                        id = 'select-chat-recipient'
-                        onChange = { onSelectedRecipientChange }
-                        options = { options }
-                        value = { privateMessageRecipient?.id || OPTION_GROUPCHAT } />
+                    {isPrivateChatAllowed && (
+                        <Select
+                            containerClassName = { cx(classes.privateMessageRecipientsList) }
+                            id = 'select-chat-recipient'
+                            onChange = { onSelectedRecipientChange }
+                            options = { options }
+                            value = { privateMessageRecipient?.id || OPTION_GROUPCHAT } />
+                    )}
                     <ChatInput
                         onSend = { onSendMessage } />
                 </div>