Add show/hide hidden files toggle to file manager
Toolbar button (·) toggles visibility of dotfiles. Hidden by default, click to show. Active state highlighted with accent color. Filtering happens client-side so no backend changes needed. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
6a0c8757f8
commit
11c4817497
2 changed files with 22 additions and 1 deletions
|
|
@ -76,6 +76,11 @@
|
|||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.files-action-btn.active {
|
||||
background: var(--accent-hover);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
/* File body — dual pane */
|
||||
.files-body {
|
||||
flex: 1;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
let selectedFiles = new Set();
|
||||
let contextMenuEl = null;
|
||||
let uploadInput = null;
|
||||
let showHidden = false; // show dotfiles
|
||||
|
||||
const FILE_ICONS = {
|
||||
dir: '📁',
|
||||
|
|
@ -99,7 +100,9 @@
|
|||
fileListEl.appendChild(parentRow);
|
||||
}
|
||||
|
||||
entries.forEach(entry => {
|
||||
const visible = showHidden ? entries : entries.filter(e => !e.name.startsWith('.'));
|
||||
|
||||
visible.forEach(entry => {
|
||||
const row = document.createElement('div');
|
||||
row.className = 'file-row';
|
||||
row.dataset.path = entry.path;
|
||||
|
|
@ -419,6 +422,19 @@
|
|||
deleteBtn.addEventListener('click', deleteSelected);
|
||||
btnGroup.appendChild(deleteBtn);
|
||||
|
||||
// Toggle hidden files
|
||||
const hiddenBtn = document.createElement('button');
|
||||
hiddenBtn.className = 'files-action-btn' + (showHidden ? ' active' : '');
|
||||
hiddenBtn.textContent = '·';
|
||||
hiddenBtn.title = 'Show Hidden Files';
|
||||
hiddenBtn.addEventListener('click', () => {
|
||||
showHidden = !showHidden;
|
||||
hiddenBtn.classList.toggle('active', showHidden);
|
||||
hiddenBtn.title = showHidden ? 'Hide Hidden Files' : 'Show Hidden Files';
|
||||
loadDirectory(currentPath);
|
||||
});
|
||||
btnGroup.appendChild(hiddenBtn);
|
||||
|
||||
// Refresh
|
||||
const refreshBtn = document.createElement('button');
|
||||
refreshBtn.className = 'files-action-btn';
|
||||
|
|
|
|||
Loading…
Reference in a new issue