Houmeres/LLeMbas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 9 Wiki Activity

A directory chip that stopped eating the row

Browse Source 
The project directory showed its whole path, which on anything real filled the
chip's 16rem basis and pushed the Manual/Edit/Auto/Plan select off the end of
the composer. It shows the directory's own name now, with the full path in the
tooltip -- the leading directories are the part nobody reads, since what you
check before sending is that you are in `myproject` rather than `myproject-old`.

The hidden field still submits the whole path. Shortening a label must never
shorten a value, and there is a test on the row rather than on the markup for
exactly that.

Three CSS rules hold the row together, and none of them is visible from the
markup. `.composer__agent` needed `min-width: 0`: a flex item will not shrink
below its content without it, so the group refused to give and the *last* child
was what fell off -- which is why the mode select was the thing being cut rather
than the path that was too long. `.composer__dir` is capped, being the only
child here whose content is unbounded; a connection name and a mode are both
short and known. And the mode select is `flex: none`, because it is read and
changed constantly and should never be the thing that scrolls out of reach.

`baseName` driven under node against ten paths, trailing slashes and `/`
included. The topbar's copy of the same path was already capped and truncating,
so it is left alone.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jaroslav Beneš
2026-08-04 13:17:56 +02:00
co-authored by Claude Opus 5
parent 9db4e03795
commit b8c9e9a4aa
3 changed files with 101 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lembas/web/static/js/ui.js
+20 -2
View File
@@ -542,6 +542,15 @@ document.addEventListener("lembas:notify", function (event) {
exactly what it means.
*/
(function () {
/* The last segment of a path, with trailing slashes ignored so `/srv/app/`
reads as `app` rather than as nothing. `/` is itself, since it has no name
of its own and "the root" is what somebody means by it. */
function baseName(path) {
var trimmed = String(path || "").replace(/\/+$/, "");
if (!trimmed) return "/";
return trimmed.slice(trimmed.lastIndexOf("/") + 1) || "/";
}
function wire(root) {
var kind = root.querySelector("#chat-kind");
var extra = root.querySelector("[data-agent-extra]");
@@ -551,11 +560,20 @@ document.addEventListener("lembas:notify", function (event) {
if (!kind || !extra) return;
/* The directory is a hidden field plus a button, so the two have to be set
together or the button shows one path and the form submits another. */
together or the button shows one path and the form submits another.
The button shows the directory's own name; the full path goes in the
tooltip and, of course, in the field that is submitted. A real project
path is long enough that showing it whole made the button eat the row and
squeeze the mode select beside it, and the leading directories are the
part nobody is reading -- what you check before sending is that you are
in `myproject` rather than `myproject-old`. */
function setDir(value) {
if (!dir) return;
dir.value = value || "";
if (dirLabel) dirLabel.textContent = value || "the login directory";
if (dirLabel) dirLabel.textContent = value ? baseName(value) : "the login directory";
var button = dirLabel && dirLabel.closest("[data-dir-browse]");
if (button) button.title = value || "The connection's own login directory";
}
function sync() {