fix: v4 ui issues (#10652)

This PR has the following fixes

1. Remove leading `:` in inbox view push message content
2. Styles for block quotes in text
3. Better condition for checking bot message
4. Use dompurify
This commit is contained in:
Shivam Mishra
2025-01-08 18:17:50 +05:30
committed by GitHub
parent dd595675bc
commit 25258417de
4 changed files with 8 additions and 3 deletions

View File

@@ -80,6 +80,10 @@ const messageClasses = computed(() => ({
}));
const formatPushMessage = message => {
if (message.startsWith(': ')) {
return message.slice(2);
}
return message.replace(/^([^:]+):/g, (match, name) => {
return `<span class="${messageClasses.value.emphasis}">${name}:</span>`;
});

View File

@@ -152,7 +152,8 @@ const variant = computed(() => {
if (props.contentAttributes?.isUnsupported)
return MESSAGE_VARIANTS.UNSUPPORTED;
if (!props.sender || props.sender.type === SENDER_TYPES.AGENT_BOT) {
const isBot = !props.sender || props.sender.type === SENDER_TYPES.AGENT_BOT;
if (isBot && props.messageType === MESSAGE_TYPES.OUTGOING) {
return MESSAGE_VARIANTS.BOT;
}

View File

@@ -38,7 +38,7 @@ const onVideoLoadError = () => {
<template>
<BaseBubble class="p-3 overflow-hidden" data-bubble-name="ig-story">
<div v-if="content" class="mb-2" v-html="formattedContent" />
<div v-if="content" v-dompurify-html="formattedContent" class="mb-2" />
<img
v-if="!hasImgStoryError"
class="rounded-lg max-w-80"

View File

@@ -26,6 +26,6 @@ const formattedContent = computed(() => {
<template>
<span
v-dompurify-html="formattedContent"
class="[&_.link]:text-n-slate-11 [&_.link]:underline [&>p:last-child]:mb-0 [&>ul]:list-inside [&>ol]:list-inside [&>dl]:list-inside [&>ol]:list-decimal [&>ul]:list-disc"
class="[&_.link]:text-n-slate-11 [&_.link]:underline [&>p:last-child]:mb-0 [&>ul]:list-inside [&>ol]:list-inside [&>dl]:list-inside [&>ol]:list-decimal [&>ul]:list-disc [&>blockquote]:border-l-4 [&>blockquote]:border-n-alpha-black1 [&>blockquote]:pl-2"
/>
</template>