scriptoriumadmin/Roo-Code
1
0
Fork 0
mirror of https://github.com/RooVetGit/Roo-Code.git synced 2026-09-07 08:26:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Task Details Information Layout (#148)

Browse source
This commit is contained in:
Will Li 2025-06-27 14:00:38 -07:00 • committed by GitHub
parent 6571f5a1e8
commit c6ec80d7a8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 72 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

102
apps/web/src/components/task-sharing/TaskDetails.tsx
View file

@ -2,7 +2,16 @@ import type { TaskWithUser, Message } from '@/actions/analytics';
import type { SharedByUser } from '@/types/task-sharing';
import { formatCurrency, formatNumber } from '@/lib/formatters';
import { generateFallbackTitle } from '@/lib/task-utils';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui';
import {
Card,
CardContent,
CardHeader,
CardTitle,
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from '@/components/ui';
import { Status } from '@/app/(authenticated)/usage/Status';
import { Messages } from '@/app/(authenticated)/usage/Messages';
@ -53,18 +62,76 @@ export const TaskDetails = ({
</div>
</CardHeader>
<CardContent>
<div className="grid grid-cols-2 md:grid-cols-6 gap-4 text-sm">
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
<div>
<p className="text-muted-foreground">Developer</p>
<p className="font-mono truncate">{task.user.name}</p>
<TooltipProvider delayDuration={150}>
<Tooltip>
<TooltipTrigger asChild>
<p className="font-mono truncate">{task.user.name}</p>
</TooltipTrigger>
<TooltipContent>
<p>{task.user.name}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
<div>
<p className="text-muted-foreground">Mode</p>
<p className="font-mono">{task.mode || 'Not available'}</p>
</div>
<div>
<p className="text-muted-foreground">Git Workspace</p>
{task.repositoryName ? (
<TooltipProvider delayDuration={150}>
<Tooltip>
<TooltipTrigger asChild>
<p className="font-mono truncate">
{task.repositoryName}
</p>
</TooltipTrigger>
<TooltipContent>
<p>{task.repositoryName}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
) : (
<p className="text-muted-foreground text-xs italic">
Not available
</p>
)}
</div>
<div>
<p className="text-muted-foreground">Date</p>
<p>{new Date(task.timestamp * 1000).toLocaleString()}</p>
</div>
</div>
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm mt-4 pt-4 border-t">
<div>
<p className="text-muted-foreground">Model</p>
<p className="font-mono truncate">{task.model}</p>
<TooltipProvider delayDuration={150}>
<Tooltip>
<TooltipTrigger asChild>
<p className="font-mono truncate">{task.model}</p>
</TooltipTrigger>
<TooltipContent>
<p>{task.model}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
<div>
<p className="text-muted-foreground">Provider</p>
<p className="font-mono truncate">{task.provider}</p>
<TooltipProvider delayDuration={150}>
<Tooltip>
<TooltipTrigger asChild>
<p className="font-mono truncate">{task.provider}</p>
</TooltipTrigger>
<TooltipContent>
<p>{task.provider}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
<div>
<p className="text-muted-foreground">Tokens</p>
@ -74,31 +141,6 @@ export const TaskDetails = ({
<p className="text-muted-foreground">Cost</p>
<p className="font-mono">{formatCurrency(task.cost)}</p>
</div>
<div>
<p className="text-muted-foreground">Git Workspace</p>
{task.repositoryName ? (
<p className="font-mono truncate">{task.repositoryName}</p>
) : (
<p className="text-muted-foreground text-xs italic">
Not available
</p>
)}
</div>
</div>
{task.mode && (
<div className="mt-4 pt-4 border-t">
<div className="flex justify-between items-center text-sm">
<span className="text-muted-foreground">Mode</span>
<span className="font-mono">{task.mode}</span>
</div>
</div>
)}
<div className="mt-4 pt-4 border-t">
<div className="flex justify-between items-center text-sm">
<span className="text-muted-foreground">Date</span>
<span>{new Date(task.timestamp * 1000).toLocaleString()}</span>
</div>
</div>
</CardContent>
</Card>