Monorepo for Aesthetic.Computer
aesthetic.computer
chat: hide scrollbar when content fits the viewport
When totalScrollHeight <= chatHeight (few/short messages), the thumb
math produced a segHeight taller than the viewport and a boxY that
landed above the top margin, painting a malformed bar. Gate the whole
backdrop+thumb render on totalScrollHeight > chatHeight so nothing
draws when there's nothing to scroll. Visible in aa.mjs (chat inheritor)
with a fresh session, but the bug lives in chat.mjs for everyone.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
+22
-20
+22
-20
system/public/aesthetic.computer/disks/chat.mjs
+22
-20
system/public/aesthetic.computer/disks/chat.mjs
···
1636
1636
1637
1637
unmask();
1638
1638
1639
-
// 📜 Scroll bar.
1639
+
// 📜 Scroll bar — only render when content actually exceeds the viewport.
1640
+
// With few/short messages, totalScrollHeight <= chatHeight makes the
1641
+
// thumb math degenerate (segHeight overshoots, boxY lands off-screen).
1642
+
if (totalScrollHeight > chatHeight) {
1643
+
ink("gray").box(0, topMargin + 1, 3, chatHeight - 1); // Backdrop.
1640
1644
1641
-
ink("gray").box(0, topMargin + 1, 3, chatHeight - 1); // Backdrop.
1645
+
const segHeight = max(
1646
+
1,
1647
+
floor((chatHeight / totalScrollHeight) * chatHeight) - 1,
1648
+
);
1642
1649
1643
-
const segHeight = max(
1644
-
1,
1645
-
floor((chatHeight / totalScrollHeight) * chatHeight) - 1,
1646
-
);
1647
-
1648
-
const boxY =
1649
-
ceil(
1650
-
chatHeight +
1651
-
topMargin -
1652
-
segHeight -
1653
-
(scroll / totalScrollHeight) * chatHeight,
1654
-
) || 0;
1650
+
const boxY =
1651
+
ceil(
1652
+
chatHeight +
1653
+
topMargin -
1654
+
segHeight -
1655
+
(scroll / totalScrollHeight) * chatHeight,
1656
+
) || 0;
1655
1657
1656
-
// Use theme scrollbar color
1657
-
if (Array.isArray(theme.scrollbar)) {
1658
-
ink(...theme.scrollbar).box(0, boxY, 3, segHeight);
1659
-
} else {
1660
-
ink(theme.scrollbar).box(0, boxY, 3, segHeight);
1658
+
// Use theme scrollbar color
1659
+
if (Array.isArray(theme.scrollbar)) {
1660
+
ink(...theme.scrollbar).box(0, boxY, 3, segHeight);
1661
+
} else {
1662
+
ink(theme.scrollbar).box(0, boxY, 3, segHeight);
1663
+
}
1661
1664
}
1662
-
// }
1663
1665
1664
1666
const currentHandle = handle();
1665
1667