Implement unified file editing for all non-media files

Major improvements:
- Remove separate view/edit modes - editing state can view content too
- Expand text editing support to ALL file types except media/binary files
- Add realistic undo functionality for copy/cut operations
- Implement moveSSHItem API for proper cross-directory file moves
- Add file existence checks to prevent copy failures
- Enhanced error logging with full command and path information

Key changes:
- FileWindow: Expand editable file types to exclude only media extensions
- FileViewer: Remove view mode toggle, direct editing interface
- Backend: Add moveItem API endpoint for cut operations
- Backend: Add file existence verification before copy operations
- Frontend: Complete undo system for copy (delete copied files) and cut (move back to original location)

File type handling:
- Media files (jpg, mp3, mp4, etc.) → Display only
- All other files → Direct text editing (js, py, txt, config files, unknown extensions)

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
ZacharyZcR
2025-09-16 22:53:54 +08:00
parent cae9097034
commit 2ea5383ef0
5 changed files with 385 additions and 50 deletions

View File

@@ -436,6 +436,7 @@ export function FileViewer({
</div>
<div className="flex items-center gap-2">
{/* 编辑工具栏 - 直接显示,无需切换 */}
{isEditable && (
<>
<Button
@@ -705,7 +706,7 @@ export function FileViewer({
{renderHighlightedText(editedContent)}
</div>
) : (
// 没有搜索时显示可编辑的textarea
// 直接显示可编辑的textarea
<textarea
value={editedContent}
onChange={(e) => handleContentChange(e.target.value)}
@@ -716,8 +717,9 @@ export function FileViewer({
)}
</div>
) : (
// 只有非可编辑文件(媒体文件)才显示为只读
<div className="h-full p-4 font-mono text-sm whitespace-pre-wrap overflow-auto bg-background text-foreground">
{content ? renderHighlightedText(content) : 'File is empty'}
{editedContent || content || 'File is empty'}
</div>
)}
</div>

View File

@@ -37,6 +37,7 @@ interface FileWindowProps {
sshHost: SSHHost;
initialX?: number;
initialY?: number;
// readOnly参数已移除由FileViewer内部根据文件类型决定
}
export function FileWindow({
@@ -112,17 +113,23 @@ export function FileWindow({
file.size = contentSize;
}
// 根据文件类型决定是否可编辑
const editableExtensions = [
'txt', 'md', 'js', 'ts', 'jsx', 'tsx', 'py', 'java', 'cpp', 'c', 'cs',
'php', 'rb', 'go', 'rs', 'html', 'css', 'scss', 'less', 'json', 'xml',
'yaml', 'yml', 'toml', 'ini', 'conf', 'sh', 'bat', 'ps1'
// 根据文件类型决定是否可编辑:除了媒体文件,其他都可编辑
const mediaExtensions = [
// 图片文件
'jpg', 'jpeg', 'png', 'gif', 'bmp', 'svg', 'webp', 'tiff', 'ico',
// 音频文件
'mp3', 'wav', 'ogg', 'aac', 'flac', 'm4a', 'wma',
// 视频文件
'mp4', 'avi', 'mov', 'wmv', 'flv', 'mkv', 'webm', 'm4v',
// 压缩文件
'zip', 'rar', '7z', 'tar', 'gz', 'bz2', 'xz',
// 二进制文件
'exe', 'dll', 'so', 'dylib', 'bin', 'iso'
];
const extension = file.name.split('.').pop()?.toLowerCase();
const hasNoExtension = !file.name.includes('.') || file.name.startsWith('.');
// 已知可编辑扩展名或无后缀文件默认可编辑(按文本处理)
setIsEditable(editableExtensions.includes(extension || '') || hasNoExtension);
// 只有媒体文件和二进制文件不可编辑,其他所有文件都可编辑
setIsEditable(!mediaExtensions.includes(extension || ''));
} catch (error: any) {
console.error('Failed to load file:', error);
@@ -293,7 +300,7 @@ export function FileWindow({
content={pendingContent || content}
savedContent={content}
isLoading={isLoading}
isEditable={isEditable}
isEditable={isEditable} // 移除强制只读模式由FileViewer内部控制
onContentChange={handleContentChange}
onSave={(newContent) => handleSave(newContent)}
onDownload={handleDownload}