Add subscription debug panel (Ctrl+Shift+D)

Hidden dev tool showing NDK uptime, live subscription status,
per-relay connection state, per-tab last-updated timestamps,
and recent feed diagnostics log. Polls every 2s while visible.
Closes with Ctrl+Shift+D, Escape, or X button.
This commit is contained in:
Jure
2026-03-23 19:12:29 +01:00
parent 911cbea72d
commit 1f50afded7
8 changed files with 174 additions and 3 deletions

View File

@@ -3,11 +3,18 @@ import { useUIStore } from "../stores/ui";
import { useFeedStore } from "../stores/feed";
export function useKeyboardShortcuts() {
const { currentView, setView, goBack, toggleHelp } = useUIStore();
const { currentView, setView, goBack, toggleHelp, showDebugPanel, toggleDebugPanel } = useUIStore();
const { focusedNoteIndex, setFocusedNoteIndex, notes } = useFeedStore();
useEffect(() => {
const handler = (e: KeyboardEvent) => {
// Ctrl+Shift+D works everywhere, even in text fields
if (e.ctrlKey && e.shiftKey && e.key === "D") {
e.preventDefault();
toggleDebugPanel();
return;
}
const tag = (e.target as HTMLElement).tagName;
if (tag === "INPUT" || tag === "TEXTAREA" || (e.target as HTMLElement).isContentEditable) return;
switch (e.key) {
@@ -21,6 +28,7 @@ export function useKeyboardShortcuts() {
setTimeout(() => (document.querySelector("[data-search-input]") as HTMLInputElement)?.focus(), 50);
break;
case "Escape":
if (showDebugPanel) { toggleDebugPanel(); break; }
goBack();
break;
case "?":
@@ -38,5 +46,5 @@ export function useKeyboardShortcuts() {
};
window.addEventListener("keydown", handler);
return () => window.removeEventListener("keydown", handler);
}, [currentView, focusedNoteIndex, notes.length]);
}, [currentView, focusedNoteIndex, notes.length, showDebugPanel]);
}