Skip to content

Add role-play audio review workflow - #42

Merged
CodeWithOz merged 3 commits into
mainfrom
roleplay-audio-review
Jul 8, 2026
Merged

Add role-play audio review workflow#42
CodeWithOz merged 3 commits into
mainfrom
roleplay-audio-review

Conversation

@CodeWithOz

@CodeWithOz CodeWithOz commented Jul 8, 2026

Copy link
Copy Markdown
Owner

What changed

  • add per-message user recording playback in role-play conversations behind a subtle toggle
  • add a role-play post-session summary overlay with restart and dismiss flows
  • add a dedicated standardization review service that evaluates only the user's recorded audio and uses AI text only as context
  • add tests covering the user-audio toggle and the role-play review service prompt behavior

Why

Role-play sessions needed two follow-ups after practice: access to the user's own recordings inside the conversation, and a focused review that rewrites only the user's less standard French into more established phrasing without grading the AI or relying on transcripts as the source of truth.

Validation

  • npm test -- tests/scenarioStandardizationReviewService.test.ts tests/ConversationHistory.userAudioToggle.test.tsx
  • npm run build

Summary by CodeRabbit

  • New Features

    • Added a session-complete review screen for role-play scenarios, with navigation, retry/regenerate, restart, and done actions.
    • Added an option to show or hide user recording playback in conversation history during practice mode.
  • Bug Fixes

    • Improved handling of conversation and audio state when starting, restarting, or dismissing a scenario summary.
    • Added stronger support for audio-backed review generation and fallback behavior when audio isn’t available.

@coderabbitai

coderabbitai Bot commented Jul 8, 2026

Copy link
Copy Markdown

Review Change Stack

Warning

Review limit reached

@CodeWithOz, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 42 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 05e7ee97-2b4f-4e51-8072-7138a65d1d9d

📥 Commits

Reviewing files that changed from the base of the PR and between 6a8a6fa and d7487a0.

📒 Files selected for processing (5)
  • .codex/hooks.json
  • App.tsx
  • __tests__/scenarioReviewAbortGuards.source.test.ts
  • __tests__/scenarioStandardizationReviewService.test.ts
  • services/scenarioStandardizationReviewService.ts

Walkthrough

This PR adds a scenario standardization review feature: a Gemini-backed service generates French-usage feedback from role-play messages, new UI components display and navigate reviews, App.tsx wires review lifecycle/state, and ConversationHistory gains a user-audio toggle. Separately, it adds six Codex workflow agent TOML configs and a UserPromptSubmit hook script.

Changes

Scenario Standardization Review Feature

Layer / File(s) Summary
Review data types
types.ts
Adds ScenarioStandardizationItem and ScenarioStandardizationReview interfaces.
Review generation service
services/scenarioStandardizationReviewService.ts, __tests__/scenarioStandardizationReviewService.test.ts
Implements generateScenarioStandardizationReview, including Gemini client init, audio-to-inline-data conversion, prompt construction, abort handling, JSON response validation, and tests.
Review panel and summary overlay
components/ScenarioStandardizationReviewPanel.tsx, components/ScenarioReviewSummary.tsx
Adds loading/error/navigation UI for reviews and a modal that displays session summary with restart/done actions.
User audio recording toggle
components/ConversationHistory.tsx, __tests__/ConversationHistory.userAudioToggle.test.tsx
Adds showUserAudioToggle prop enabling per-message show/hide of recorded audio in MessageItem.
App.tsx scenario review wiring
App.tsx
Adds review state, message snapshot ref, start/regenerate helpers, lifecycle resets on practice start/restart/dismiss, and overlay rendering.

Codex Workflow Agents and Hook

Layer / File(s) Summary
Workflow agent configurations
.codex/agents/workflow-builder.toml, workflow-docs.toml, workflow-reviewer-cr.toml, workflow-reviewer-manual.toml, workflow-test-designer.toml, workflow-test-runner.toml
Adds six new agent TOML configs defining roles, descriptions, and detailed developer instructions for build, docs, CodeRabbit/manual review, test design, and test running workflows.
UserPromptSubmit hook
.codex/hooks.json, .codex/hooks/detect-workflow.cjs
Registers a hook that runs a detection script filtering prompts and injecting workflow reminder context for detected dev tasks.

Estimated code review effort: 4 (Complex) | ~60 minutes

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant App
  participant ReviewService as generateScenarioStandardizationReview
  participant Gemini as GoogleGenAI
  participant ScenarioReviewSummary

  User->>App: complete scenario practice
  App->>App: startScenarioReview(snapshot)
  App->>ReviewService: generate review(messages, scenarioName)
  ReviewService->>ReviewService: fetchAudioAsInlineData(audioUrl)
  ReviewService->>Gemini: generateContent(prompt, JSON schema)
  Gemini-->>ReviewService: response.text (JSON)
  ReviewService-->>App: ScenarioStandardizationReview
  App->>ScenarioReviewSummary: render overlay with review
  User->>ScenarioReviewSummary: Restart or Done
  ScenarioReviewSummary-->>App: onRestart/onDismiss
  App->>App: revoke audio URLs, reset state
Loading

Possibly related PRs

  • CodeWithOz/parle#1: Shares scenario-practice mode wiring and state in App.tsx that this PR extends with review overlay logic.
  • CodeWithOz/parle#30: Both modify the practice-mode flow in App.tsx, with overlapping gating logic around practice UX.

