agent: dogfood polish 2026/04/19 — Linux native chrome + History redesign + mic picker cleanup
Second dogfood sprint. Headline fix: Linux now uses native KWin/Mutter decorations instead of fragile frameless `startResizeDragging`, which collapsed diagonal corner resize to a single axis and made drag feel laggy. macOS / Windows keep custom chrome via `useCustomChrome` gate. Other changes: - Cross-window preferences sync via `kon:preferences-changed` Tauri event — theme and font changes propagate live to float/viewer. - Hotkey recorder rewritten to use capture-phase document listener gated by $effect; button focus was unreliable in webkit2gtk. - History page redesigned for cognitive-load hygiene: title-first compact row, inline title input, Edit popout opening /viewer in edit mode, clipboard export as .md with YAML frontmatter, manual tag chips + + Add tag input, header tag filter (cap 7), global Starred filter, `tag:xyz` search syntax. - `deriveAutoTags` kept as empty hook for post-Task-7 LLM topic tags; research found all previous auto-tag chips redundant with row UI. - Viewer window adds edit mode with debounced-save textarea; native title renamed to "Kon - Transcription Editor". - Window minimums updated per GNOME HIG + WCAG reflow research: main 960x600, float 360x480, editor 560x520. - Microphone picker filters raw ALSA strings (hw:, plughw:, front:, sysdefault:, null) and dedupes by CARD=X. New `description` field on DeviceInfo reads /proc/asound/cards so Blue Yeti shows as "Blue Microphones" instead of the short "Microphones" card name. - GPU reporting fixed: get_runtime_capabilities now returns accelerators=[cpu,vulkan] and whisper.supports_gpu=true, matching the transcribe-rs whisper-vulkan feature linked unconditionally. - ResizeHandles kept for macOS/Windows frameless: 12px edges, 20px corners via CSS vars, pointerdown + setPointerCapture, corners above edges in z-order, rendered as sibling (not child) of the animated layout root so `position: fixed` is viewport-relative. - Dueling drag-region handlers removed — `data-tauri-drag-region` and manual `startDragging()` were stacked on the same elements; kept the manual handler which has the button/input early-return logic. See HANDOVER.md for the full session log and deferred items. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -19,6 +19,10 @@
|
||||
let showStarredOnly = $state(false);
|
||||
let animFrameId = null;
|
||||
let segmentRefs = [];
|
||||
let viewerMode = $state("view"); // "view" | "edit"
|
||||
let textDraft = $state("");
|
||||
let textDirty = $state(false);
|
||||
let textSaveTimer = null;
|
||||
|
||||
|
||||
// Load item data from localStorage (set by HistoryPage before opening this window)
|
||||
@@ -27,6 +31,7 @@
|
||||
const raw = localStorage.getItem("kon_viewer_item");
|
||||
if (raw) {
|
||||
item = JSON.parse(raw);
|
||||
textDraft = item?.text || "";
|
||||
if (item.audioPath) {
|
||||
const src = convertFileSrc(item.audioPath);
|
||||
const audio = new Audio(src);
|
||||
@@ -36,6 +41,8 @@
|
||||
audioEl = audio;
|
||||
}
|
||||
}
|
||||
const mode = localStorage.getItem("kon_viewer_mode");
|
||||
if (mode === "edit" || mode === "view") viewerMode = mode;
|
||||
} catch {}
|
||||
|
||||
// Listen for new items via storage events
|
||||
@@ -46,6 +53,12 @@
|
||||
if (audioEl) audioEl.pause();
|
||||
cancelAnimationFrame(animFrameId);
|
||||
window.removeEventListener("storage", handleStorageChange);
|
||||
// Flush any pending text edit before the window tears down.
|
||||
if (textSaveTimer) {
|
||||
clearTimeout(textSaveTimer);
|
||||
textSaveTimer = null;
|
||||
}
|
||||
if (textDirty) commitTextEdit();
|
||||
});
|
||||
|
||||
function handleStorageChange(e) {
|
||||
@@ -218,6 +231,29 @@
|
||||
} catch {}
|
||||
}
|
||||
|
||||
function scheduleTextSave() {
|
||||
textDirty = true;
|
||||
clearTimeout(textSaveTimer);
|
||||
textSaveTimer = setTimeout(() => {
|
||||
commitTextEdit();
|
||||
}, 400);
|
||||
}
|
||||
|
||||
function commitTextEdit() {
|
||||
if (!item) return;
|
||||
const next = textDraft;
|
||||
if (next === item.text) {
|
||||
textDirty = false;
|
||||
return;
|
||||
}
|
||||
item.text = next;
|
||||
// The compact preview in History is derived from `preview`; keep it
|
||||
// roughly in sync so the list does not show stale copy after an edit.
|
||||
item.preview = next.slice(0, 120);
|
||||
saveItemToHistory();
|
||||
textDirty = false;
|
||||
}
|
||||
|
||||
// Filtered segments (starred filter + search)
|
||||
let visibleSegments = $derived.by(() => {
|
||||
if (!item?.segments) return [];
|
||||
@@ -228,39 +264,28 @@
|
||||
return segs;
|
||||
});
|
||||
|
||||
// Window drag
|
||||
// Window drag — pointerdown + setPointerCapture avoids the mousedown
|
||||
// latency that makes KWin's initial grab feel draggy.
|
||||
function handleDragStart(e) {
|
||||
if (e.button !== 0) return;
|
||||
if (e.target.closest("button")) return;
|
||||
if (e.target.closest("input")) return;
|
||||
try { e.currentTarget?.setPointerCapture?.(e.pointerId); } catch {}
|
||||
getCurrentWindow().startDragging();
|
||||
}
|
||||
|
||||
function closeWindow() {
|
||||
getCurrentWindow().close();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col h-full bg-bg">
|
||||
<!-- Drag handle -->
|
||||
<div
|
||||
class="flex items-center h-[36px] bg-bg-elevated select-none px-3"
|
||||
onmousedown={handleDragStart}
|
||||
data-tauri-drag-region
|
||||
onpointerdown={handleDragStart}
|
||||
>
|
||||
<span class="text-[12px] font-medium text-text-secondary tracking-wide" data-tauri-drag-region>
|
||||
Kon - Viewer
|
||||
<span class="text-[12px] font-medium text-text-secondary tracking-wide">
|
||||
Kon - {viewerMode === "edit" ? "Editor" : "Viewer"}
|
||||
</span>
|
||||
<div class="flex-1" data-tauri-drag-region></div>
|
||||
<button
|
||||
class="w-7 h-7 flex items-center justify-center text-text-tertiary hover:text-danger rounded-md hover:bg-hover"
|
||||
onclick={closeWindow}
|
||||
aria-label="Close"
|
||||
>
|
||||
<svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<path d="M18 6L6 18M6 6l12 12" stroke-linecap="round" />
|
||||
</svg>
|
||||
</button>
|
||||
<div class="flex-1"></div>
|
||||
</div>
|
||||
|
||||
{#if item}
|
||||
@@ -328,7 +353,8 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Search bar + view controls -->
|
||||
<!-- Search bar + view controls (segment-specific; hidden in edit mode) -->
|
||||
{#if viewerMode !== "edit"}
|
||||
<div class="flex items-center gap-2 px-5 py-2 border-b border-border-subtle">
|
||||
<div class="flex items-center gap-2 bg-bg-input border border-border rounded-lg px-3 py-1.5 focus-within:border-accent flex-1">
|
||||
<svg class="w-3.5 h-3.5 text-text-tertiary flex-shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
@@ -362,10 +388,20 @@
|
||||
title={showStarredOnly ? "Show all segments" : "Show starred only"}
|
||||
>Starred</button>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Transcript segments -->
|
||||
<!-- Transcript segments / editor -->
|
||||
<div class="flex-1 overflow-y-auto px-5 py-3 min-h-0">
|
||||
{#if item.segments && item.segments.length > 0}
|
||||
{#if viewerMode === "edit"}
|
||||
<textarea
|
||||
class="w-full h-full bg-bg-input border border-border rounded-lg px-3 py-2 text-[13px]
|
||||
text-text leading-relaxed resize-none focus:outline-none focus:border-accent"
|
||||
bind:value={textDraft}
|
||||
oninput={scheduleTextSave}
|
||||
data-no-transition
|
||||
placeholder="Edit the transcript..."
|
||||
></textarea>
|
||||
{:else if item.segments && item.segments.length > 0}
|
||||
<div class="flex flex-col gap-1">
|
||||
{#each visibleSegments as seg (seg._idx)}
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user