Build Record Tab with Draft Recording and Playback

[chadw-eten]

The Record Tab is where translators record drafts in their target language, review takes, and re-record as needed. BCS field testing of the POC surfaced three needs this build addresses: mid-recording pause with resumable takes (translators encounter background noise and need to wait it out without losing progress), collapsible source text accessible without leaving the recording surface, and a persistent record/play button layout that never conditionally hides.

This build targets verse-by-verse translation. Pericope view is a future phase.

Functional Requirements

Verse Navigation

• Display the selected verse reference prominently below the page header (e.g., "Mark 14:3").
• Display a previous verse button (li:chevron-left) and next verse button (li:chevron-right) flanking the verse reference.
• Tapping prev or next sets that verse as the selected verse for the whole drafting page (see Build Drafting Page Shell with Tab Navigation #47), scrubs the player to that verse's start, and updates the tab to show that verse's recording state.
• If a take is currently paused when the user taps prev/next, prompt them to resume or discard before the verse changes; discarding returns the current verse to its prior recording state.
• Dim (do not hide) the previous button on the first verse; dim the next button on the last verse.

Recording Controls

Three mutually exclusive states:

• Idle (no draft exists):

  • Display an enlarged Record button (li:circle-dot) with a label reading "Record [verse reference]" (e.g., "Record Mark 14:3").
  • Do not render a waveform area in this state.
  • Tapping begins recording and transitions to the Recording state.
    • On first tap, request microphone permission via the OS dialog.
    • If denied, show an in-app message explaining that microphone access is required, with a "Go to Settings" button that deep-links to the app's permission settings.
    • If permanently denied (OS dialog suppressed), skip directly to the in-app message.

• Recording:

  • Render a live animated waveform above the controls; content below (including the source text accordion) shifts down to accommodate.
  • Display a Pause button (li:pause) and a Stop button (li:stop-circle).
  • Display a recording duration counter that increments in real time.
  • Tapping Pause halts recording and immediately flushes the partial take to disk so it is recoverable if the app is killed or crashes; the take must be resumable; the Pause button changes to a Record icon (li:circle-dot) to indicate recording can be resumed.
  • Tapping the Record icon resumes recording, appending to the current take, and restores the Pause button.
  • Backgrounding the app during active recording auto-pauses the take (equivalent to a manual pause); the partial take is flushed to disk and the user returns to the paused state on resume.
  • Paused takes persist indefinitely; there is no timeout.
  • If the user navigates away from the drafting page (e.g., tapping the back button to return to My Work or the chapter list) while a take is paused, prompt them to resume or discard before leaving; discarding returns the verse to its prior recording state.
  • Tapping Stop commits the take as the draft for that verse and transitions to the Review state; the selected verse does not auto-advance.

• Review (draft exists):

  • Display the draft waveform as a static amplitude visualization above the playback controls; allow scrubbing to any position.
  • Display a Play button (li:play); tapping plays from the current scrub position; when playback reaches the end, it stops and resets the scrubber to the beginning.
  • Display Re-record and Delete buttons below the waveform.
  • Tapping Re-record begins a new recording immediately, silently overwriting the existing draft with no confirmation prompt.
  • Tapping Delete shows a confirmation prompt before removing the draft; confirming returns to the Idle state.

Source Text

• Display source text for the selected verse in a collapsible accordion below the recording controls.
• Collapsed by default.

Note: Pause→Resume appends to the current take. Re-record silently overwrites. These are distinct behaviors; no confirmation prompt for either in MVP.

In recording mode

Recording paused

Recording complete