Poem

A rabbit reviews each spoken phrase,
"Standard French" it gently displays. 🐇
Toggle the audio, hear it once more,
Restart the scene, or head for the door.
New agents hop in to build, test, and write—
Carrots for all through the workflow's light! 🥕

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main change: adding a role-play audio review workflow.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch roleplay-audio-review

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
parle d7487a0 Commit Preview URL

Branch Preview URL
Jul 08 2026, 09:22 AM

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jul 8, 2026

Copy link
Copy Markdown
Contributor

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
parle-personal d7487a0 Commit Preview URL

Branch Preview URL
Jul 08 2026, 09:23 AM

@CodeWithOz
CodeWithOz marked this pull request as ready for review July 8, 2026 09:04

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In @.codex/hooks.json:
- Line 8: The hooks configuration contains a machine-specific absolute path in
the command for detect-workflow.cjs, which should be made portable. Update the
command in hooks.json to use the same relative invocation pattern used by the
.claude/settings.json equivalent, and verify the detect-workflow.cjs hook still
resolves correctly from the repository root.

In `@App.tsx`:
- Around line 191-236: Scenario review generation is missing abort handling and
stale-response protection, so older in-flight results can overwrite newer state.
Update startScenarioReview and regenerateScenarioReview to create/pass an
AbortController signal into generateScenarioStandardizationReview, and guard all
.then/.catch/.finally state updates with a request token check like
requestIdRef.current so only the latest review request can win. Also abort any
pending scenario review request in handleDismissScenarioSummary and
handleRestartScenarioFromSummary, and apply the same pattern consistently where
the review flow is triggered.

In `@components/ScenarioReviewSummary.tsx`:
- Around line 83-88: The “Done” action in ScenarioReviewSummary should be
disabled while isReviewLoading is true, just like the “Restart Scenario”
control. Update the button in ScenarioReviewSummary to respect the loading state
and prevent onDismiss from firing during an in-flight
generateScenarioStandardizationReview request, using the existing
isReviewLoading prop/state and the same disabled/guard pattern already used for
the restart flow.

In `@services/scenarioStandardizationReviewService.ts`:
- Around line 14-18: The initialization fallback in the GoogleGenAI setup is
invalid because calling GoogleGenAI without new will always fail and mask the
original error. Remove the fallback invocation in
scenarioStandardizationReviewService and keep only the constructor-based
initialization in the try block, using the GoogleGenAI symbol directly so any
real initialization issue is surfaced instead of being hidden.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 4825c256-1cd8-43c2-b23b-abe5fd41d5b6

📥 Commits

Reviewing files that changed from the base of the PR and between c58b6fc and 6a8a6fa.

📒 Files selected for processing (16)
  • .codex/agents/workflow-builder.toml
  • .codex/agents/workflow-docs.toml
  • .codex/agents/workflow-reviewer-cr.toml
  • .codex/agents/workflow-reviewer-manual.toml
  • .codex/agents/workflow-test-designer.toml
  • .codex/agents/workflow-test-runner.toml
  • .codex/hooks.json
  • .codex/hooks/detect-workflow.cjs
  • App.tsx
  • __tests__/ConversationHistory.userAudioToggle.test.tsx
  • __tests__/scenarioStandardizationReviewService.test.ts
  • components/ConversationHistory.tsx
  • components/ScenarioReviewSummary.tsx
  • components/ScenarioStandardizationReviewPanel.tsx
  • services/scenarioStandardizationReviewService.ts
  • types.ts

Comment thread .codex/hooks.json Outdated
Comment thread App.tsx
Comment on lines +83 to +88
<button
onClick={onDismiss}
className="py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl font-medium transition-colors"
>
Done
</button>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

"Done" button isn't disabled during isReviewLoading, unlike "Restart Scenario".

This lets a user dismiss the summary while generateScenarioStandardizationReview is still fetching/generating in the background — compounding the missing-cancellation issue flagged in App.tsx (startScenarioReview/regenerateScenarioReview don't create/pass an AbortSignal). Once App.tsx wires cancellation, disabling this button too would prevent the in-flight request from continuing to burn network/audio-fetch cost after the user has already left.

🔧 Proposed fix
             <button
               onClick={onDismiss}
+              disabled={isReviewLoading}
-              className="py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl font-medium transition-colors"
+              className="py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
               Done
             </button>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<button
onClick={onDismiss}
className="py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl font-medium transition-colors"
>
Done
</button>
<button
onClick={onDismiss}
disabled={isReviewLoading}
className="py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
Done
</button>
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@components/ScenarioReviewSummary.tsx` around lines 83 - 88, The “Done” action
in ScenarioReviewSummary should be disabled while isReviewLoading is true, just
like the “Restart Scenario” control. Update the button in ScenarioReviewSummary
to respect the loading state and prevent onDismiss from firing during an
in-flight generateScenarioStandardizationReview request, using the existing
isReviewLoading prop/state and the same disabled/guard pattern already used for
the restart flow.

Comment thread services/scenarioStandardizationReviewService.ts Outdated
@CodeWithOz
CodeWithOz merged commit 2057b4b into main Jul 8, 2026
5 checks passed
@CodeWithOz
CodeWithOz deleted the roleplay-audio-review branch July 8, 2026 09:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant