@messenger-box/platform-browser 10.0.3-alpha.7 → 10.0.3-alpha.74

package/lib/components/InboxMessage/Popover/index.js

@@ -1,4 +1,4 @@
-import React__default from'react';import {useTranslation}from'react-i18next';import {Box,Button}from'@chakra-ui/react';import {css}from'@emotion/css';import {styleSheet}from'./style.js';function Popover({
+import React__default from'react';import {useTranslation}from'react-i18next';function Popover({
   toggleDrawer
 }) {
   const {
@@ -14,38 +14,11 @@ import React__default from'react';import {useTranslation}from'react-i18next';imp
     total: '0'
   }];
   return React__default.createElement("div", {
-    className: css(styleSheet.customPopoverStyles(toggleDrawer))
-  }, content?.map((item, index) => {
-    if (!item.total) {
-      return React__default.createElement(Box, {
-        _hover: {
-          bg: '#edecec'
-        },
-        className: "popover-style",
-        key: index
-      }, React__default.createElement(Button, {
-        border: "none",
-        fontSize: "15px",
-        color: "#282121",
-        variant: "link",
-        bg: "none",
-        height: "30px"
-      }, item.name));
-    } else {
-      return React__default.createElement(Box, {
-        _hover: {
-          bg: '#edecec'
-        },
-        className: "popover-style",
-        key: index
-      }, React__default.createElement(Button, {
-        border: "none",
-        fontSize: "15px",
-        color: "#282121",
-        variant: "link",
-        bg: "none",
-        height: "30px"
-      }, item.name + `(${item.total})`));
-    }
-  }));
+    className: `absolute z-50 bg-white shadow-lg rounded-md py-2 ${toggleDrawer ? 'right-0' : 'left-0'}`
+  }, content?.map((item, index) => React__default.createElement("div", {
+    key: index,
+    className: "hover:bg-gray-100 px-4 py-1"
+  }, React__default.createElement("button", {
+    className: "text-[15px] text-[#282121] h-[30px] w-full text-left focus:outline-none"
+  }, item.total ? `${item.name} (${item.total})` : item.name))));
 }export{Popover as default};//# sourceMappingURL=index.js.map

package/lib/components/InboxMessage/Popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/Popover/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"0LAMc,SAAU,OAAO,CAAC;AAC5B,EAAA;AAEA,CAAA,EAAA;AACI,EAAA,MAAA;AACI,IAAA;AACH,GAAA,GAAA,cAAA,EAAA;AACD,EAAA,MAAA,OAAA,GAAA,CAAA;AACI,IAAA,IAAA,EAAA,CAAA,CAAA,yCAAQ;AACR,GAAA,EAAA;AACH,IAAA,IAAA,EAAA,CAAA,CAAA,8CAAA,CAAA;AACD,IAAA,KAAA,EAAA;AACI,GAAA,EAAA;AACA,IAAA,IAAA,EAAA,CAAA,CAAA,4CAAU,CAAA;AACb,IAAA,KAAA,EAAA;;SAEEA;AAGK,IAAA,SAAK,EAAA,GAAK,CAAA,UAAQ,CAAA,mBAAA,CAAA,YAAA,CAAA;AACd,GAAA,EAAA,OAAA,EAAA,GAAA,CAAA,CAAO,IACF,EAAA,KAAA,KAAA;AACG,IAAA,IAAA,CAAA,IAAA,CAAA,KAAA,EAAA;aAYXA,cAAA,CAAA,aAAA,CAAA,GAAA,EAAA;cAAO,EAAA;AACJ,UAAA,EAAA,EAAA;AAEQ,SAAA;QAYZ,SAAC,EAAA,eAAA;QAGZ,GAAC,EAAA;AACN,OAAC,EAAAA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/Popover/index.tsx"],"sourcesContent":[null],"names":["React"],"mappings":"6EAOc,SAAU,OAAO,CAAC;AAC5B,EAAA;AAEA,CAAA,EAAA;AACI,EAAA,MAAA;AACI,IAAA;AACH,GAAA,GAAA,cAAA,EAAA;AACD,EAAA,MAAA,OAAA,GAAA,CAAA;AACI,IAAA,IAAA,EAAA,CAAA,CAAA,yCAAQ;AACR,GAAA,EAAA;AACH,IAAA,IAAA,EAAA,CAAA,CAAA,8CAAA,CAAA;AACD,IAAA,KAAA,EAAA;AACI,GAAA,EAAA;AACA,IAAA,IAAA,EAAA,CAAA,CAAA,4CAAU,CAAA;AACb,IAAA,KAAA,EAAA;;AAGL,EAAA,OAAAA,cACI,CAAA,aAAA,CAAA,KAAA,EAAA;AAGY,IAAA,SAAA,EAAA,CAAA,iDAA2F,EAAA,YAAA,GAAA,SAAA,GAAA,QAAA,CAAA;AAO/G,GAAC,EAAA,OAAA,EAAA,GAAA,CAAA,CAAA,IAAA,EAAA,KAAA,KAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;;;;;;"}

