Start Listening button should match Resume Listening prominence and implementation

[hyper-charlie]

Problem

Start Listening and Resume Listening are inconsistent in design and prominence. Resume Listening has a great, polished implementation, but Start Listening—while in a reasonable location next to the ellipsis—lacks equal visual prominence and UX polish.

Expected behavior

Start Listening should have the same level of prominence, accessibility, and design quality as Resume Listening. Since most users start by creating a new recording session, the primary action should feel equally important and discoverable.

Current behavior

• Start Listening is in a row next to the ellipsis (reasonable location)
• Resume Listening is well-implemented and prominent
• The inconsistency creates a confusing hierarchy

Environment

• App: 1.0.17-nightly.2
• Platform: macOS 26.4 (aarch64)
• User: [redacted]

[devin-ai-integration]

Codebase Context for This Issue

Architecture Summary

There are three distinct listening entry points in the UI, each with different styling and prominence:

Component	Location	Label	Visual Style
HeaderListenButton	Top-right of tab bar (global header)	"New meeting"	Prominent: dark stone-800 pill, rounded-full, h-9, w-[160px], red recording state with DancingSticks waveform, hover-to-stop
ListenButton (in note header)	Left of metadata chip in note header	"Resume listening"	Minimal: plain text button, h-7 px-2, text-xs, no icon, hover:bg-neutral-100/80
Listening (in overflow menu)	Inside the ⋯ dropdown menu	"Start listening" / "Resume listening"	Standard DropdownMenuItem with MicIcon

Relevant Files

• apps/desktop/src/shared/main/header-listen-button.tsx — The polished "New meeting" button in the global header. This is the most prominent listen action. Uses FloatingButton-style design with border-2, rounded-full, recording state animation (DancingSticks), hover-to-stop behavior, and a chevron dropdown for "Upload audio" / "Upload transcript".

• apps/desktop/src/session/components/outer-header/listen.tsx — The "Resume listening" text button rendered in the note's outer header row. Only shows when shouldRender && hasTranscript. Very minimal styling — plain text, no icon, no background.

• apps/desktop/src/session/components/outer-header/overflow/listening.tsx — The "Start listening" / "Resume listening" item inside the ⋯ overflow dropdown. Uses DropdownMenuItem with a MicIcon. The label switches based on hasTranscript.

• apps/desktop/src/session/components/listen-action.tsx — ListenActionButton — a floating "Start listening" button with FloatingButton + OptionsMenu. Currently unused (not imported anywhere). This appears to be dead code left over from a previous layout.

• apps/desktop/src/session/components/outer-header/index.tsx — Renders the note header row: FolderChain, ListenButton, MetadataButton, OverflowButton.

• apps/desktop/src/session/components/shared.tsx — Shared hooks (useListenButtonState, useHasTranscript) and components (RecordingIcon, ActionableTooltipContent).

Recent Changes (PR #4608 — "improve listen button")

The most relevant recent change is commit 80c7ae88 (PR #4608), which:

1. Removed the in-note active listening indicator (InMeetingIndicator) from listen.tsx
2. Consolidated active recording state into the HeaderListenButton (global header)
3. Reduced the in-note ListenButton to only show "Resume listening" as plain text (only when hasTranscript)
4. Enhanced the HeaderListenButton with improved visual design, fixed width, recording waveform, and distinct red recording state

This consolidation is what created the current asymmetry: the header "New meeting" button got the polished treatment, while the in-note "Resume listening" was intentionally simplified.

The Core Issue

The user sees "Start listening" in the overflow menu (dropdown ⋯) and compares it with the prominent "Resume listening" / "New meeting" experience. The inconsistency is:

• "New meeting" (header): Dark pill button, prominent, always visible → starts a new session
• "Resume listening" (note header): Plain text link, minimal styling → resumes on current session with existing transcript
• "Start listening" (overflow ⋯): Standard dropdown item → starts listening on current session without existing transcript

Potential Approaches

1. Elevate the in-note "Start/Resume listening" button: Give it styling closer to the HeaderListenButton — e.g., a small pill with RecordingIcon, matching border/background treatment. The existing ListenButton in listen.tsx only renders for "Resume" (when hasTranscript); it could be extended to also render a prominent "Start listening" when !hasTranscript.

2. Clean up dead code: ListenActionButton in listen-action.tsx is unused and could be removed or repurposed. It already has the FloatingButton + OptionsMenu pattern that gives "Start listening" more prominence.

3. Unify the overflow menu item: The Listening component in the overflow dropdown could be made more visually distinct (e.g., highlighted/accented) to match the importance of the action.

Additional Note

The ListenButton in the note header currently only shows "Resume listening" (requires hasTranscript). It never shows "Start listening" — that label only exists in the overflow ⋯ menu. This means for a brand-new session without transcripts, the only prominent way to start listening is the global "New meeting" header button, while the per-note "Start listening" is buried in the dropdown.