From 11c48174976eee36e50de4e531197b4e4ae98c8a Mon Sep 17 00:00:00 2001
From: roberts <w.r.tx@icloud.com>
Date: Sun, 15 Mar 2026 00:39:26 -0500
Subject: [PATCH] Add show/hide hidden files toggle to file manager
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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>
---
 frontend/css/apps/files.css |  5 +++++
 frontend/js/apps/files.js   | 18 +++++++++++++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/frontend/css/apps/files.css b/frontend/css/apps/files.css
index a90a452..a3674c2 100644
--- a/frontend/css/apps/files.css
+++ b/frontend/css/apps/files.css
@@ -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;
diff --git a/frontend/js/apps/files.js b/frontend/js/apps/files.js
index a2c9f50..63f8814 100644
--- a/frontend/js/apps/files.js
+++ b/frontend/js/apps/files.js
@@ -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';