fix: message render structure

[bang9]

• Resolved an infinite loop issue occurring when using the GroupChannel/components/Message, Channel/components/Message in the renderMessage method of the GroupChannel,Channel module.
• The renderMessage method of the GroupChannel module no longer nests messages under the Message component. If a container element for the Message component is needed, use it as follows:

   import { GroupChannel } from '@sendbird/uikit-react/GroupChannel';
   import { Message } from '@sendbird/uikit-react/GroupChannel/components/Message';
    const GroupChannelPage = () => {
      return (
        <GroupChannel
          renderMessage={(props) => {
            return (
              <Message message={props.message}>
                <div>{props.message.messageId}</div>
              </Message>
            )
          }}
        />
      )
    })

• The renderMessage prop of the Channel/components/Message and GroupChannel/components/Message components has been deprecated. Instead, use children prop to customize message sub-elements.

  <Message message={props.message}>
    <div>{props.message.messageId}</div>
  </Message>

• Added detailed comments for customizing-related props in GroupChannel module.

[chohongm]

LGTM!!