Hide buttons based on role in Rooms call (#2944)

* Hide Camera, Microphone, and Screenshare buttons in rooms calls depending on role

* Change files

* Duplicate change files for beta release

Author: mgamis-msft

change-beta/@azure-communication-react-d3e8749e-5cf4-48d6-8783-7599ba4c344f.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Hide Camera, Microphone, and Screenshare buttons in rooms calls depending on role",
+  "packageName": "@azure/communication-react",
+  "email": "79475487+mgamis-msft@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

change/@azure-communication-react-d3e8749e-5cf4-48d6-8783-7599ba4c344f.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Hide Camera, Microphone, and Screenshare buttons in rooms calls depending on role",
+  "packageName": "@azure/communication-react",
+  "email": "79475487+mgamis-msft@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

packages/react-composites/src/composites/common/ControlBar/CommonCallControlBar.tsx

@@ -13,6 +13,8 @@ import { ChatAdapter } from '../../ChatComposite';
 import { ChatButtonWithUnreadMessagesBadge } from '../../CallWithChatComposite/ChatButtonWithUnreadMessagesBadge';
 import { BaseCustomStyles, ControlBarButtonStyles } from '@internal/react-components';
 import { ControlBar } from '@internal/react-components';
+/* @conditional-compile-remove(rooms) */
+import { _usePermissions } from '@internal/react-components';
 import { Microphone } from '../../CallComposite/components/buttons/Microphone';
 import { Camera } from '../../CallComposite/components/buttons/Camera';
 import { ScreenShare } from '../../CallComposite/components/buttons/ScreenShare';
@@ -234,6 +236,21 @@ export const CommonCallControlBar = (props: CommonCallControlBarProps & Containe
     <></>
   );
 
+  /* @conditional-compile-remove(rooms) */
+  const rolePermissions = _usePermissions();
+
+  let screenShareButtonIsEnabled = isEnabled(options?.screenShareButton);
+  /* @conditional-compile-remove(rooms) */
+  screenShareButtonIsEnabled = rolePermissions.screenShare && screenShareButtonIsEnabled;
+
+  let microphoneButtonIsEnabled = isEnabled(options?.microphoneButton);
+  /* @conditional-compile-remove(rooms) */
+  microphoneButtonIsEnabled = rolePermissions.microphoneButton && microphoneButtonIsEnabled;
+
+  let cameraButtonIsEnabled = isEnabled(options?.cameraButton);
+  /* @conditional-compile-remove(rooms) */
+  cameraButtonIsEnabled = rolePermissions.cameraButton && cameraButtonIsEnabled;
+
   return (
     <div ref={controlBarSizeRef}>
       <CallAdapterProvider adapter={props.callAdapter}>
@@ -275,7 +292,7 @@ export const CommonCallControlBar = (props: CommonCallControlBarProps & Containe
                 */}
                 <div ref={controlBarContainerRef}>
                   <ControlBar layout="horizontal" styles={centerContainerStyles}>
-                    {isEnabled(options.microphoneButton) && (
+                    {microphoneButtonIsEnabled && (
                       <Microphone
                         displayType={options.displayType}
                         styles={commonButtonStyles}
@@ -284,7 +301,7 @@ export const CommonCallControlBar = (props: CommonCallControlBarProps & Containe
                         disabled={props.disableButtonsForHoldScreen || isDisabled(options.microphoneButton)}
                       />
                     )}
-                    {isEnabled(options.cameraButton) && (
+                    {cameraButtonIsEnabled && (
                       <Camera
                         displayType={options.displayType}
                         styles={commonButtonStyles}
@@ -296,7 +313,7 @@ export const CommonCallControlBar = (props: CommonCallControlBarProps & Containe
                       />
                     )}
                     {props.mobileView && isEnabled(options?.chatButton) && chatButton}
-                    {isEnabled(options.screenShareButton) && (
+                    {screenShareButtonIsEnabled && (
                       <ScreenShare
                         option={options.screenShareButton}
                         displayType={options.displayType}