diff --git a/src/components/CustomMessage.tsx b/src/components/CustomMessage.tsx index 1b667eaf8..be7e2805c 100644 --- a/src/components/CustomMessage.tsx +++ b/src/components/CustomMessage.tsx @@ -30,12 +30,12 @@ type Props = { export default function CustomMessage(props: Props) { const { message, activeSpinnerId, botUser } = props; - const { replacementTextList, enableEmojiFeedback, botStudioEditProps } = useConstantState(); + const { replacementTextList, enableEmojiFeedback, botStudioEditProps = {} } = useConstantState(); const { userId: currentUserId } = useWidgetSession(); - const { profileUrl } = botStudioEditProps?.botInfo ?? {}; + const { botInfo } = botStudioEditProps; const botUserId = botUser?.userId; - const botProfileUrl = profileUrl ?? botUser?.profileUrl ?? ''; + const botProfileUrl = botInfo?.profileUrl ?? botUser?.profileUrl ?? ''; const isWaitingForBotReply = activeSpinnerId === message.messageId && !!botUser; const shouldRenderFeedback = () => { @@ -68,7 +68,7 @@ export default function CustomMessage(props: Props) { return (
- {isWaitingForBotReply && } + {isWaitingForBotReply && }
); } diff --git a/src/components/CustomTypingIndicatorBubble.tsx b/src/components/CustomTypingIndicatorBubble.tsx index e1b6baaf1..9c560b993 100644 --- a/src/components/CustomTypingIndicatorBubble.tsx +++ b/src/components/CustomTypingIndicatorBubble.tsx @@ -1,7 +1,16 @@ import BotProfileImage from './BotProfileImage'; +import { useChatContext } from './chat/context/ChatProvider'; +import { useConstantState } from '../context/ConstantContext'; import { TypingBubble } from '../foundation/components/TypingBubble'; -function CustomTypingIndicatorBubble({ botProfileUrl }: { botProfileUrl: string }) { +function CustomTypingIndicatorBubble() { + const { botStudioEditProps = {}, botId } = useConstantState(); + const { channel } = useChatContext(); + + const botUser = channel?.members.find((member) => member.userId === botId); + const botInfo = botStudioEditProps.botInfo; + const botProfileUrl = botInfo?.profileUrl ?? botUser?.profileUrl; + return (
diff --git a/src/foundation/components/TypingBubble/css.ts b/src/foundation/components/TypingBubble/css.ts index 683976061..76b6aad44 100644 --- a/src/foundation/components/TypingBubble/css.ts +++ b/src/foundation/components/TypingBubble/css.ts @@ -2,7 +2,7 @@ import { css } from '@linaria/core'; export const typingDotContainer = css` align-items: center; - border-radius: 16px; + border-radius: 100px; display: flex; gap: 6px; justify-content: center;