package/lib/components/InboxMessage/UserModalContent/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/InboxMessage/UserModalContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,GAAG,qBAqDnE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/InboxMessage/UserModalContent/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,GAAG,qBAqDnE"}

package/lib/components/InboxMessage/UserModalContent/index.js

@@ -1,4 +1,4 @@
-import*as React from'react';import {useTranslation}from'react-i18next';import {AiOutlineSecurityScan}from'react-icons/ai.js';import {FiCheck}from'react-icons/fi.js';import {BsFillStarFill}from'react-icons/bs.js';import {Avatar,Text,Button}from'@chakra-ui/react';import {css}from'@emotion/css';import {styleSheet}from'./style.js';function UserModalContent({
+import*as React from'react';import {useTranslation}from'react-i18next';import {AiOutlineSecurityScan}from'@react-icons/all-files/ai/AiOutlineSecurityScan.js';import {FiCheck}from'@react-icons/all-files/fi/FiCheck.js';import {BsFillStarFill}from'@react-icons/all-files/bs/BsFillStarFill.js';function UserModalContent({
   username,
   imageUrl
 }) {
@@ -6,60 +6,63 @@ import*as React from'react';import {useTranslation}from'react-i18next';import {A
     t
   } = useTranslation();
   return React.createElement("div", {
-    className: css(styleSheet.UserContentStyles)
+    className: "p-6"
   }, React.createElement("div", {
-    className: "user-info"
+    className: "flex flex-col items-center mb-8"
   }, React.createElement("div", {
-    className: "avatar"
-  }, React.createElement(Avatar, {
-    size: "large",
-    src: imageUrl !== '' ? imageUrl : '',
-    backgroundColor: "grey",
-    width: "200px",
-    height: "200px",
-    borderRadius: "50%",
-    marginBottom: "10px"
+    className: "flex flex-col items-center mb-6"
+  }, React.createElement("img", {
+    className: "w-48 h-48 rounded-full mb-2 bg-gray-300",
+    src: imageUrl || '',
+    alt: username
   }), React.createElement("a", {
-    href: "#"
-  }, t('messenger_box_browser.update_photo'))), React.createElement(AiOutlineSecurityScan, {
-    style: {
-      width: '24px',
-      height: '24px',
-      color: 'black'
-    }
+    href: "#",
+    className: "text-blue-600 hover:text-blue-800"
+  }, t('messenger_box_browser.update_photo'))), React.createElement("div", {
+    className: "flex items-center mb-6"
+  }, React.createElement(AiOutlineSecurityScan, {
+    className: "w-6 h-6 text-black mr-3"
   }), React.createElement("div", {
-    className: "identify"
-  }, React.createElement("h3", null, t('messenger_box_browser.identity_verification')), React.createElement(Text, {
-    as: "p",
-    color: "black"
-  }, t('messenger_box_browser.show_others_you_are_really_you')), React.createElement(Button, {
-    className: "get-badge-btn",
-    color: "black",
-    bg: "transparent"
-  }, t('messenger_box_browser.get_the_badge'))), React.createElement("div", {
-    className: "user-conformation"
-  }, React.createElement("h3", null, t('messenger_box_browser.username_confirmed', {
-    username: username
+    className: "flex flex-col"
+  }, React.createElement("h3", {
+    className: "text-lg font-semibold mb-2"
+  }, t('messenger_box_browser.identity_verification')), React.createElement("p", {
+    className: "text-black mb-3"
+  }, t('messenger_box_browser.show_others_you_are_really_you')), React.createElement("button", {
+    className: "text-black border border-black px-4 py-2 rounded hover:bg-gray-100"
+  }, t('messenger_box_browser.get_the_badge')))), React.createElement("div", {
+    className: "w-full"
+  }, React.createElement("h3", {
+    className: "text-lg font-semibold mb-3"
+  }, t('messenger_box_browser.username_confirmed', {
+    username
   })), React.createElement("div", {
-    className: "email-address"
+    className: "flex items-center"
   }, React.createElement(FiCheck, {
-    color: "black"
-  }), React.createElement(Text, {
-    as: "p",
-    color: "black"
+    className: "text-black mr-2"
+  }), React.createElement("p", {
+    className: "text-black"
   }, t('messenger_box_browser.email_address'))))), React.createElement("div", {
-    className: "user-details"
+    className: "border-t pt-6"
   }, React.createElement("div", {
-    className: "user"
-  }, React.createElement("h2", null, t('messenger_box_browser.hi_username', {
-    username: username
-  })), React.createElement(Text, {
-    as: "p"
+    className: "mb-6"
+  }, React.createElement("h2", {
+    className: "text-2xl font-bold mb-2"
+  }, t('messenger_box_browser.hi_username', {
+    username
+  })), React.createElement("p", {
+    className: "text-gray-600 mb-2"
   }, t('messenger_box_browser.joined_in_date', {
     date: '2021'
-  })), React.createElement("a", null, t('messenger_box_browser.edit_profile')), React.createElement("h3", null, React.createElement(BsFillStarFill, {
-    color: "black"
-  }), t('messenger_box_browser.reviews'))), React.createElement("div", {
-    className: "reviews"
-  }, React.createElement("a", null, t('messenger_box_browser.reviews_by_you')))));
+  })), React.createElement("a", {
+    href: "#",
+    className: "text-blue-600 hover:text-blue-800 block mb-4"
+  }, t('messenger_box_browser.edit_profile')), React.createElement("h3", {
+    className: "flex items-center text-lg font-semibold"
+  }, React.createElement(BsFillStarFill, {
+    className: "text-black mr-2"
+  }), t('messenger_box_browser.reviews'))), React.createElement("div", null, React.createElement("a", {
+    href: "#",
+    className: "text-blue-600 hover:text-blue-800"
+  }, t('messenger_box_browser.reviews_by_you')))));
 }export{UserModalContent as default};//# sourceMappingURL=index.js.map

