fix: Fixed a bug where profile bottom position not updating correctly for messages with feedback and replies (#1252)

Fixes [UIKIT-4616](https://sendbird.atlassian.net/browse/UIKIT-4616)

### Before
<img width="732" alt="Screenshot 2024-11-19 at 4 37 23 PM"
src="https://github.com/user-attachments/assets/de9a117e-2449-494f-9fc8-2881c29b4c54">


### After
<img width="723" alt="Screenshot 2024-11-19 at 4 37 50 PM"
src="https://github.com/user-attachments/assets/bd693253-9362-41a9-8c4b-76acb5c5dcc8">

### Test link
-
http://localhost:5174/group_channel?appId=833E2DC4-DFA2-4508-A283-6E5C7BFCF18A&userId=cann03&nickname=cann03&groupChannel_replyType=thread&groupChannel_enableFeedback=true

### Changelogs
- Fixed a bug where profile bottom position not updating correctly for
messages with feedback and replies

### Checklist

Put an `x` in the boxes that apply. You can also fill these out after
creating the PR. If unsure, ask the members.
This is a reminder of what we look for before merging your code.

- [ ] **All tests pass locally with my changes**
- [ ] **I have added tests that prove my fix is effective or that my
feature works**
- [ ] **Public components / utils / props are appropriately exported**
- [ ] I have added necessary documentation (if appropriate)


## External Contributions

This project is not yet set up to accept pull requests from external
contributors.

If you have a pull request that you believe should be accepted, please
contact
the Developer Relations team <[email protected]> with
details
and we'll evaluate if we can set up a
[CLA](https://en.wikipedia.org/wiki/Contributor_License_Agreement) to
allow for the contribution.


[UIKIT-4616]:
https://sendbird.atlassian.net/browse/UIKIT-4616?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

Author: chohongm

src/ui/MessageContent/index.tsx

@@ -1,4 +1,4 @@
-import React, { ReactElement, ReactNode, useMemo, useRef, useState } from 'react';
+import React, { ReactElement, ReactNode, useRef, useState } from 'react';
 import format from 'date-fns/format';
 import './index.scss';
 
@@ -202,19 +202,17 @@ export function MessageContent(props: MessageContentProps): ReactElement {
   const showThreadReplies = isNotSpecialMessage && displayThreadReplies;
   const showRightContent = isNotSpecialMessage && !isByMe && !isMobile;
 
-  const getTotalBottom = (): number => {
+  const getTotalBottom = (): string => {
     let sum = 2;
     if (threadRepliesRef.current) {
       sum += 4 + threadRepliesRef.current.clientHeight;
     }
     if (feedbackButtonsRef.current) {
       sum += 4 + feedbackButtonsRef.current.clientHeight;
     }
-    return sum;
+    return sum > 0 ? sum + 'px' : '';
   };
 
-  const totalBottom = useMemo(() => getTotalBottom(), []);
-
   const onCloseFeedbackForm = () => {
     setShowFeedbackModal(false);
   };
@@ -291,7 +289,7 @@ export function MessageContent(props: MessageContentProps): ReactElement {
             className: 'sendbird-message-content__left__avatar',
             isByMe,
             displayThreadReplies,
-            bottom: totalBottom > 0 ? totalBottom + 'px' : '',
+            bottom: getTotalBottom(),
           })
         }
         {/* outgoing menu */}