Files
WebFTP/components/Icon.tsx
2026-01-19 11:04:36 +09:00

32 lines
1.1 KiB
TypeScript

import React from 'react';
import {
Folder,
FileText,
FileCode,
FileImage,
FileVideo,
File as FileGeneric,
Server,
Monitor,
ArrowUp,
ArrowDown,
CheckCircle,
XCircle,
Clock,
RefreshCw,
FolderOpen
} from 'lucide-react';
import { FileType } from '../types';
export const FileIcon: React.FC<{ name: string; type: FileType; className?: string }> = ({ name, type, className }) => {
if (type === FileType.FOLDER) return <Folder className={`text-blue-500 fill-blue-500/20 ${className}`} />;
const ext = name.split('.').pop()?.toLowerCase();
if (['png', 'jpg', 'jpeg', 'gif', 'svg'].includes(ext || '')) return <FileImage className={`text-purple-600 ${className}`} />;
if (['mp4', 'mov', 'avi'].includes(ext || '')) return <FileVideo className={`text-pink-600 ${className}`} />;
if (['js', 'ts', 'tsx', 'html', 'css', 'json', 'py', 'php'].includes(ext || '')) return <FileCode className={`text-yellow-600 ${className}`} />;
if (['txt', 'md', 'log'].includes(ext || '')) return <FileText className={`text-slate-500 ${className}`} />;
return <FileGeneric className={`text-slate-400 ${className}`} />;
};