added a subtle wave animation to the 'processing...' text.

This commit is contained in:
Xiaohan-Tian
2025-08-15 19:34:13 -07:00
parent c6fac8b319
commit f5a6c8d92c
3 changed files with 74 additions and 17 deletions
+4 -4
View File
@@ -276,7 +276,7 @@ const ChatBox: React.FC<ChatBoxProps> = ({ isVisible }) => {
setMessages(prev => [...prev, {
id: assistantMsgId,
role: 'assistant',
content: 'processing... 0 tokens received. click here to abort.',
content: '<span class="processing-wave">Processing...</span> 0 tokens received. click here to abort.',
isStreaming: true,
tokenCount: 0
}]);
@@ -304,7 +304,7 @@ const ChatBox: React.FC<ChatBoxProps> = ({ isVisible }) => {
// Update streaming message with token count and abort link
setMessages(prev => prev.map(msg =>
msg.id === assistantMsgId
? { ...msg, content: `processing... ${tokenCount} tokens received. click here to abort.`, tokenCount }
? { ...msg, content: `<span class="processing-wave">Processing...</span> ${tokenCount} tokens received. click here to abort.`, tokenCount }
: msg
));
} else if (chunk.type === 'done') {
@@ -396,7 +396,7 @@ const ChatBox: React.FC<ChatBoxProps> = ({ isVisible }) => {
setMessages(prev => [...prev, {
id: assistantMsgId,
role: 'assistant',
content: 'processing... 0 tokens received. click here to abort.',
content: '<span class="processing-wave">Processing...</span> 0 tokens received. click here to abort.',
isStreaming: true,
tokenCount: 0
}]);
@@ -441,7 +441,7 @@ const ChatBox: React.FC<ChatBoxProps> = ({ isVisible }) => {
// Update streaming message with token count and abort link
setMessages(prev => prev.map(msg =>
msg.id === assistantMsgId
? { ...msg, content: `processing... ${tokenCount} tokens received. click here to abort.`, tokenCount }
? { ...msg, content: `<span class="processing-wave">Processing...</span> ${tokenCount} tokens received. click here to abort.`, tokenCount }
: msg
));
} else if (chunk.type === 'done') {