package/lib/components/InboxMessage/UserModalContent/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/UserModalContent/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"yUASwB,SAAA,gBAAgB,CAAC;AACrC,EAAA,QAAM;;;;AAKU,IAAA;oBASG,EAAA;AAEP,EAAA,OAAA,KAAA,CAAA,aAAA,CAAA;aACK,EAAA,GAAA,CAAA,UAAA,CAAA,iBAAA;AACD,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACA,IAAA,SAAA,EAAA;AAGA,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;aAIC,EAAA;wBACI,CAAA,MAAA,EAAA;iBACA;AACD,IAAA,GAAA,EAAA,QAAA,KAAA,EAAA,GAAA,QAAA,GAAA,EAAC;AACD,IAAA,eAAA,EAAA,MAAA;SAMP,EAAA,OAAA;YACD,OAAK;gBACD,EAAK,KAAA;AACL,IAAA,YAAA,EAAA;AACA,GAAA,CAAA,EAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA;AACA,IAAA,IAAA,EAAA;AACI,GAAA,EAAA,CAAA,CAAA,oCAAe,CAAA,CAAA,CAAA,EAAA,KAAA,CAAA,mCAAiB,EAAA;AAC/B,IAAA,KAAA,EAAA;aAGJ,MAAA;oBACG;AAKxB,MAAC,KAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/InboxMessage/UserModalContent/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"kSAMwB,SAAA,gBAAgB,CAAC;AACrC,EAAA,QAAM;AACN,EAAA;;;AAIgB,IAAA;AACA,GAAA,GAAA,cAAA,EAAA;cAIC,CAAA,aAAA,CAAA,KAAA,EAAA;AACD,IAAA,SAAA,EAAA;wBACK,CAAA,KAAA,EAAA;;wBAIE,CAAA,KAAA,EAAA;;wBAMN,CAAA,KAAA,EAAA;AACD,IAAA,SAAA,EAAA,yCAA0C;iBAGrC,IAAA,EAAA;AACD,IAAA,GAAA,EAAA;yBACG,CAAA,GAAA,EAAA;QAIf,EAAK,GAAA;aACI,EAAA;AACD,GAAA,EAAA,CAAA,CAAA,oCAAA,CAAI,CAAS,CAAA,EAAA,KAAA,CAAA,aAA0B,CAAA,KAAA,EAAA;AACvC,IAAA,SAAA,EAAA;AACA,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,qBAAO,EAAA;;AAIH,GAAA,CAAA,EAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACC,IAAA,SAAA,EAAA;AAGT,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AACI,IAAA,SAAA,EAAA;AAOpB,GAAC,EAAA,CAAA,CAAA,6CAAA,CAAA,CAAA,EAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/InboxMessage/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InboxMessage/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuBnD,MAAM,CAAC,OAAO,UAAU,YAAY,sBAyQnC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InboxMessage/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAoBnD,MAAM,CAAC,OAAO,UAAU,YAAY,sBA6PnC"}

