fix(inventory): assign-spool picker note visible on mobile (#793 follow-up)

The original #793 fix added the spool note as an HTML title= tooltip
    on each picker button in AssignSpoolModal.tsx. title= only surfaces
    on hover, which doesn't exist on touch devices — phone users tapping
    a card just selected it, the note never appeared. Users who store
    their tracking ID in the note field were blind on mobile (raised by
    @EmcetPL on the closed issue).

    Render the note as a small muted truncated line directly under the
    weight on both the internal-inventory branch (line 436-ish) and the
    Spoolman branch (line 510-ish): text-[10px] text-bambu-gray/70 mt-1
    truncate, kept inside the truthy `&&` guard so empty notes don't add
    a blank row. The existing title={spool.note} is preserved on the new
    <p> so desktop hover and mobile long-press still surface the full
    untruncated text for notes that overflow the truncate.

    Mirrored across both inventory branches per the parity rule
    (internal and Spoolman pickers stay shape-equal). No backend change,
    no new state, no popover, no new touch target.
This commit is contained in:
maziggy
2026-06-28 12:48:18 +02:00
2 changed files with 12 additions and 0 deletions
+2
View File
File diff suppressed because one or more lines are too long
@@ -438,6 +438,11 @@ export function AssignSpoolModal({ isOpen, onClose, printerId, amsId, trayId, tr
{Math.max(0, Math.round(spool.label_weight - spool.weight_used))} / {spool.label_weight}g
</p>
)}
{spool.note && (
<p className="text-[10px] text-bambu-gray/70 mt-1 truncate" title={spool.note}>
{spool.note}
</p>
)}
</button>
))}
</div>
@@ -513,6 +518,11 @@ export function AssignSpoolModal({ isOpen, onClose, printerId, amsId, trayId, tr
{Math.max(0, Math.round(spool.label_weight - spool.weight_used))} / {spool.label_weight}g
</p>
)}
{spool.note && (
<p className="text-[10px] text-bambu-gray/70 mt-1 truncate" title={spool.note}>
{spool.note}
</p>
)}
</button>
))}
</div>