fix: overlay chat repostion on tapping

100mslive · Sep 12, 2023 · 7702269 · 7702269
1 parent f4385a0
commit 7702269
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/packages/roomkit-react/src/Prebuilt/components/Chat/Chat.jsx b/packages/roomkit-react/src/Prebuilt/components/Chat/Chat.jsx
@@ -66,7 +66,7 @@ const PinnedMessage = ({ clearPinnedMessage }) => {
   ) : null;
 };
 
-export const Chat = ({ screenType, hideControls = false }) => {
+export const Chat = ({ screenType }) => {
   const notification = useHMSNotifications(HMSNotificationTypes.PEER_LEFT);
   const [peerSelector, setPeerSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.PEER_ID);
   const [roleSelector, setRoleSelector] = useSetSubscribedChatSelector(CHAT_SELECTOR.ROLE);
@@ -122,8 +122,6 @@ export const Chat = ({ screenType, hideControls = false }) => {
       css={{
         size: '100%',
         gap: '$4',
-        marginTop: hideControls && elements?.chat?.is_overlay ? '$17' : '0',
-        transition: 'margin 0.3s ease-in-out',
       }}
     >
       {isMobile && elements?.chat?.is_overlay ? null : (

diff --git a/packages/roomkit-react/src/Prebuilt/components/SidePaneTabs.tsx b/packages/roomkit-react/src/Prebuilt/components/SidePaneTabs.tsx
@@ -62,10 +62,12 @@ export const SidePaneTabs = React.memo<{
       css={{
         color: '$on_primary_high',
         h: '100%',
+        marginTop: hideControls && isOverlayChat ? '$17' : '0',
+        transition: 'margin 0.3s ease-in-out',
       }}
     >
       {isOverlayChat && isChatOpen && showChat ? (
-        <Chat screenType={screenType} hideControls={hideControls} />
+        <Chat screenType={screenType} />
       ) : (
         <>
           {hideTabs ? (
@@ -74,7 +76,7 @@ export const SidePaneTabs = React.memo<{
                 {showChat ? 'Chat' : `Participants (${peerCount})`}
               </Text>
 
-              {showChat ? <Chat screenType={screenType} hideControls={hideControls} /> : <ParticipantList />}
+              {showChat ? <Chat screenType={screenType} /> : <ParticipantList />}
             </>
           ) : (
             <Tabs.Root
@@ -111,7 +113,7 @@ export const SidePaneTabs = React.memo<{
                 <ParticipantList />
               </Tabs.Content>
               <Tabs.Content value={SIDE_PANE_OPTIONS.CHAT} css={{ p: 0 }}>
-                <Chat screenType={screenType} hideControls={hideControls} />
+                <Chat screenType={screenType} />
               </Tabs.Content>
             </Tabs.Root>
           )}