package/lib/components/InboxMessage/index.js

@@ -1,4 +1,4 @@
-import React__default,{useState,useEffect}from'react';import {useSelector}from'react-redux';import {Modal}from'react-bootstrap';import Select from'react-select';import {useTranslation}from'react-i18next';import {VscChromeClose}from'react-icons/vsc.js';import {AiOutlineMenu}from'react-icons/ai.js';import {indexOf}from'lodash-es';import {Avatar,Text,Button}from'@chakra-ui/react';import {css}from'@emotion/css';import {useGetMessagesQuery,useGetChannelsByUserQuery,useGetAllChannelQuery,useGetAllUsersQuery,useAddDirectChannelMutation}from'common/lib/generated/generated.js';import Messages from'./Messages/index.js';import Popover from'./Popover/index.js';import InboxDetails from'./InboxDetails/index.js';import InboxSidebar from'./InboxSidebar/index.js';import {stylesheet}from'./style.js';function InboxMessage() {
+import React__default,{useState,useEffect}from'react';import {useSelector}from'react-redux';import {Modal}from'react-bootstrap';import Select from'react-select';import {useTranslation}from'react-i18next';import {VscChromeClose}from'@react-icons/all-files/vsc/VscChromeClose.js';import {AiOutlineMenu}from'@react-icons/all-files/ai/AiOutlineMenu.js';import {indexOf}from'lodash-es';import {useGetMessagesQuery,useGetChannelsByUserQuery,useGetAllChannelQuery,useGetAllUsersQuery,useAddDirectChannelMutation}from'common/graphql';import Messages from'./Messages/index.js';import Popover from'./Popover/index.js';import InboxDetails from'./InboxDetails/index.js';import InboxSidebar from'./InboxSidebar/index.js';function InboxMessage() {
   const [id, setId] = useState();
   const [showMessageSide, setShowMessageSide] = useState(false);
   const [showPopover, setShowPopover] = useState(false);
@@ -53,8 +53,6 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
       setChannel([...channelData?.data.channelsByUser.filter(chl => chl.type === 'DIRECT' && chl?.displayName !== 'admin (you)' && chl?.displayName !== 'surveybot'), ...fChannel.filter(chl => chl.type === 'DIRECT')]);
     }
   }, [loading, channelData, currentUserId]);
