fix: made Group Chat Modal More Persistent

[abhishek-01k]

Modal in the group chat has been modified and now it doesn't close on the clickaway triggered. Also, added a boolean prop to make it go away when the clickaway is triggered

#1338

Fixes Issue

Closes: #1388

Changes proposed

• Modified the CreateGroupModalProps by adding a prop of boolean type closeonClickAway which will keep a track to close the modal when their is a clickaway on the frontend side. By default the closeonClickAway will be false.
• Modified the CreateGroupModalProps by changing the prop clickAwayClose to onClose to handle the clickAway from the dapp side.

Check List (Check all the applicable boxes)

• My code follows the code style of this project.
• My change requires changes to the documentation.
• I have updated the documentation accordingly.
• This PR does not contain plagiarized content.
• The title of my pull request is a short description of the requested changes.

Note to reviewers

To check the functionality follow these methods:

On dapp side, where we are importing CreateGroupModal

• If you pass closeonClickAway = true along with onClose function from the dapp side, the modal will be non persistent i.e, it will close when their is a clickaway
  <CreateGroupModal onClose={() => handleClose()} closeonClickAway/>

• if you pass only onClose function on the dapp, the modal will be persistent and it will not close if you click outside the modal.
  <CreateGroupModal onClose={() => handleClose()}/>

[github-actions]

In the file packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx:

1. There is a missing closing parenthesis ) after the setModal={setModal} in the return statement for GROUPINFO_STEPS.CRITERIA case.
2. There are missing closing braces } for the handlePrevious and onClose functions.

In the file packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx:

1. In the handleAddWallets function, there is a missing closing parenthesis ) at the end.
2. In the handlePreviousfromAddWallets function, there is a missing closing parenthesis ) at the end.
3. There is a missing return statement before <AddGroupMembers in the CREATE_GROUP_STEP_KEYS.ADD_MEMBERS case.
4. There is a missing closing brace } at the end of the file.

In the file packages/uiweb/src/lib/components/chat/reusables/Modal.tsx:

1. In the ModalHeader component, the <Span> tag before the cursor property is missing the closing angle bracket >.
2. In the ModalHeader component, the <Span> tag before the cursor property is missing the </Span> closing tag.

Please make the necessary corrections to resolve these issues.

[rohitmalhotra1420]

Looks good to me. Let's do a exp release for this change and test it out on DApp.

[github-actions]

File: packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx

1. In the handlePrevious function, there is a missing closing curly brace after setShowAddMoreWalletModal(false);.

File: packages/uiweb/src/lib/components/chat/CreateGroup/CreateGroupModal.tsx

1. In the switch case CREATE_GROUP_STEP_KEYS.ADD_MEMBERS, add a return statement before <AddGroupMembers ... to return the component.
2. In the switch case default, add a return statement before <CreateGroupDetail ... to return the component.
3. Inside the CreateGroupModal component, the handleAddWallets function is missing a closing curly brace.
4. Inside the CreateGroupModal component, the handlePreviousfromAddWallets function is missing a closing curly brace.

File: packages/uiweb/src/lib/components/chat/UserProfile/UpdateUserProfileModal.tsx

1. In the handleRemove function, there is a missing closing curly brace after resetting setImageSrc(null);.
2. In the handleUpload function, there is a missing closing curly brace after clicking the file upload input.

Overall the code seems to be structured properly with minor issues mentioned above. Please address those and run a thorough check before finalizing the changes.

All looks good.

[rohitmalhotra1420]

PR looks good. Just wanted to know what's the reason for updated yarn.lock files?

[abhishek-01k]

Created an exp release for this version -> 1.0.0-exp.13

[github-actions]

In the file packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfile.tsx:

1. There is a missing closing curly brace after the function inside the useClickAway hook.
2. The 'initialize' object passed to useState should be updated using a function to avoid stale state issues.
3. 'ImageItem', 'DropDownBar', 'DropDownItem', and 'TextItem' components are referenced but not defined.

Apart from these issues, the code looks fine.

In the file packages/uiweb/src/lib/components/chat/ChatProfile/ChatProfileInfoModal.tsx:

1. There is a missing closing curly brace after the 'setAcceptedMemberPaginationData' useState declaration.
2. The 'GroupSectionProps' and 'GroupInfoModalProps' types are defined but not used within the file.
3. The 'createPortal' function call is missing closing parentheses.
4. 'isMobile' variable is declared but not used in the file.

The rest of the content in the provided files seems to be fine.

For specific errors not mentioned above or for any further assistance, please provide more context or details.

[github-actions]

In the code provided in the ChatProfile.tsx file, there are a few mistakes and issues that need to be addressed:

1. There is a missing closing curly brace } for the useClickAway hook callback function.

2. The Container component is not correctly closed with </Container> tag.

3. The // To setup web3 name, asynchrounously comment is misspelled. It should be asynchronously.

4. Inside the DropdownBar component, the closing tag </DropDownBar> is missing.

5. The ImageItem and TextItem components are not defined/rendered in the code snippet provided.

6. The ternary operator in the GroupInformation component is missing a property name after flexDirection="column".

7. In the GroupInformation component, fetchMemberStatus is not defined before being used.

8. The isMobile variable is used in the GroupInfoModal component without being defined or imported.

9. In the handlePrevious function in the GroupInfoModal component, the missing closing curly brace should be added.

Please make sure to address these issues in the code before proceeding.