chore: merge main

push-protocol · Jul 15, 2024 · 9e9736e · 9e9736e
2 parents 8c129d7 + ad05adc
commit 9e9736e
Show file tree

Hide file tree

Showing 18 changed files with 179 additions and 148 deletions.
diff --git a/packages/restapi/src/lib/chat/send.ts b/packages/restapi/src/lib/chat/send.ts
@@ -42,8 +42,9 @@ export const sendCore = async (
      * 2. Takes care of deprecated fields
      */
     const computedOptions = computeOptions(options);
-    let { messageType, messageObj, account, to, signer, pgpPrivateKey, env } =
+    const { messageType, messageObj, account, signer, pgpPrivateKey, env } =
       computedOptions;
+    let { to } = computedOptions;
     /**
      * Validate Input Options
      */

diff --git a/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx b/packages/uiweb/src/lib/components/chat/ChatPreviewSearchList/ChatPreviewSearchList.tsx
@@ -611,7 +611,7 @@ const SearchError = styled(Span)`
   align-self: center;
   padding: 12px 18px;
   text-transform: uppercase;
-  letter-spacing: 0.1em;
+  letter-spacing: normal;
   font-size: 10px;
   font-weight: 500;
 `;
diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx
@@ -57,6 +57,7 @@ export interface IChatProfileUserInfo {
 // Exported Functions
 export const ChatProfile: React.FC<IChatProfile> = ({
   chatId,
+  closeChatProfileInfoModalOnClickAway,
   groupInfoModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
   groupInfoModalPositionType = MODAL_POSITION_TYPE.GLOBAL,
   chatProfileRightHelperComponent = null,
@@ -335,6 +336,7 @@ export const ChatProfile: React.FC<IChatProfile> = ({
             <GroupInfoModal
               theme={theme}
               setModal={setModal}
+              closeModalOnClickAway={closeChatProfileInfoModalOnClickAway}
               groupInfo={initialized.groupInfo!}
               chatProfileInfo={initialized.profile}
               setGroupInfo={(mutatedGroupInfo) =>

diff --git a/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx b/packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx
@@ -221,6 +221,7 @@ type GroupSectionProps = GroupInfoModalProps & {
 type GroupInfoModalProps = {
   theme: IChatTheme;
   setModal: React.Dispatch<React.SetStateAction<boolean>>;
+  closeModalOnClickAway?: boolean;
   groupInfo: Group;
   setGroupInfo: React.Dispatch<React.SetStateAction<Group | null>>;
   chatProfileInfo?: IChatProfileUserInfo;
@@ -461,6 +462,7 @@ const GroupInformation = ({
 export const GroupInfoModal = ({
   theme,
   setModal,
+  closeModalOnClickAway,
   setGroupInfo,
   groupInfo,
   chatProfileInfo,
@@ -927,7 +929,8 @@ export const GroupInfoModal = ({
   if (chatProfileInfo) {
     return (
       <Modal
-        clickawayClose={onClose}
+        onClose={onClose}
+        closeonClickAway={closeModalOnClickAway}
         modalBackground={groupInfoModalBackground}
         modalPositionType={groupInfoModalPositionType}
       >

diff --git a/packages/uiweb/src/lib/components/chat/ChatView/ChatViewComponent.tsx b/packages/uiweb/src/lib/components/chat/ChatView/ChatViewComponent.tsx
@@ -43,6 +43,7 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (options: IC
     chatProfileRightHelperComponent = null,
     chatProfileLeftHelperComponent = null,
     welcomeComponent = null,
+    closeChatProfileInfoModalOnClickAway = false
   } = options || {};
 
   const { user } = useChatData();
@@ -109,6 +110,7 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (options: IC
             >
               <ChatProfile
                 key={chatId}
+                closeChatProfileInfoModalOnClickAway={closeChatProfileInfoModalOnClickAway}
                 chatProfileRightHelperComponent={chatProfileRightHelperComponent}
                 chatProfileLeftHelperComponent={chatProfileLeftHelperComponent}
                 chatId={initialized.derivedChatId}
@@ -170,12 +172,12 @@ export const ChatViewComponent: React.FC<IChatViewComponentProps> = (options: IC
 };
 
 //styles
-const Conatiner = styled(Section)<IThemeProps>`
+const Conatiner = styled(Section) <IThemeProps>`
   border: ${(props) => props.theme.border?.chatViewComponent};
   box-sizing: border-box;
 `;
 
-const ChatViewSection = styled(Section)<IThemeProps>`
+const ChatViewSection = styled(Section) <IThemeProps>`
   @media (${device.mobileL}) {
     margin: 0;
   }

diff --git a/packages/uiweb/src/lib/components/chat/ChatViewBubble/cards/message/MessageCard.tsx b/packages/uiweb/src/lib/components/chat/ChatViewBubble/cards/message/MessageCard.tsx
@@ -136,6 +136,7 @@ export const MessageCard = ({
         key={`${fragmentIndex}-${lineIndex}`} // Updated key to be more unique
         alignSelf="start"
         textAlign="left"
+        lineHeight="1.4em"
         fontSize={position ? `${theme.fontSize?.chatSentBubbleText}` : `${theme.fontSize?.chatReceivedBubbleText}`}
         fontWeight={
           position ? `${theme.fontWeight?.chatSentBubbleText}` : `${theme.fontWeight?.chatReceivedBubbleText}`

diff --git a/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx b/packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx
@@ -48,6 +48,7 @@ export interface GroupInputDetailsType {
 
 export const CreateGroupModal: React.FC<CreateGroupModalProps> = ({
   onClose,
+  closeModalOnClickAway = false,
   modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
   modalPositionType = MODAL_POSITION_TYPE.GLOBAL,
   onSuccess,
@@ -257,7 +258,8 @@ export const CreateGroupModal: React.FC<CreateGroupModalProps> = ({
 
   return (
     <Modal
-      clickawayClose={onClose}
+      onClose={onClose} // onClose function to close the modal
+      closeonClickAway={closeModalOnClickAway} // boolean to handle the onClick activity of the user
       modalBackground={modalBackground}
       modalPositionType={modalPositionType}
     >

diff --git a/packages/uiweb/src/lib/components/chat/UserProfile/UpdateUserProfileModal.tsx b/packages/uiweb/src/lib/components/chat/UserProfile/UpdateUserProfileModal.tsx
@@ -21,6 +21,7 @@ type UpdateUserProfileModalProps = {
   userProfile: IUser;
   setUserProfile: React.Dispatch<React.SetStateAction<IUser | undefined>>;
   setModal: React.Dispatch<React.SetStateAction<boolean>>;
+  closeUserProfileModalOnClickAway?: boolean;
   updateUserProfileModalBackground?: ModalBackgroundType;
   updateUserProfileModalPositionType?: ModalPositionType;
 };
@@ -33,6 +34,7 @@ export interface UserProfileType {
 export const UpdateUserProfileModal = ({
   theme,
   setModal,
+  closeUserProfileModalOnClickAway,
   userProfile,
   setUserProfile,
   updateUserProfileModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
@@ -161,7 +163,8 @@ export const UpdateUserProfileModal = ({
 
   return (
     <Modal
-      clickawayClose={onClose}
+      onClose={onClose}
+      closeonClickAway={closeUserProfileModalOnClickAway}
       modalBackground={updateUserProfileModalBackground}
       modalPositionType={updateUserProfileModalPositionType}
     >

diff --git a/packages/uiweb/src/lib/components/chat/UserProfile/UserProfile.tsx b/packages/uiweb/src/lib/components/chat/UserProfile/UserProfile.tsx
@@ -33,6 +33,7 @@ export const UserProfile: React.FC<UserProfileProps> = ({
   updateUserProfileModalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
   updateUserProfileModalPositionType = MODAL_POSITION_TYPE.GLOBAL,
   onUserProfileUpdateModalOpen,
+  closeUserProfileModalOnClickAway = false
 }) => {
   const { user } = useChatData();
   const [userProfile, setUserProfile] = useState<IUser>();
@@ -143,6 +144,7 @@ export const UserProfile: React.FC<UserProfileProps> = ({
           <UpdateUserProfileModal
             theme={theme}
             setModal={setShowUpdateUserProfileModal}
+            closeUserProfileModalOnClickAway={closeUserProfileModalOnClickAway}
             userProfile={userProfile!}
             setUserProfile={setUserProfile}
             updateUserProfileModalBackground={updateUserProfileModalBackground}
@@ -155,7 +157,7 @@ export const UserProfile: React.FC<UserProfileProps> = ({
 };
 
 //styles
-const Conatiner = styled(Section)<IThemeProps>`
+const Conatiner = styled(Section) <IThemeProps>`
   border: ${(props) => props.theme.border?.userProfile};
   box-sizing: border-box;
 `;

diff --git a/packages/uiweb/src/lib/components/chat/exportedTypes.ts b/packages/uiweb/src/lib/components/chat/exportedTypes.ts
@@ -76,10 +76,12 @@ export interface IChatViewComponentProps {
   chatProfileRightHelperComponent?: React.ReactNode;
   chatProfileLeftHelperComponent?: React.ReactNode;
   welcomeComponent?: React.ReactNode;
+  closeChatProfileInfoModalOnClickAway?: boolean;
 }
 
 export interface IChatProfile {
   chatId: string;
+  closeChatProfileInfoModalOnClickAway?: boolean;
   groupInfoModalBackground?: ModalBackgroundType;
   groupInfoModalPositionType?: ModalPositionType;
   chatProfileRightHelperComponent?: React.ReactNode;
@@ -172,6 +174,7 @@ export interface User {
 
 export interface CreateGroupModalProps {
   onClose: () => void;
+  closeModalOnClickAway?: boolean;
   modalBackground?: ModalBackgroundType;
   modalPositionType?: ModalPositionType;
   onSuccess?: (group: GroupInfoDTO | GroupDTO | undefined) => void;
@@ -181,6 +184,7 @@ export interface UserProfileProps {
   updateUserProfileModalBackground?: ModalBackgroundType;
   updateUserProfileModalPositionType?: ModalPositionType;
   onUserProfileUpdateModalOpen?: (open: boolean) => void;
+  closeUserProfileModalOnClickAway?: boolean;
 }
 
 export interface ModalButtonProps {

diff --git a/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx b/packages/uiweb/src/lib/components/chat/reusables/Modal.tsx
@@ -18,7 +18,8 @@ import { device } from '../../../config';
 
 interface IModalProps {
   width?: string;
-  clickawayClose?: () => void;
+  onClose?: () => void;
+  closeonClickAway?: boolean;
   children: any;
   theme?: IChatTheme;
   modalBackground?: ModalBackgroundType;
@@ -31,13 +32,13 @@ interface IModalHeader {
   title: string;
 }
 
-const ClickawayCloseModal = ({ children, clickawayClose, width }: IModalProps) => {
+const ClickawayCloseModal = ({ children, onClose, width, closeonClickAway }: IModalProps) => {
   const modalRef = useRef(null);
   const theme = useContext(ThemeContext);
 
   useClickAway(modalRef, () => {
-    if (clickawayClose) {
-      clickawayClose();
+    if (onClose && closeonClickAway) {
+      onClose();
     }
   });
 
@@ -53,7 +54,8 @@ const ClickawayCloseModal = ({ children, clickawayClose, width }: IModalProps) =
 };
 
 export const Modal = ({
-  clickawayClose,
+  onClose,
+  closeonClickAway,
   children,
   width,
   modalBackground = MODAL_BACKGROUND_TYPE.OVERLAY,
@@ -66,10 +68,11 @@ export const Modal = ({
       modalBackground={modalBackground}
       modalPositionType={modalPositionType}
     >
-      {clickawayClose ? (
+      {closeonClickAway ? (
         <ClickawayCloseModal
-          clickawayClose={clickawayClose}
+          onClose={onClose}
           width={width}
+          closeonClickAway={closeonClickAway}
         >
           {children}
         </ClickawayCloseModal>

diff --git a/packages/uiweb/src/lib/components/chat/reusables/NewToast.tsx b/packages/uiweb/src/lib/components/chat/reusables/NewToast.tsx
@@ -210,7 +210,7 @@ const LoaderMessage = styled.div`
   font-size: 1rem;
   font-weight: 600;
   line-height: 1.3rem;
-  letter-spacing: 0em;
+  letter-spacing: normal;
   text-align: left;
 `;
 
@@ -232,9 +232,9 @@ const ToastContent = styled.div`
 const ToastTitle = styled.div`
   font-weight: 500;
   font-size: 1.125rem;
-  letter-spacing: -0.019em;
+  letter-spacing: normal;
   line-height: 1.4rem;
-  letter-spacing: 0em;
+  letter-spacing: normal;
   text-align: left;
   margin-bottom: 1%;
 `;

diff --git a/packages/uiweb/src/lib/components/chat/reusables/ProfileContainer.tsx b/packages/uiweb/src/lib/components/chat/reusables/ProfileContainer.tsx
@@ -105,7 +105,7 @@ export const ProfileContainer = ({ theme, member, copy, customStyle, loading }:
         <>
           {member?.name || member?.web3Name ? (
             <Span
-              fontSize={customStyle?.fontSize ?? '18px'}
+              fontSize={customStyle?.fontSize ?? '16px'}
               fontWeight={customStyle?.fontWeight ?? '400'}
               color={customStyle?.textColor ?? theme.textColor?.modalSubHeadingText}
               position="relative"
@@ -135,7 +135,7 @@ export const ProfileContainer = ({ theme, member, copy, customStyle, loading }:
               animation={theme.skeletonBG}
             >
               <RecipientSpan
-                fontSize={member?.name || member?.web3Name ? '14px' : customStyle?.fontSize ?? '18px'}
+                fontSize={member?.name || member?.web3Name ? '14px' : customStyle?.fontSize ?? '16px'}
                 fontWeight={member?.name || member?.web3Name ? '500' : customStyle?.fontWeight ?? '400'}
                 color={
                   member?.name || member?.web3Name

diff --git a/packages/uiweb/src/lib/components/chat/reusables/TextInput.tsx b/packages/uiweb/src/lib/components/chat/reusables/TextInput.tsx
@@ -12,7 +12,7 @@ export interface ITextInputProps {
   onInputChange?: any;
   disabled?: boolean;
   customStyle?: CustomStyleParamsType;
-  error?:boolean;
+  error?: boolean;
 }
 type CustomStyleParamsType = {
   background?: string;
@@ -73,19 +73,17 @@ const LabelContainer = styled.div`
   justify-content: space-between;
 
   font-weight: 500;
-  font-size: 16px;
+  font-size: 14px;
   color: ${(props) => props.theme.textColor?.modalHeadingText ?? '#000'};
 `;
 
-const Input = styled.input<IChatTheme & {customStyle:CustomStyleParamsType,error:boolean}>`
+const Input = styled.input<IChatTheme & { customStyle: CustomStyleParamsType; error: boolean }>`
   padding: 16px;
   margin-top: 8px;
   color: ${(props) => props.theme.textColor?.modalHeadingText ?? '#000'};
   background: ${(props) =>
-    props.customStyle?.background
-      ? props.customStyle.background
-      : props.theme.backgroundColor.modalInputBackground};
-  border: ${(props) => props.error?' 1px solid #ED5858':props.theme.border.modalInnerComponents};
+    props.customStyle?.background ? props.customStyle.background : props.theme.backgroundColor.modalInputBackground};
+  border: ${(props) => (props.error ? ' 1px solid #ED5858' : props.theme.border.modalInnerComponents)};
   border-radius: ${(props) => props.theme.borderRadius.modalInnerComponents};
 
   font-family: ${(props) => props.theme.fontFamily};
@@ -98,7 +96,6 @@ const Input = styled.input<IChatTheme & {customStyle:CustomStyleParamsType,error
   &:focus {
     border: 1px solid #ffdbf0;
   }
- 
 `;
 
 const CharCounter = styled.div<IChatTheme>`