-  // console.log(allChannels)
-  console.log(channel);
   const handleSelectMessgae = item => {
     setShowMessageSide(true);
     setId(item?.id);
@@ -77,16 +75,11 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
               uid: `${i.id}`
             },
             label: React__default.createElement("div", {
-              style: {
-                cursor: 'pointer'
-              }
-            }, React__default.createElement(Avatar, {
-              width: "40px",
-              backgroundColor: "grey",
-              size: "42",
-              borderRadius: "50%"
-            }), React__default.createElement(Text, {
-              color: "black"
+              className: "flex items-center cursor-pointer"
+            }, React__default.createElement("div", {
+              className: "w-10 h-10 bg-gray-400 rounded-full"
+            }), React__default.createElement("span", {
+              className: "ml-2 text-black"
             }, i.username))
           });
         } else {
@@ -97,7 +90,6 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
       });
     }
   }, [usersRes.loading, usersRes.data]);
-  console.log(user);
   useEffect(() => {
     if (!loading) {
       setMessageList(data.messages.data);
@@ -126,7 +118,6 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
     if (selectedValues) {
       let uids = [];
       let dName = '';
-      console.log(selectedChannel?.value);
       if (selectedValues.length > 1) {
         selectedValues.forEach(i => {
           uids.push(i.value.uid);
@@ -165,31 +156,22 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
     }
   };
   return React__default.createElement("div", {
-    className: css(stylesheet.inboxStyles)
+    className: "flex w-full h-[75vh] bg-white"
   }, React__default.createElement("div", {
-    className: toggleDrawer ? 'inbox-sidebar-active' : 'inbox-sidebar'
+    className: `${toggleDrawer ? 'w-1/5' : 'w-1/4'} h-full flex flex-col justify-between border-r border-gray-200`
   }, React__default.createElement("div", {
-    className: "conversations"
+    className: "w-full"
   }, React__default.createElement("div", {
-    className: "header-section"
+    className: "mb-5 pb-2 border-b border-gray-200 h-14"
   }, React__default.createElement("div", {
-    className: "allmessage-header"
-  }, React__default.createElement("h3", null, t('messenger_box_browser.messages')), React__default.createElement(Button, {
-    as: "a",
-    borderRadius: "50%",
-    width: "30px",
-    height: "30px",
-    _hover: {
-      backgroundColor: 'rgb(221, 221, 221)'
-    },
-    onClick: () => {
-      setShowPopover(!showPopover);
-    }
+    className: "flex items-center justify-between p-2.5"
+  }, React__default.createElement("h3", {
+    className: "ml-4 mt-4 text-black font-bold text-base"
+  }, t('messenger_box_browser.messages')), React__default.createElement("button", {
+    onClick: () => setShowPopover(!showPopover),
+    className: "w-7 h-7 rounded-full hover:bg-gray-200 flex items-center justify-center"
   }, React__default.createElement(AiOutlineMenu, {
-    style: {
-      fontSize: '20px',
-      color: 'black'
-    }
+    className: "text-xl text-black"
   })), showPopover ? React__default.createElement(Popover, {
     toggleDrawer: toggleDrawer
   }) : '')), React__default.createElement(InboxSidebar, {
@@ -200,34 +182,25 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
     messageList: messageList,
     users: user
   })), React__default.createElement("div", {
-    className: "add-conversations"
+    className: "p-5 w-full border-t border-gray-200"
   }, React__default.createElement(Modal, {
     show: showModal,
     onHide: handleClose
   }, React__default.createElement(Modal.Header, {
-    style: {
-      backgroundColor: '#2b5ebf',
-      color: 'white',
-      display: 'flex',
-      alignItems: 'center'
-    }
+    className: "bg-[#2b5ebf] text-white flex items-center"
   }, React__default.createElement(Modal.Title, null, t('messenger_box_browser.add_conversations')), React__default.createElement(VscChromeClose, {
     onClick: () => handleClose(),
-    fontSize: "16px",
-    style: {
-      marginLeft: 'auto',
-      cursor: 'pointer'
-    }
+    className: "ml-auto text-base cursor-pointer"
   })), React__default.createElement(Modal.Body, null, React__default.createElement("div", {
-    className: css(stylesheet.modelStyle)
+    className: "flex flex-col h-[calc(90vh-120px)] w-full overflow-x-hidden p-0 py-4 max-h-[calc(90vh-80px)] overflow-auto"
   }, React__default.createElement("div", {
-    className: "root_modal"
+    className: "flex flex-col h-[calc(90vh-120px)] w-full"
   }, React__default.createElement("div", {
-    className: "root_first"
+    className: "my-1.5 w-full"
   }, React__default.createElement("div", {
-    className: "search_box"
+    className: "flex"
   }, React__default.createElement(Select, {
-    className: "temp",
+    className: "w-full",
     value: selectedValues?.value,
     onChange: handleSelect,
     components: {
@@ -239,31 +212,26 @@ import React__default,{useState,useEffect}from'react';import {useSelector}from'r
     isMulti: true,
     menuIsOpen: true
   }), React__default.createElement("button", {
-    onClick: handleGo
+    onClick: handleGo,
+    className: "max-w-[70px] w-full ml-4 bg-[#166de0] text-white border-none"
   }, "Go")), React__default.createElement("div", {
-    className: "mid_line"
-  }, React__default.createElement("p", null, t('messenger_box_browser.use_browse_or_select'), React__default.createElement("span", null, " ")))))))), React__default.createElement(Button, {
-    size: "large",
-    className: "conversation-btn",
-    backgroundColor: "#1890ff",
-    height: "40px",
-    borderRadius: "3px",
-    border: "none",
-    color: "white",
-    variant: "outline",
-    fontSize: "20px",
-    onClick: () => setShowModal(true)
+    className: "mt-2.5"
+  }, React__default.createElement("p", {
+    className: "text-[#3d3c40] opacity-60 text-sm"
+  }, t('messenger_box_browser.use_browse_or_select'), React__default.createElement("span", null, " ")))))))), React__default.createElement("button", {
+    onClick: () => setShowModal(true),
+    className: "w-full h-10 bg-[#1890ff] rounded px-4 py-2 text-white text-lg hover:bg-[#40a9ff] transition-colors"
   }, t('messenger_box_browser.add_conversations')))), React__default.createElement("div", {
-    className: `msg-container${toggleDrawer ? '-active' : ''}`
+    className: `${toggleDrawer ? 'w-3/5' : 'w-4/5'}`
   }, React__default.createElement("div", {
-    className: "border"
-  }), showMessageSide == true ? React__default.createElement(Messages, {
+    className: "h-14 w-full border-b border-gray-200"
+  }), showMessageSide && React__default.createElement(Messages, {
     id: id,
     user: user,
     userId: userId,
     currentUser: currentUser
-  }) : ''), React__default.createElement("div", {
-    className: toggleDrawer ? 'inbox-details' : 'inbox-details-active'
+  })), React__default.createElement("div", {
+    className: `${toggleDrawer ? 'w-1/5 border-l border-gray-200 transition-all duration-500' : 'w-0 opacity-0 overflow-hidden transition-all duration-500'}`
   }, React__default.createElement(InboxDetails, {
     handleToggle: handleToggle,
     toggleDrawer: toggleDrawer

package/lib/components/InboxMessage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/InboxMessage/index.tsx"],"sourcesContent":[null],"names":["React","PopoverComponent"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/InboxMessage/index.tsx"],"sourcesContent":[null],"names":["React","PopoverComponent"],"mappings":"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"}

package/lib/components/dashboard/menu_header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu_header.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/menu_header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,eAAO,MAAM,UAAU;;;uBAsDtB,CAAC"}
+{"version":3,"file":"menu_header.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/menu_header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,eAAO,MAAM,UAAU;;;uBA+DtB,CAAC"}

package/lib/components/dashboard/menu_header.js

@@ -1,4 +1,4 @@
-import*as React from'react';import {useTranslation}from'react-i18next';import {styleSheet}from'../../style.js';import {css}from'@emotion/css';import {FiSearch}from'react-icons/fi.js';import {VscMenu}from'react-icons/vsc.js';const MenuHeader = ({
+import*as React from'react';import {useTranslation}from'react-i18next';import {FiSearch}from'@react-icons/all-files/fi/FiSearch.js';import {VscMenu}from'@react-icons/all-files/vsc/VscMenu.js';const MenuHeader = ({
   clickedChannel,
   handleClass
 }) => {
@@ -6,39 +6,53 @@ import*as React from'react';import {useTranslation}from'react-i18next';import {s
     t
   } = useTranslation();
   return React.createElement("div", {
-    className: css(styleSheet.customStyle)
+    className: "w-full bg-white border-b border-gray-200"
   }, React.createElement("div", {
-    className: "navbar_header"
+    className: "flex items-center justify-between h-16 px-4"
+  }, React.createElement("div", {
+    className: "flex items-center"
   }, React.createElement("button", {
     type: "button",
-    className: "navbar_toggle",
+    className: "p-2 text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500",
     onClick: handleClass
   }, React.createElement("span", {
     className: "sr-only"
-  }, React.createElement("span", null, t('messenger_box_browser.toggle_sidebar'))), React.createElement("span", {
-    className: "style--none icon icon__menu icon--sidebarHeaderTextColor"
-  }, React.createElement(VscMenu, null))), React.createElement("div", {
-    className: "navbar_brand"
+  }, t('messenger_box_browser.toggle_sidebar')), React.createElement(VscMenu, {
+    className: "w-6 h-6"
+  })), React.createElement("div", {
+    className: "ml-4"
+  }, clickedChannel.id && React.createElement("div", {
+    className: "flex items-center space-x-2"
   }, React.createElement("div", {
-    className: "menu_wrapper "
-  }, clickedChannel.id ? React.createElement("a", null, React.createElement("span", {
-    className: "heading"
-  }, React.createElement("span", {
-    className: "status "
-  }), React.createElement("span", null, clickedChannel.type === 'DIRECT' ? clickedChannel.displayName : clickedChannel.title)), React.createElement("span", {
-    className: "fa fa-angle-down header-dropdown__icon",
-    title: "Dropdown Icon"
-  })) : '')), React.createElement("button", {
+    className: "flex items-center hover:text-gray-900 cursor-pointer"
+  }, React.createElement("div", {
+    className: "w-2 h-2 bg-green-500 rounded-full mr-2"
+  }), " ", React.createElement("span", {
+    className: "font-medium"
+  }, clickedChannel.type === 'DIRECT' ? clickedChannel.displayName : clickedChannel.title), React.createElement("svg", {
+    className: "w-4 h-4 ml-1",
+    fill: "none",
+    stroke: "currentColor",
+    viewBox: "0 0 24 24"
+  }, React.createElement("path", {
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 2,
+    d: "M19 9l-7 7-7-7"
+  })))))), React.createElement("div", {
+    className: "flex items-center space-x-2"
+  }, React.createElement("button", {
     type: "button",
-    className: "navbar-toggle navbar-right__icon navbar-search pull-right",
+    className: "p-2 text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500",
     "aria-label": "Search"
-  }, React.createElement("span", {
-    className: "icon icon__search",
-    "aria-hidden": "true"
-  }, React.createElement(FiSearch, null))), React.createElement("button", {
+  }, React.createElement(FiSearch, {
+    className: "w-5 h-5"
+  })), React.createElement("button", {
     type: "button",
-    className: "navbar-toggle navbar-right__icon menu-toggle pull-right",
+    className: "p-2 text-gray-600 hover:text-gray-900 hover:bg-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500",
     "data-toggle": "collapse",
     "data-target": "#sidebar-nav"
-  }, React.createElement("span", null, React.createElement(VscMenu, null)))));
+  }, React.createElement(VscMenu, {
+    className: "w-5 h-5"
+  })))));
 };export{MenuHeader};//# sourceMappingURL=menu_header.js.map

