CyberCoveLLC/Triple-C
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 35 Wiki Activity

Turn the Files tab into a real file manager

Browse Source 
Rename, an in-app viewer for text and images, host-to-container drag and
drop, New folder, keyboard operation — plus the pre-existing bugs the new
surface would otherwise have been built on top of.

New Tauri commands (file_commands.rs, registered in lib.rs):

* rename_container_path — `mv -n -- <from> <parent>/<name>` through
  exec_oneshot_as, so the *exit code* is checked. exec_oneshot discards the
  status and interleaves stderr into stdout, which would have made a
  permission failure look like a success. `mv -n` on its own is not enough
  either: GNU coreutils makes its refusal to clobber silent and exits 0, so
  an explicit `test -e` on the destination is what turns a name clash into
  an error the user sees. `mv`'s own words are surfaced, since renames
  outside /workspace legitimately fail on permissions. The new name is
  validated in Rust (no `/`, no NUL, not "." / ".." / empty, ≤255 bytes) —
  it is user text going into argv, and a name with a separator would be a
  move rather than a rename.
* read_container_file — exact bytes via Docker's archive endpoint, returned
  as base64. Deliberately not exec_oneshot, which runs every chunk through
  String::from_utf8_lossy and merges stderr, so it would corrupt any
  non-UTF-8 file and could splice diagnostics into content. Base64 rather
  than Vec<u8> because Tauri serialises a byte vec as a JSON number array.
  Capped and truncation-reporting; the caller picks the cap (images get 5
  MiB against text's 1 MiB, being the kind that blows a text-sized budget)
  and Rust clamps it to 8 MiB regardless.
* create_container_directory — `mkdir` without -p, so a clash is an error
  rather than a silent success. Named for its siblings rather than the bare
  `create_directory` in the brief.

The tar-extraction half of download_container_file is now the shared
fetch_container_file() both commands use, and it abandons the transfer once
a capped read has what it needs.

Frontend:

* Single click selects, double click opens. Directory navigation moved onto
  double click too — a single click used to navigate, which made it
  impossible to select a directory in order to rename it. Rows are now
  focusable and the table is a real `grid`: Enter opens, F2 renames, arrows
  walk the rows. No outline suppression; the global :focus-visible ring is
  what shows focus.
* FileViewerModal (built on ui/Modal, the only correct dialog) renders text
  in a <pre> and images from a revocable blob: URL. tauri.conf.json's
  img-src had neither `data:` nor `blob:`, so an in-app image was blocked by
  CSP; `blob:` is added — revocable, and no megabytes of base64 in the DOM.
  The asset protocol stays disabled. Anything else gets a "Save to host"
  state instead of a broken preview, decided by extension and then by
  sniffing the bytes for NUL.
* Host drag-and-drop uses Tauri's native onDragDropEvent, mirroring
  TerminalView: HTML5 ondrop carries no paths and is blocked in the webview
  on Windows by dragDropEnabled, which the terminal needs. The listener is
  window-wide, so it routes by hit-testing the payload position (physical
  pixels, hence the devicePixelRatio divide) against the pane's rect — a
  hidden pane has a zero-size rect and never matches, which is what keeps
  this and the terminal's listener apart. enter/over/leave drive a drop
  highlight.
* Per-row Download is now "Save to host…"; directories no longer offer it.

Pre-existing bugs fixed:

* Uploaded files landed root:root with a 1970 mtime. tar::Header::new_gnu()
  zeroes uid/gid/mtime and Docker honours the header verbatim, so uploads
  were not writable by `claude`. All four single-file tar builds now go
  through build_single_file_tar() with the container user's ids, read from
  the container because entrypoint.sh remaps them to the host user on Unix
  and deliberately does not on Windows.
* Symlinked directories could not be opened: `find -printf '%y'` reports `l`.
  The listing now prints `%Y` as well, so is_directory dereferences and a
  new is_symlink carries what `%y` used to say. The row labels the link.
* upload_file_to_container had no size cap and did a synchronous fs::read on
  an async worker. Now 256 MiB (matching the terminal drop path) with the
  read and tar build in spawn_blocking, and the host mtime preserved.
* A directory passed to upload reached fs::read and produced an opaque "Is a
  directory". Rejected with an explanation instead — recursive upload is a
  larger feature than this panel needs.
* download_container_file wrote the *first tar entry*, so downloading a
  directory silently produced a garbage file. Non-regular entries are now an
  explicit error.

Tests: 46 new (33 frontend across FilesTab, useFileManager and filePreview;
12 Rust covering the find-output parser and the rename validator, neither of
which had any). 405 frontend / 297 Rust, both green.

No drag-out dependency was added — tauri-plugin-drag is not introduced and
OS drag-out is not attempted; that stays deferred, with "Save to host…" as
the way files leave the container.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GBq2rGum6GX7xXgsas1fDc
This commit is contained in:
shadow-test
2026-08-23 08:30:48 -07:00
co-authored by Claude Opus 5
parent 75cace7dde
commit 15e05e2197
13 changed files with 1916 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/components/projects/home/FileViewerModal.tsx
+157
View File
@@ -0,0 +1,157 @@
import { useEffect, useState } from "react";
import type { FileEntry } from "../../../lib/types";
import { readContainerFile } from "../../../lib/tauri-commands";
import Button from "../../ui/Button";
import Modal from "../../ui/Modal";
import { formatBytes } from "./format";
import {
decodeBase64,
imageMimeFor,
looksBinary,
previewKind,
previewLimit,
} from "./filePreview";
interface Props {
projectId: string;
entry: FileEntry;
onClose: () => void;
/** "Save to host…" — the way out for anything the viewer can't render. */
onSaveToHost: (entry: FileEntry) => void;
}
type Preview =
| { kind: "loading" }
| { kind: "error"; message: string }
/** Too big to render whole — offered as a download rather than a half-file. */
| { kind: "too-large" }
| { kind: "text"; text: string; truncated: boolean; shownBytes: number; trueSize: number }
| { kind: "image"; url: string }
| { kind: "unsupported" };
/**
* Read-only preview of one container file.
*
* Images are rendered from a `blob:` URL rather than a `data:` one — the object
* URL is revocable (so the bytes are released the moment the modal closes) and
* keeps a multi-megabyte base64 string out of the DOM. `blob:` is in the app's
* `img-src` for exactly this; the asset protocol deliberately is not enabled.
*/
export default function FileViewerModal({ projectId, entry, onClose, onSaveToHost }: Props) {
const [preview, setPreview] = useState<Preview>({ kind: "loading" });
useEffect(() => {
let cancelled = false;
// Tracked separately from `preview` so cleanup can revoke it without
// depending on which state the component ended up in.
let objectUrl: string | null = null;
(async () => {
try {
const wantImage = previewKind(entry.name) === "image";
const result = await readContainerFile(projectId, entry.path, previewLimit(entry.name));
if (cancelled) return;
const bytes = decodeBase64(result.contents_base64);
if (wantImage) {
// A truncated image is not a smaller image, it is a broken one.
if (result.truncated) {
setPreview({ kind: "too-large" });
return;
}
const blob = new Blob([bytes], { type: imageMimeFor(entry.name) ?? "image/png" });
objectUrl = URL.createObjectURL(blob);
setPreview({ kind: "image", url: objectUrl });
return;
}
if (looksBinary(bytes)) {
setPreview({ kind: "unsupported" });
return;
}
setPreview({
kind: "text",
text: new TextDecoder().decode(bytes),
truncated: result.truncated,
shownBytes: bytes.length,
trueSize: result.size,
});
} catch (e) {
if (!cancelled) setPreview({ kind: "error", message: String(e) });
}
})();
return () => {
cancelled = true;
if (objectUrl) URL.revokeObjectURL(objectUrl);
};
}, [projectId, entry.name, entry.path]);
const footer = (
<>
<Button
size="md"
onClick={() => {
onSaveToHost(entry);
}}
>
Save to host…
</Button>
<Button size="md" variant="primary" onClick={onClose}>
Close
</Button>
</>
);
return (
<Modal
title={entry.name}
description={`${entry.path} · ${formatBytes(entry.size)}`}
onClose={onClose}
footer={footer}
widthClassName="w-[52rem]"
>
{preview.kind === "loading" && (
<p className="text-[13px] text-[var(--text-secondary)]">Loading…</p>
)}
{preview.kind === "error" && (
<p role="alert" className="text-[13px] text-[var(--error)]">
{preview.message}
</p>
)}
{preview.kind === "too-large" && (
<p className="text-[13px] text-[var(--text-secondary)]">
This file is {formatBytes(entry.size)} — too large to preview in the app. Save it
to the host to open it there.
</p>
)}
{preview.kind === "unsupported" && (
<p className="text-[13px] text-[var(--text-secondary)]">
There is no preview for this file type. Save it to the host to open it there.
</p>
)}
{preview.kind === "text" && (
<>
{preview.truncated && (
<p className="mb-2 text-xs text-[var(--warning)]">
Showing the first {formatBytes(preview.shownBytes)} of {formatBytes(preview.trueSize)}.
</p>
)}
<pre className="whitespace-pre-wrap break-words font-mono text-xs text-[var(--text-primary)]">
{preview.text}
</pre>
</>
)}
{preview.kind === "image" && (
<img src={preview.url} alt={entry.name} className="max-w-full mx-auto" />
)}
</Modal>
);
}