viktor/wrongmove
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add visual progress bar to task indicator

Browse source
This commit is contained in:
Viktor Barzin 2026-02-01 19:23:27 +00:00
parent 0ca955796e
commit 218781e038
1 changed files with 20 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

25
crawler/frontend/src/components/TaskIndicator.tsx
View file

@ -147,14 +147,29 @@ export function TaskIndicator({ taskID, onTaskCancelled }: TaskIndicatorProps) {
return ( return (
<TooltipProvider> <TooltipProvider>
<div className="flex items-center gap-1"> <div className="flex items-center gap-2">
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<div className="flex items-center gap-1.5 cursor-default"> <div className="flex items-center gap-2 cursor-default">
{getStatusIcon()} {getStatusIcon()}
<span className="text-xs text-muted-foreground hidden sm:inline"> {isInProgress && (
{isInProgress ? getProgressText() : taskStatus} <div className="flex items-center gap-2">
</span> <div className="w-24 h-1.5 bg-primary/20 rounded-full overflow-hidden hidden sm:block">
<div
className="h-full bg-primary transition-all duration-300 ease-out rounded-full"
style={{ width: `${Math.min(progressPercentage, 100)}%` }}
/>
</div>
<span className="text-xs text-muted-foreground hidden sm:inline min-w-[60px]">
{getProgressText()}
</span>
</div>
)}
{!isInProgress && (
<span className="text-xs text-muted-foreground hidden sm:inline">
{taskStatus}
</span>
)}
</div> </div>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="bottom"> <TooltipContent side="bottom">