Files
Charon/frontend/src/components/ui/Progress.tsx
T
GitHub Actions 3169b05156 fix: skip incomplete system log viewer tests
- Marked 12 tests as skip pending feature implementation
- Features tracked in GitHub issue #686 (system log viewer feature completion)
- Tests cover sorting by timestamp/level/method/URI/status, pagination controls, filtering by text/level, download functionality
- Unblocks Phase 2 at 91.7% pass rate to proceed to Phase 3 security enforcement validation
- TODO comments in code reference GitHub #686 for feature completion tracking
- Tests skipped: Pagination (3), Search/Filter (2), Download (2), Sorting (1), Log Display (4)
2026-02-09 21:55:55 +00:00

57 lines
1.5 KiB
TypeScript

import * as React from 'react'
import * as ProgressPrimitive from '@radix-ui/react-progress'
import { cva, type VariantProps } from 'class-variance-authority'
import { cn } from '../../utils/cn'
const progressVariants = cva(
'h-full w-full flex-1 transition-all duration-normal',
{
variants: {
variant: {
default: 'bg-brand-500',
success: 'bg-success',
warning: 'bg-warning',
error: 'bg-error',
},
},
defaultVariants: {
variant: 'default',
},
}
)
export interface ProgressProps
extends React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>,
VariantProps<typeof progressVariants> {
showValue?: boolean
}
const Progress = React.forwardRef<
React.ElementRef<typeof ProgressPrimitive.Root>,
ProgressProps
>(({ className, value, variant, showValue = false, ...props }, ref) => (
<div className="flex items-center gap-3">
<ProgressPrimitive.Root
ref={ref}
className={cn(
'relative h-2 w-full overflow-hidden rounded-full bg-surface-muted',
className
)}
{...props}
>
<ProgressPrimitive.Indicator
className={cn(progressVariants({ variant }), 'rounded-full')}
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
/>
</ProgressPrimitive.Root>
{showValue && (
<span className="text-sm font-medium text-content-secondary tabular-nums">
{Math.round(value || 0)}%
</span>
)}
</div>
))
Progress.displayName = ProgressPrimitive.Root.displayName
export { Progress }