refactor: remove Compact view mode — keep Auto + Fit only
This commit is contained in:
+3
-11
@@ -143,7 +143,7 @@ const DISPLAY_DEFAULTS = {
|
|||||||
viewMode: 'auto',
|
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 NEW_SESSION_DEFAULT_TEMPLATE = 'tmux new-session -d -s {name}';
|
||||||
const DELETE_SESSION_DEFAULT_TEMPLATE = 'tmux kill-session -t {name}';
|
const DELETE_SESSION_DEFAULT_TEMPLATE = 'tmux kill-session -t {name}';
|
||||||
|
|
||||||
@@ -653,9 +653,6 @@ function renderGrid(sessions) {
|
|||||||
if (currentMode === 'fit' && grid) {
|
if (currentMode === 'fit' && grid) {
|
||||||
grid.classList.add('session-grid--fit');
|
grid.classList.add('session-grid--fit');
|
||||||
applyFitLayout(grid);
|
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.
|
* Persists to localStorage and reapplies display settings.
|
||||||
*/
|
*/
|
||||||
function cycleViewMode() {
|
function cycleViewMode() {
|
||||||
@@ -1176,7 +1173,7 @@ function applyDisplaySettings(ds) {
|
|||||||
var mode = ds.viewMode || 'auto';
|
var mode = ds.viewMode || 'auto';
|
||||||
|
|
||||||
// Remove all mode classes
|
// 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
|
// Reset any inline styles from previous fit calculation
|
||||||
grid.style.removeProperty('grid-template-rows');
|
grid.style.removeProperty('grid-template-rows');
|
||||||
@@ -1195,11 +1192,6 @@ function applyDisplaySettings(ds) {
|
|||||||
} else if (mode === 'fit') {
|
} else if (mode === 'fit') {
|
||||||
grid.classList.add('session-grid--fit');
|
grid.classList.add('session-grid--fit');
|
||||||
applyFitLayout(grid);
|
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))';
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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 */
|
/* Fit view — tiles fill viewport, no scroll */
|
||||||
.session-grid--fit {
|
.session-grid--fit {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -2121,12 +2121,15 @@ test('bindStaticEventListeners wires delete template reset button', () => {
|
|||||||
|
|
||||||
// --- View mode cycling (Auto / Fit / Compact) ---
|
// --- 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');
|
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("'auto'"), "must include 'auto' mode");
|
||||||
assert.ok(source.includes("'fit'"), "must include 'fit' 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');
|
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', () => {
|
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 source = fs.readFileSync(new URL('../app.js', import.meta.url), 'utf8');
|
||||||
const fnStart = source.indexOf('function applyDisplaySettings(');
|
const fnStart = source.indexOf('function applyDisplaySettings(');
|
||||||
assert.ok(fnStart !== -1, 'applyDisplaySettings must exist');
|
assert.ok(fnStart !== -1, 'applyDisplaySettings must exist');
|
||||||
const fnEnd = source.indexOf('\nfunction ', fnStart + 1);
|
const fnEnd = source.indexOf('\nfunction ', fnStart + 1);
|
||||||
const fnBody = source.substring(fnStart, fnEnd > fnStart ? fnEnd : fnStart + 2000);
|
const fnBody = source.substring(fnStart, fnEnd > fnStart ? fnEnd : fnStart + 2000);
|
||||||
assert.ok(
|
assert.ok(
|
||||||
fnBody.includes('session-grid--compact'),
|
!fnBody.includes("'compact'"),
|
||||||
'applyDisplaySettings must apply session-grid--compact class for compact mode'
|
"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
|
// Reset display settings to auto
|
||||||
const ds = app.loadDisplaySettings();
|
const ds = app.loadDisplaySettings();
|
||||||
ds.viewMode = 'auto';
|
ds.viewMode = 'auto';
|
||||||
@@ -2184,15 +2187,10 @@ test('cycleViewMode cycles through auto -> fit -> compact -> auto', () => {
|
|||||||
const ds1 = app.loadDisplaySettings();
|
const ds1 = app.loadDisplaySettings();
|
||||||
assert.strictEqual(ds1.viewMode, 'fit', 'first cycle should go auto -> fit');
|
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();
|
app.cycleViewMode();
|
||||||
const ds2 = app.loadDisplaySettings();
|
const ds2 = app.loadDisplaySettings();
|
||||||
assert.strictEqual(ds2.viewMode, 'compact', 'second cycle should go fit -> compact');
|
assert.strictEqual(ds2.viewMode, 'auto', 'second cycle should wrap fit -> auto (only two modes)');
|
||||||
|
|
||||||
// Third cycle: compact -> auto
|
|
||||||
app.cycleViewMode();
|
|
||||||
const ds3 = app.loadDisplaySettings();
|
|
||||||
assert.strictEqual(ds3.viewMode, 'auto', 'third cycle should wrap compact -> auto');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test('bindStaticEventListeners wires view-mode-btn click to cycleViewMode', () => {
|
test('bindStaticEventListeners wires view-mode-btn click to cycleViewMode', () => {
|
||||||
|
|||||||
@@ -1683,21 +1683,25 @@ def test_css_sidebar_footer() -> None:
|
|||||||
assert cls in css, f"Missing CSS selector '{cls}'"
|
assert cls in css, f"Missing CSS selector '{cls}'"
|
||||||
|
|
||||||
|
|
||||||
def test_css_compact_view_exists() -> None:
|
def test_css_no_compact_view() -> None:
|
||||||
""".session-grid--compact CSS modifier must exist for compact view mode."""
|
""".session-grid--compact CSS modifier must NOT exist — compact view was removed."""
|
||||||
css = read_css()
|
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:
|
def test_css_fit_view_exists() -> None:
|
||||||
""".session-grid--fit CSS modifier must exist for fit view mode."""
|
""".session-grid--fit CSS modifier must exist for fit view mode."""
|
||||||
css = read_css()
|
css = read_css()
|
||||||
assert ".session-grid--fit" in css, "Missing .session-grid--fit CSS selector for fit view mode"
|
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()
|
def test_css_no_compact_tile_height() -> None:
|
||||||
assert ".session-grid--compact .session-tile" in css, (
|
""".session-grid--compact .session-tile must NOT exist — compact view was removed."""
|
||||||
"Missing .session-grid--compact .session-tile height override"
|
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"
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user