@100mslive/roomkit-react 0.3.3-alpha.7 → 0.3.3-alpha.9

package/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx

@@ -34,8 +34,8 @@ const IconSection = styled(IconButton, {
   },
   '@md': {
     mx: 0,
-    borderTopRightRadius: '$1',
-    borderBottomRightRadius: '$1',
+    borderTopRightRadius: '$1 !important',
+    borderBottomRightRadius: '$1 !important',
   },
   variants: {
     ...variants,

package/src/Prebuilt/components/MoreSettings/SplitComponents/DesktopOptions.tsx

@@ -29,6 +29,7 @@ import { FullScreenItem } from '../FullScreenItem';
 import { MuteAllModal } from '../MuteAllModal';
 // @ts-ignore: No implicit any
 import { useDropdownList } from '../../hooks/useDropdownList';
+// @ts-ignore: No implicit any
 import { useMyMetadata } from '../../hooks/useMetadata';
 // @ts-ignore: No implicit any
 import { APP_DATA, isMacOS } from '../../../common/constants';

package/src/Prebuilt/components/MoreSettings/SplitComponents/MwebOptions.tsx

@@ -6,6 +6,7 @@ import {
   selectIsConnectedToRoom,
   selectPeerCount,
   selectPermissions,
+  useAVToggle,
   useHMSActions,
   useHMSStore,
   useRecordingStreaming,
@@ -50,6 +51,7 @@ import { usePollViewToggle, useSidepaneToggle } from '../../AppData/useSidepane'
 import { useShowPolls } from '../../AppData/useUISettings';
 // @ts-ignore: No implicit any
 import { useDropdownList } from '../../hooks/useDropdownList';
+// @ts-ignore: No implicit any
 import { useMyMetadata } from '../../hooks/useMetadata';
 import { useUnreadPollQuizPresent } from '../../hooks/useUnreadPollQuizPresent';
 import { useLandscapeHLSStream, useMobileHLSStream } from '../../../common/hooks';
@@ -93,6 +95,8 @@ export const MwebOptions = ({
   const peerCount = useHMSStore(selectPeerCount);
   const emojiCardRef = useRef(null);
   const { isBRBOn, toggleBRB, isHandRaised, toggleHandRaise } = useMyMetadata();
+  const { toggleAudio, toggleVideo } = useAVToggle();
+  const noAVPermissions = !(toggleAudio || toggleVideo);
   const { unreadPollQuiz, setUnreadPollQuiz } = useUnreadPollQuizPresent();
   const { title, description } = useRoomLayoutHeader();
   const toggleDetailsSheet = useSheetToggle(SHEET_OPTIONS.ROOM_DETAILS);
@@ -171,7 +175,7 @@ export const MwebOptions = ({
               </ActionTile.Root>
             )}
 
-            {elements.hand_raise ? (
+            {!noAVPermissions ? (
               <ActionTile.Root
                 active={isHandRaised}
                 onClick={() => {

package/src/Prebuilt/components/PreviousRoleInMetadata.tsx

@@ -1,5 +1,6 @@
 import { useEffect } from 'react';
 import { selectLocalPeerRoleName, useHMSVanillaStore } from '@100mslive/react-sdk';
+// @ts-ignore: No implicit Any
 import { useMyMetadata } from './hooks/useMetadata';
 
 export const PreviousRoleInMetadata = () => {

package/src/Prebuilt/components/RaiseHand.tsx

@@ -4,17 +4,11 @@ import { CSS } from '../../Theme';
 import { Tooltip } from '../../Tooltip';
 // @ts-ignore: No implicit Any
 import IconButton from '../IconButton';
-import { useRoomLayoutConferencingScreen } from '../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';
+// @ts-ignore: No implicit Any
 import { useMyMetadata } from './hooks/useMetadata';
 
 export const RaiseHand = ({ css }: { css?: CSS }) => {
   const { isHandRaised, toggleHandRaise } = useMyMetadata();
-  const { elements } = useRoomLayoutConferencingScreen();
-
-  if (!elements.hand_raise) {
-    return null;
-  }
-
   return (
     <Tooltip title={isHandRaised ? 'Lower hand' : 'Raise hand'}>
       <IconButton

package/src/Prebuilt/components/RoleChangeRequest/RoleChangeRequestModal.tsx

@@ -13,6 +13,7 @@ import { Flex, Text } from '../../..';
 import { PreviewControls, PreviewTile } from '../Preview/PreviewJoin';
 import { RequestPrompt } from './RequestPrompt';
 import { useRoomLayoutPreviewScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen';
+// @ts-ignore: No implicit Any
 import { useMyMetadata } from '../hooks/useMetadata';
 // @ts-ignore: No implicit Any
 import { ROLE_CHANGE_DECLINED } from '../../common/constants';

package/src/Prebuilt/components/hooks/{useMetadata.tsx → useMetadata.jsx}

@@ -15,7 +15,7 @@ export const useMyMetadata = () => {
   const metaData = useHMSStore(selectPeerMetadata(localPeerId));
   const isHandRaised = useHMSStore(selectHasPeerHandRaised(localPeerId));
 
-  const update = async (updatedFields: Record<string, any>) => {
+  const update = async updatedFields => {
     try {
       // get current state from store and merge updated fields
       const currentMetadata = vanillaStore.getState(selectPeerMetadata(localPeerId));
@@ -24,7 +24,6 @@ export const useMyMetadata = () => {
     } catch (error) {
       console.error('failed to update metadata ', updatedFields);
     }
-    return false;
   };
 
   const toggleHandRaise = useCallback(async () => {
@@ -44,6 +43,12 @@ export const useMyMetadata = () => {
     }
   }, [metaData?.isBRBOn]); //eslint-disable-line
 
+  const setPrevRole = async role => {
+    await update({
+      prevRole: role,
+    });
+  };
+
   return {
     isHandRaised,
     isBRBOn: !!metaData?.isBRBOn,
@@ -51,5 +56,6 @@ export const useMyMetadata = () => {
     updateMetaData: update,
     toggleHandRaise,
     toggleBRB,
+    setPrevRole,
   };
 };

package/dist/Prebuilt/components/hooks/useMetadata.d.ts

@@ -1,8 +0,0 @@
-export declare const useMyMetadata: () => {
-    isHandRaised: boolean;
-    isBRBOn: boolean;
-    metaData: any;
-    updateMetaData: (updatedFields: Record<string, any>) => Promise<boolean>;
-    toggleHandRaise: () => Promise<void>;
-    toggleBRB: () => Promise<void>;
-};