package/lib/components/dashboard/menu_header.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu_header.js","sources":["../../../src/components/dashboard/menu_header.tsx"],"sourcesContent":[null],"names":[],"mappings":"gOAOa,MAAA,UAAU,GAAG,CAAC;AACvB,EAAA,cAAc;;;;;AAMM,GAAA,GAAA,cAAA,EAAA;4BAEE,CAAA,KAAA,EAAA;6BACD,CAAA,WAAA;wBAGJ,CAAA,KAAA,EAAA;;wBAIiB,CAAA,QAAA,EAAA;;AAEF,IAAA,SAAA,EAAA,eAAA;;AAGQ,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,MAAE,EAAA;AAGd,IAAA,SAAA,EAAA;wBAQZ,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,CAAA,sCACU,CAAA,CAAA,CAAA,EAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAGV,IAAA,SAAA,EAAA;wBACK,CAAA,OAAA,EAAA,IAAA,CAAA,CAAA,CAAA,EAAA,KAAQ,CAAG,aAEX,CAAA,KAAA,EAAA;aAEL,EAAA;AAKA,GAAA,EAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACI,IAAA,SAAA,EAAA;AAMxB,GAAE,EAAA,cAAA,CAAA,EAAA,GAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,IAAA,EAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"menu_header.js","sources":["../../../src/components/dashboard/menu_header.tsx"],"sourcesContent":[null],"names":[],"mappings":"gMAKa,MAAA,UAAU,GAAG,CAAC;AACvB,EAAA,cAAc;AACd,EAAA;;;;oBAUoB,EAAM;AACN,EAAA,OAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAIJ,IAAA,SAAA,EAAA;wBAGiB,CAAA,KAAA,EAAA;;;;iCAIuB,EAAA;AAChB,IAAA,IAAA,EAAA,QAAA;AAER,IAAA,SAAA,EAAA,8IAAmF;;wBAelG,CAAA,MAAA,EAAA;;AAMG,GAAA,EAAA,CAAA,CAAA,0CAAU,KAAA,CAAA,aAAU,CAAA,OACf,EAAA;;0BAQJ,CAAA,KAAA,EAAA;AAMzB,IAAE,SAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/dashboard/modals/direct_modal.d.ts

@@ -1,10 +1,12 @@
-import * as React from 'react';
-export declare const DirectModal: ({ showDirectChl, handleClose, selectedValues, handleSelect, options, handleGo }: {
-    showDirectChl: any;
-    handleClose: any;
+import React from 'react';
+interface DirectModalProps {
+    show: boolean;
+    onHide: () => void;
+    options: any[];
     selectedValues: any;
-    handleSelect: any;
-    options: any;
-    handleGo: any;
-}) => React.JSX.Element;
+    handleSelect: (value: any) => void;
+    handleGo: () => void;
+}
+export declare const DirectModal: ({ show, onHide, options, selectedValues, handleSelect, handleGo }: DirectModalProps) => React.JSX.Element;
+export {};
 //# sourceMappingURL=direct_modal.d.ts.map

package/lib/components/dashboard/modals/direct_modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"direct_modal.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/modals/direct_modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,eAAO,MAAM,WAAW;;;;;;;uBA6CvB,CAAC"}
+{"version":3,"file":"direct_modal.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/modals/direct_modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,gBAAgB;IACtB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,cAAc,EAAE,GAAG,CAAC;IACpB,YAAY,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACnC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,WAAW,sEAAuE,gBAAgB,sBAwE9G,CAAC"}