fix: fixed placement of chat

[mishramonalisha76]

Fixes Issue

Changes proposed

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.

Screenshots

Note to reviewers

[github-actions]

In the provided code snippets, I found some mistakes and potential improvements:

1. In packages/uiweb/package.json:

   • "peerDependencies" block is missing a closing curly brace } at the end.
   • In "peerDependencies", the property "@pushprotocol/restapi" should have a comma after its value "1.7.13".

2. In packages/uiweb/src/lib/components/chat/ChatViewBubble/ChatViewBubble.tsx:

   • In the SenderMessageProfilePicture component, there is a missing closing curly brace } before the if condition.
   • In the MessageWrapper component, the properties like flexDirection, gap, width, and maxWidth should be passed as object keys inside the Section component.
   • In the MessageCard component, the MessageSection should have a closing tag </MessageSection>.
   • In the TwitterCard component, remove the extra tweetId and position properties in the function signature and fix the maxWidth property assignment.

3. In packages/uiweb/src/lib/components/chat/ChatViewList/ChatViewList.tsx:

   • The map function in the rendered messages section should have a return statement for each iteration.
   • The if conditions for different message types like 'Image' and 'File' are not correctly implemented; they are missing the component rendering.
   • In the ChatViewListCard styled component, the overscroll-behavior property should specify the value contain.

4. In packages/uiweb/src/lib/components/chat/CreateGroup/AddCriteria.tsx:

   • The dropdownChainsValues array has missing comma separators between objects at each item.
   • In the verifyAndDoNext function, there is a missing closing curly brace } for the error handling block.
   • There are missing closing tags in the function at the end after handling previous actions.

There may be more issues to be checked thoroughly. After resolving these mentioned mistakes, please review the logic and functionality to ensure everything works as intended.

[github-actions]

In the file packages/uiweb/package.json:

1. Missing comma after the last dependency entry before the "peerDependencies" section.
2. In the "peerDependencies" section, a colon is missing after the package name "@pushprotocol/restapi" (should be changed to "@pushprotocol/restapi": "1.7.13").

After fixing the above issues, the package.json file should look like this:

{
  "name": "@pushprotocol/uiweb",
  "version": "0.0.1-alpha.46",
  "publishConfig": {
    "registry": "https://registry.npmjs.org/"
  },
  "dependencies": {
    "@livekit/components-react": "^1.2.2",
    "@livekit/components-styles": "^1.0.6",
    "@livepeer/react": "^2.6.0",
    "@pushprotocol/socket": "^0.5.0",
    "@unstoppabledomains/resolution": "^8.5.0",
    "@web3-onboard/coinbase": "^2.2.5",
    "@web3-onboard/core": "^2.21.1",
    "@web3-onboard/injected-wallets": "^2.10.5",
    "@web3-onboard/react": "^2.8.9",
    "@web3-onboard/walletconnect": "^2.4.6",
    "@web3-react/injected-connector": "^6.0.7",
    "date-fns": "^2.28.0",
    "emoji-picker-react": "^4.4.9",
    "ethers": "^5.6.8",
    "gif-picker-react": "^1.1.0",
    "html-react-parser": "^1.4.13",
    "livekit-client": "^1.13.3",
    "moment": "^2.29.4",
    "react-easy-crop": "^4.1.4",
    "react-icons": "^4.10.1",
    "react-image-file-resizer": "^0.4.7",
    "animejs": "^2.2.0",
    "classnames": "^2.2.5",
    "raf": "^3.4.0",
    "react-toastify": "^9.1.3",
    "react-twitter-embed": "^4.0.4",
    "uuid": "^9.0.1"
  },
  "peerDependencies": {
    "@pushprotocol/restapi": "1.7.13",
    "react": ">=16.8.0",
    "styled-components": "^6.0.8"
  }
}

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

1. Missing closing curly brace after the JSX element in the SenderMessageProfilePicture component.
2. Missing closing curly brace at the end of the MessageWrapper component.
3. Missing closing curly brace at the end of the ChatViewBubble component.

After fixing the above issues, the file should look like this:

// Inside the SenderMessageProfilePicture component
{
  chat.fromCAIP10 !== user?.account && (
    <Section alignItems="start">
      {pfp && (
        <Image
          src={pfp}
          alt="profile picture"
          width="40px"
          height="40px"
          borderRadius="50%"
        />
      )}
    </Section>
  )
}

// Inside the MessageWrapper component
  </Section>
}

// Inside the ChatViewBubble component
    </MessageWrapper>
  );
};

All looks good.