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;