apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-05-01 11:26:23 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add typing ellipsis to playground

Browse source
This commit is contained in:
akhisud3195 2025-09-12 13:33:39 +04:00
parent 3b2d8a4fb5
commit 3dc7a6783b
1 changed files with 8 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

17
apps/rowboat/app/projects/[projectId]/playground/components/messages.tsx
View file

@ -225,15 +225,14 @@ function AssistantMessage({
);
}
function AssistantMessageLoading() {
function TypingIndicator() {
return (
<div className="self-start flex flex-col gap-1 my-5">
<div className="max-w-[85%] inline-block">
<div className="bg-gray-50 dark:bg-gray-800 px-4 py-2.5
rounded-lg border border-gray-200 dark:border-gray-700
shadow-sm animate-slideUpAndFade min-h-[2.5rem] flex items-center gap-2">
<Spinner size="sm" />
<span className="text-sm text-gray-600 dark:text-gray-400">Generating...</span>
<div className="flex justify-start items-center my-4 px-1">
<div className="flex items-center gap-1">
<div className="flex space-x-1">
<div className="w-2 h-2 bg-gray-400 dark:bg-gray-500 rounded-full animate-bounce" style={{ animationDelay: '0ms' }}></div>
<div className="w-2 h-2 bg-gray-400 dark:bg-gray-500 rounded-full animate-bounce" style={{ animationDelay: '150ms' }}></div>
<div className="w-2 h-2 bg-gray-400 dark:bg-gray-500 rounded-full animate-bounce" style={{ animationDelay: '300ms' }}></div>
</div>
</div>
</div>
@ -948,7 +947,7 @@ export function Messages({
}
return null;
})}
{loadingAssistantResponse && <AssistantMessageLoading />}
{loadingAssistantResponse && <TypingIndicator />}
</div>
);
}