diff --git a/docs/claude-progress.txt b/docs/claude-progress.txt index 1591bd8..ddf3cbd 100644 --- a/docs/claude-progress.txt +++ b/docs/claude-progress.txt @@ -1,6 +1,17 @@ # Claude Progress Log # Newest entries first. Agents: append your entry at the top after the header. +--- +## 2026-06-12 | Session: Fix clipboard copy error handling +Worked on: Add error state for copy-to-clipboard buttons on landing page +Completed: +- Added error handling for navigator.clipboard API unavailability (e.g. non-HTTPS contexts) +- Added .catch() handler for clipboard.writeText promise rejection +- Added error state styling (.copy-error class) with red color, X icon, and "Copy failed" hover label +- Applied error handling to both install command and YAML copy buttons +Left off: Branch pr/fix-catch ready for review. +Blockers: None + --- ## 2026-05-21 | Session: Page co-location restructure (continued) Worked on: Follow-up fixes from review, test cleanup, docs diff --git a/pages/index.html b/pages/index.html index b726e15..be4c789 100644 --- a/pages/index.html +++ b/pages/index.html @@ -149,6 +149,9 @@ position: absolute; top: 0.6rem; right: 0.6rem; + display: inline-flex; + align-items: center; + gap: 0.3rem; background: transparent; border: none; color: #484f58; @@ -160,10 +163,16 @@ } .copy-btn:hover { color: #8b949e; background: rgba(255, 255, 255, 0.06); } .copy-btn.copied { color: var(--accent); } + .copy-btn.copy-error { color: #f85149; } .copy-icon { width: 16px; height: 16px; } .check-icon { width: 16px; height: 16px; display: none; } + .error-icon { width: 16px; height: 16px; display: none; } + .error-label { display: none; font-family: 'JetBrains Mono', monospace; font-size: 0.65rem; } .copy-btn.copied .copy-icon { display: none; } .copy-btn.copied .check-icon { display: inline; } + .copy-btn.copy-error .copy-icon { display: none; } + .copy-btn.copy-error .error-icon { display: inline; } + .copy-btn.copy-error:hover .error-label { display: inline; } .fade-in { animation: fadeIn 0.6s ease both; } .fade-in-delay-1 { animation-delay: 0.1s; } .fade-in-delay-2 { animation-delay: 0.2s; } @@ -188,6 +197,8 @@
Install
$ oc new-project console-functions-plugin
 $ oc apply -f https://functions-dev.github.io/ocp-console-plugin/plugin.yaml
@@ -209,6 +220,8 @@
plugin.yaml
Loading...
@@ -227,9 +240,17 @@
plugin.yaml
if (strip) { text = text.split('\n').map(l => l.startsWith(strip) ? l.slice(strip.length) : l).join('\n'); } + if (typeof navigator.clipboard === 'undefined') { + btn.classList.add('copy-error'); + setTimeout(() => { btn.classList.remove('copy-error'); }, 1500); + return; + } navigator.clipboard.writeText(text).then(() => { btn.classList.add('copied'); setTimeout(() => { btn.classList.remove('copied'); }, 1500); + }).catch(() => { + btn.classList.add('copy-error'); + setTimeout(() => { btn.classList.remove('copy-error'); }, 1500); }); }); });