Global-sales/src/views/mobile/Chat.jsx

import { Layout } from 'antd';
import MessagesHeader from '@/views/Conversations/Components/MessagesHeader';
import MessagesWrapper from '@/views/Conversations/Components/MessagesWrapper';
import InputComposer from '@/views/Conversations/Components/InputComposer';

const { Content, Header, Footer } = Layout;

function Chat() {
  return (
    <>
      <Layout className='h-full chatwindow-wrapper mobilechat-wrapper' style={{ maxHeight: 'calc(100vh - 84px)', height: 'calc(100vh - 84px)', minWidth: '360px' }}>
        <Header className='ant-layout-sider-light ant-card h-auto flex justify-between gap-1 items-center'>
          <MessagesHeader />
        </Header>
        <Content className='flex-grow bg-whatsapp-bg relative'>
          <MessagesWrapper />
        </Content>
        <Footer className='ant-layout-sider-light p-0'>
          <InputComposer mobile />
        </Footer>
      </Layout>
    </>
  );
}

export default Chat;