fix: Fix issues in bubble design (#10940)

Just making it easier to test and merge
https://github.com/chatwoot/chatwoot/pull/10796.

This PR does the following: 

- Removes the change on br + br condition. 
- Support 1x, 1.5x, 2x playbacks
- Add a hover on the agent avatar

app/javascript/dashboard/components-next/message/Message.vue

@@ -414,6 +414,11 @@ const avatarInfo = computed(() => {
   };
 });
 
+const avatarTooltip = computed(() => {
+  if (avatarInfo.value.name === '') return '';
+  return `${t('CONVERSATION.SENT_BY')} ${avatarInfo.value.name}`;
+});
+
 const setupHighlightTimer = () => {
   if (Number(route.query.messageId) !== Number(props.id)) {
     return;
@@ -472,6 +477,7 @@ provideMessageContext({
     >
       <div
         v-if="!shouldGroupWithNext && shouldShowAvatar"
+        v-tooltip.right-end="avatarTooltip"
         class="[grid-area:avatar] flex items-end"
       >
         <Avatar v-bind="avatarInfo" :size="24" />