|
| 1 | +import { useState } from "react"; |
| 2 | +import { api } from "../api"; |
| 3 | +import { Icon } from "./Icon"; |
| 4 | + |
| 5 | +// Import an already-extracted/mounted filesystem DIRECTORY as a target — the secondary |
| 6 | +// path alongside the file-upload "Add" button, for when there's no packed firmware blob |
| 7 | +// to unpack, just a rootfs already on disk. A typed host path, not a file/folder picker: |
| 8 | +// the server is loopback-only/self-hosted and reads directly off its own filesystem |
| 9 | +// (same trust model as `hexgraph ingest <path>` / the target_ingest_dir MCP tool) — a |
| 10 | +// browser file input can't hand back an absolute host path or upload an entire tree. |
| 11 | +export default function ImportDirModal({ projectId, onClose, onDone }: { |
| 12 | + projectId: string; onClose: () => void; onDone: () => void; |
| 13 | +}) { |
| 14 | + const [path, setPath] = useState(""); |
| 15 | + const [name, setName] = useState(""); |
| 16 | + const [recon, setRecon] = useState(true); |
| 17 | + const [err, setErr] = useState(""); |
| 18 | + const [busy, setBusy] = useState(false); |
| 19 | + |
| 20 | + const doImport = async () => { |
| 21 | + if (!path.trim()) return; |
| 22 | + setBusy(true); setErr(""); |
| 23 | + try { |
| 24 | + await api.addTargetDir(projectId, path.trim(), name.trim() || undefined, recon); |
| 25 | + onDone(); onClose(); |
| 26 | + } catch (e: any) { setErr(String(e.message || e)); } |
| 27 | + finally { setBusy(false); } |
| 28 | + }; |
| 29 | + |
| 30 | + return ( |
| 31 | + <div className="modal-backdrop" onMouseDown={(e) => { if (e.target === e.currentTarget) onClose(); }}> |
| 32 | + <div className="modal fade-in" style={{ width: 460 }}> |
| 33 | + <h3> |
| 34 | + <Icon name="chip" size={16} /> Import a directory |
| 35 | + <span style={{ flex: 1 }} /> |
| 36 | + <button className="btn sm ghost icon" onClick={onClose}><Icon name="x" size={13} /></button> |
| 37 | + </h3> |
| 38 | + <p className="muted" style={{ fontSize: 11.5, marginTop: -4, marginBottom: 12 }}> |
| 39 | + Import an already-extracted or mounted filesystem (a rootfs) as a target, instead of |
| 40 | + uploading a packed firmware image. The path is read from the HexGraph server's own |
| 41 | + disk, so it must be reachable from wherever <code>hexgraph serve</code> is running. |
| 42 | + </p> |
| 43 | + {err && <div className="banner err" style={{ marginBottom: 10 }}>{err}</div>} |
| 44 | + <div className="field"> |
| 45 | + <label>directory path</label> |
| 46 | + <input value={path} onChange={(e) => setPath(e.target.value)} |
| 47 | + placeholder="/path/to/mounted/rootfs" autoFocus |
| 48 | + onKeyDown={(e) => { if (e.key === "Enter" && path.trim() && !busy) doImport(); }} /> |
| 49 | + </div> |
| 50 | + <div className="field"> |
| 51 | + <label>name (optional)</label> |
| 52 | + <input value={name} onChange={(e) => setName(e.target.value)} placeholder="defaults from the path" /> |
| 53 | + </div> |
| 54 | + <label className="switch" style={{ fontSize: 12, display: "flex", gap: 8, alignItems: "center", marginTop: 4 }}> |
| 55 | + <input type="checkbox" checked={recon} onChange={(e) => setRecon(e.target.checked)} /> |
| 56 | + <span>Recon each ELF found (needs Docker) — off registers the tree without analysis</span> |
| 57 | + </label> |
| 58 | + <div className="foot"> |
| 59 | + <button className="btn ghost" onClick={onClose}>Cancel</button> |
| 60 | + <button className="btn primary" onClick={doImport} disabled={busy || !path.trim()}> |
| 61 | + <Icon name="plus" size={12} /> {busy ? "importing…" : "Import"} |
| 62 | + </button> |
| 63 | + </div> |
| 64 | + </div> |
| 65 | + </div> |
| 66 | + ); |
| 67 | +} |
0 commit comments