refactor: remove Compact view mode — keep Auto + Fit only

This commit is contained in:
Brian Krabach
2026-03-31 03:05:18 -07:00
parent 8c0675157a
commit fe5337840d
4 changed files with 30 additions and 45 deletions
+3 -11
View File
@@ -143,7 +143,7 @@ const DISPLAY_DEFAULTS = {
viewMode: 'auto',
};
var VIEW_MODES = ['auto', 'fit', 'compact'];
var VIEW_MODES = ['auto', 'fit'];
const NEW_SESSION_DEFAULT_TEMPLATE = 'tmux new-session -d -s {name}';
const DELETE_SESSION_DEFAULT_TEMPLATE = 'tmux kill-session -t {name}';
@@ -653,9 +653,6 @@ function renderGrid(sessions) {
if (currentMode === 'fit' && grid) {
grid.classList.add('session-grid--fit');
applyFitLayout(grid);
} else if (currentMode === 'compact' && grid) {
grid.classList.add('session-grid--compact');
grid.style.gridTemplateColumns = 'repeat(auto-fill, minmax(200px, 1fr))';
}
}
@@ -1137,7 +1134,7 @@ function applyFitLayout(grid) {
}
/**
* Cycle the dashboard view mode: auto → fit → compact → auto.
* Cycle the dashboard view mode: auto → fit → auto.
* Persists to localStorage and reapplies display settings.
*/
function cycleViewMode() {
@@ -1176,7 +1173,7 @@ function applyDisplaySettings(ds) {
var mode = ds.viewMode || 'auto';
// Remove all mode classes
grid.classList.remove('session-grid--fit', 'session-grid--compact');
grid.classList.remove('session-grid--fit');
// Reset any inline styles from previous fit calculation
grid.style.removeProperty('grid-template-rows');
@@ -1195,11 +1192,6 @@ function applyDisplaySettings(ds) {
} else if (mode === 'fit') {
grid.classList.add('session-grid--fit');
applyFitLayout(grid);
} else if (mode === 'compact') {
grid.classList.add('session-grid--compact');
// Use auto-fill but with smaller minmax for higher density
grid.style.gridTemplateColumns = 'repeat(auto-fill, minmax(200px, 1fr))';
}
}
+1 -10
View File
@@ -1372,18 +1372,9 @@ body {
}
/* ============================================================
Dashboard view modes — Compact and Fit
Dashboard view modes — Fit
============================================================ */
/* Compact view — small tiles, high density */
.session-grid--compact .session-tile {
height: 80px;
}
.session-grid--compact .tile-body {
height: 40px;
}
/* Fit view — tiles fill viewport, no scroll */
.session-grid--fit {
overflow: hidden;
+11 -13
View File
@@ -2121,12 +2121,15 @@ test('bindStaticEventListeners wires delete template reset button', () => {
// --- View mode cycling (Auto / Fit / Compact) ---
test('app.js has VIEW_MODES array with auto, fit, compact', () => {
test('app.js has VIEW_MODES array with auto and fit only (no compact)', () => {
const source = fs.readFileSync(new URL('../app.js', import.meta.url), 'utf8');
assert.ok(source.includes("'auto'"), "must include 'auto' mode");
assert.ok(source.includes("'fit'"), "must include 'fit' mode");
assert.ok(source.includes("'compact'"), "must include 'compact' mode");
assert.ok(source.includes('VIEW_MODES'), 'must define VIEW_MODES');
// Compact mode was removed — VIEW_MODES must only have two entries
const viewModesMatch = source.match(/var VIEW_MODES\s*=\s*\[([^\]]+)\]/);
assert.ok(viewModesMatch, 'VIEW_MODES array must be defined');
assert.ok(!viewModesMatch[1].includes("'compact'"), "VIEW_MODES must NOT include 'compact'");
});
test('app.js exports cycleViewMode function', () => {
@@ -2161,19 +2164,19 @@ test('applyDisplaySettings handles fit mode by adding session-grid--fit class',
);
});
test('applyDisplaySettings handles compact mode by adding session-grid--compact class', () => {
test('applyDisplaySettings does NOT handle compact mode (compact was removed)', () => {
const source = fs.readFileSync(new URL('../app.js', import.meta.url), 'utf8');
const fnStart = source.indexOf('function applyDisplaySettings(');
assert.ok(fnStart !== -1, 'applyDisplaySettings must exist');
const fnEnd = source.indexOf('\nfunction ', fnStart + 1);
const fnBody = source.substring(fnStart, fnEnd > fnStart ? fnEnd : fnStart + 2000);
assert.ok(
fnBody.includes('session-grid--compact'),
'applyDisplaySettings must apply session-grid--compact class for compact mode'
!fnBody.includes("'compact'"),
"applyDisplaySettings must NOT reference 'compact' mode — compact was removed"
);
});
test('cycleViewMode cycles through auto -> fit -> compact -> auto', () => {
test('cycleViewMode cycles through auto -> fit -> auto (two modes, compact removed)', () => {
// Reset display settings to auto
const ds = app.loadDisplaySettings();
ds.viewMode = 'auto';
@@ -2184,15 +2187,10 @@ test('cycleViewMode cycles through auto -> fit -> compact -> auto', () => {
const ds1 = app.loadDisplaySettings();
assert.strictEqual(ds1.viewMode, 'fit', 'first cycle should go auto -> fit');
// Second cycle: fit -> compact
// Second cycle: fit -> auto (wraps, compact is gone)
app.cycleViewMode();
const ds2 = app.loadDisplaySettings();
assert.strictEqual(ds2.viewMode, 'compact', 'second cycle should go fit -> compact');
// Third cycle: compact -> auto
app.cycleViewMode();
const ds3 = app.loadDisplaySettings();
assert.strictEqual(ds3.viewMode, 'auto', 'third cycle should wrap compact -> auto');
assert.strictEqual(ds2.viewMode, 'auto', 'second cycle should wrap fit -> auto (only two modes)');
});
test('bindStaticEventListeners wires view-mode-btn click to cycleViewMode', () => {
+15 -11
View File
@@ -1683,21 +1683,25 @@ def test_css_sidebar_footer() -> None:
assert cls in css, f"Missing CSS selector '{cls}'"
def test_css_compact_view_exists() -> None:
""".session-grid--compact CSS modifier must exist for compact view mode."""
def test_css_no_compact_view() -> None:
""".session-grid--compact CSS modifier must NOT exist compact view was removed."""
css = read_css()
assert ".session-grid--compact" in css, "Missing .session-grid--compact CSS selector for compact view mode"
assert ".session-grid--compact" not in css, (
".session-grid--compact must be removed — compact view mode was removed, only Auto and Fit remain"
)
def test_css_fit_view_exists() -> None:
""".session-grid--fit CSS modifier must exist for fit view mode."""
css = read_css()
assert ".session-grid--fit" in css, "Missing .session-grid--fit CSS selector for fit view mode"
def test_css_compact_tile_height() -> None:
""".session-grid--compact .session-tile must set a compact height."""
css = read_css()
assert ".session-grid--compact .session-tile" in css, (
"Missing .session-grid--compact .session-tile height override"
assert ".session-grid--fit" in css, (
"Missing .session-grid--fit CSS selector for fit view mode"
)
def test_css_no_compact_tile_height() -> None:
""".session-grid--compact .session-tile must NOT exist — compact view was removed."""
css = read_css()
assert ".session-grid--compact .session-tile" not in css, (
".session-grid--compact .session-tile must be removed — compact view mode was removed"
)