refactor: centralize action/icon button styles across all tools
Extract shared actionBtn and iconBtn constants into lib/utils/styles.ts and replace all 11 local definitions across tool components. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
|
||||
import * as React from 'react';
|
||||
import { Download, CheckCircle, XCircle, Loader2, Clock, TrendingUp, RefreshCw } from 'lucide-react';
|
||||
import { cn } from '@/lib/utils/cn';
|
||||
import { cn, actionBtn } from '@/lib/utils';
|
||||
import { downloadBlob, formatFileSize, generateOutputFilename } from '@/lib/media/utils/fileUtils';
|
||||
import type { ConversionJob } from '@/types/media';
|
||||
|
||||
@@ -11,9 +11,6 @@ export interface ConversionPreviewProps {
|
||||
onRetry?: () => void;
|
||||
}
|
||||
|
||||
const actionBtn =
|
||||
'flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs glass rounded-md border border-border/30 text-muted-foreground hover:text-primary hover:border-primary/30 hover:bg-primary/10 transition-all disabled:opacity-40 disabled:cursor-not-allowed';
|
||||
|
||||
export function ConversionPreview({ job, onRetry }: ConversionPreviewProps) {
|
||||
const [previewUrl, setPreviewUrl] = React.useState<string | null>(null);
|
||||
const [elapsedTime, setElapsedTime] = React.useState(0);
|
||||
@@ -171,7 +168,7 @@ export function ConversionPreview({ job, onRetry }: ConversionPreviewProps) {
|
||||
})()}
|
||||
|
||||
{/* Download */}
|
||||
<button onClick={handleDownload} className={cn(actionBtn, 'w-full')}>
|
||||
<button onClick={handleDownload} className={cn(actionBtn, 'w-full justify-center')}>
|
||||
<Download className="w-3 h-3" />
|
||||
<span className="truncate min-w-0">{filename}</span>
|
||||
</button>
|
||||
@@ -187,7 +184,7 @@ export function ConversionPreview({ job, onRetry }: ConversionPreviewProps) {
|
||||
</div>
|
||||
)}
|
||||
{onRetry && (
|
||||
<button onClick={onRetry} className={cn(actionBtn, 'w-full')}>
|
||||
<button onClick={onRetry} className={cn(actionBtn, 'w-full justify-center')}>
|
||||
<RefreshCw className="w-3 h-3" />
|
||||
Retry
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user