feat: add in-platform transcript editor to the videos page

[abhalsod-sonata]

Adds an in-platform transcript editor to the Studio videos page. Course authors can
open "Edit transcript" from a transcript row's action menu and edit the SRT in the
browser instead of the download → edit locally → re-upload round-trip.

What's included:

• New transcript-editor/ module: cue-by-cue text editing with SRT parsing/validation
  (srtUtils), invalid-SRT alerting, debounced auto-save, and a video preview with
  click-to-seek + active-cue highlighting and auto-scroll.
• The video Info content moves under the preview (InfoTab via a new
  infoModalContentUnderPreview slot on FileTable/InfoModal), and the info sidebar
  lists transcripts directly - this intentionally supersedes the previous tabbed
  sidebar layout for videos.
• The row action menu label for videos changes from "Info" to "Info and
  transcripts" (FileMenu, MoreInfoColumn); two existing tests that asserted the
  old label on video fixtures are updated.
• Saving a transcript re-uploads the SRT through the existing /transcript_upload/
  endpoint; the UI distinguishes replace (200) from create (201) - see dependency
  below.

Impacted user roles: Course Authors (primary); Developers (new
transcript-editor module and the infoModalContentUnderPreview extension point on
the generic file table).

Screen recording:

• Before:

Before.mp4

• After

After.mp4

Supporting information

• Depends on feat: return 200 when a transcript upload replaces an existing language openedx-platform#39038 (200-on-replace for
  /transcript_upload/) - please merge that first; without it the editor cannot
  distinguish replace from create.
• Product review: Transcript Editor - accepted product proposal (approved via the Open edX product review process; this repo's maintainer agreed to maintain the feature).

Testing instructions

Automated:

npm ci
npx jest src/files-and-videos --coverage=false
# 20 suites / 229 tests expected green

Manual (tutor dev):

1. Check out feat: return 200 when a transcript upload replaces an existing language openedx-platform#39038 in your platform (or any branch
   containing it) and run Studio.
2. npm run dev in this repo (port 2001); open a course with videos that have
   transcripts → Videos page.
3. Row ⋮ menu shows "Info and transcripts" (videos only; Files page unchanged);
   the info modal shows the video preview with Info content below it and
   transcripts listed in the sidebar.
4. Transcript row menu → Edit transcript: edit a cue, watch auto-save, Save;
   reopen to confirm persistence; click cues to seek the preview.
5. Paste invalid SRT content → validation alert, save blocked.
6. Network tab: re-saving an existing language returns 200; adding a new language
   returns 201.

Other information

• Port provenance & adaptations (for reviewers comparing against the downstream
  PRs): rebased onto current master, which required - merging with the new
  permissions gating in FileTable/MoreInfoColumn; porting one-line changes into
  the TS-renamed FileMenu.tsx and messages.ts files; re-applying the
  injectIntl → useIntl migration on top of the reworked Transcript.jsx; and
  keeping upstream's key={idx} fix in TranscriptTab.
• CourseVideosTable still passes activeTab/setActiveTab into the sidebar factory
  for compatibility; the new sidebar ignores them. Happy to remove that plumbing here
  or in a follow-up if preferred.
• Playback: seekTo() guards the play() promise and ignores AbortError
  (interrupted play on rapid cue-seek/pause/unmount), logging anything else.
• Accessibility: built from Paragon components (Menu, AlertModal, form controls);
  no dedicated audit yet - feedback welcome, especially on cue-list keyboard
  navigation.
• i18n: all new messages include translator descriptions; existing message ids are
  unchanged so downstream translations carry over.

Best Practices Checklist

• Any new files are using TypeScript (.ts, .tsx).
  - The new transcript-editor/ module is ported as .jsx/.js to stay
  reviewably close to the downstream original. Happy to convert
  TranscriptEditor/srtUtils to TS in this PR if preferred - say the word.
• Avoid propTypes and defaultProps in any new or modified code.
  - Ported/modified components follow the surrounding files' existing
  PropTypes style; will drop them as part of the TS conversion above if requested.
• Tests should use the helpers in src/testUtils.tsx (initializeMocks)
  - Changes extend the existing videos-page suites, which predate
  initializeMocks; kept their established setup for consistency.
• Do not add new fields to the Redux state/store. (No slice/thunk changes;
  editor state is component-local.)
• Use React Query to load data from REST APIs.
  - Transcript content is fetched via the page's existing axios helpers
  (videos-page/data/api.js); this page has not been migrated to React Query yet.
• All new i18n messages in messages files have a description for translators.
• Avoid ../ in import paths; use @src for parent-folder imports.

Relevant backend PR

• feat: return 200 when a transcript upload replaces an existing language openedx-platform#39038

[openedx-webhooks]

Thanks for the pull request, @abhalsod-sonata!

This repository is currently maintained by @bradenmacdonald.

Once you've gone through the following steps feel free to tag them in a comment and let them know that your changes are ready for engineering review.

🔘 Get product approval

If you haven't already, check this list to see if your contribution needs to go through the product review process.

• If it does, you'll need to submit a product proposal for your contribution, and have it reviewed by the Product Working Group.
  • This process (including the steps you'll need to take) is documented here.
• If it doesn't, simply proceed with the next step.

🔘 Provide context

To help your reviewers and other members of the community understand the purpose and larger context of your changes, feel free to add as much of the following information to the PR description as you can:

• Dependencies

  This PR must be merged before / after / at the same time as ...

• Blockers

  This PR is waiting for OEP-1234 to be accepted.

• Timeline information

  This PR must be merged by XX date because ...

• Partner information

  This is for a course on edx.org.

• Supporting documentation
• Relevant Open edX discussion forum threads

🔘 Submit a signed contributor agreement (CLA)

⚠️ We ask all contributors to the Open edX project to submit a signed contributor agreement or indicate their institutional affiliation.
Please see the CONTRIBUTING file for more information.

If you've signed an agreement in the past, you may need to re-sign.
See The New Home of the Open edX Codebase for details.

Once you've signed the CLA, please allow 1 business day for it to be processed.
After this time, you can re-run the CLA check by adding a comment below that you have signed it.
If the CLA check continues to fail, you can tag the @openedx/cla-problems team in a comment for further assistance.

🔘 Get a green build

If one or more checks are failing, continue working on your changes until this is no longer the case and your build turns green.

Details

---

Where can I find more information?

If you'd like to get more details on all aspects of the review process for open source pull requests (OSPRs), check out the following resources:

• Overview of Review Process for Community Contributions
• Pull Request Status Guide
• Making changes to your pull request

When can I expect my changes to be merged?

Our goal is to get community contributions seen and reviewed as efficiently as possible.

However, the amount of time that it takes to review and merge a PR can vary significantly based on factors such as:

• The size and impact of the changes that it introduces
• The need for product review
• Maintenance status of the parent repository

💡 As a result it may take up to several weeks or months to complete a review and merge your PR.

[mphilbrick211]

Hi @abhalsod-sonata! in order to get your CLA check to turn green, please have your manager reach out to oscm@axim.org to have you added to our existing entity agreement.

Thank you!

[abhalsod-sonata]

Hi @abhalsod-sonata! in order to get your CLA check to turn green, please have your manager reach out to oscm@axim.org to have you added to our existing entity agreement.

Thank you!

CLA check resolved!

[abhalsod-sonata]

@bradenmacdonald
Can you please review and approve this PR?

[bradenmacdonald]

@abhalsod-sonata Thanks, this is cool!

I'd definitely prefer to have the new files converted to TypeScript and ideally to src/testUtils.tsx too.

Since you've expressed that it's helpful to keep the code in sync with your existing code, could you not apply the same changes to the existing codebase as well, so they stay in sync?

[abhalsod-sonata]

@abhalsod-sonata Thanks, this is cool!

I'd definitely prefer to have the new files converted to TypeScript and ideally to src/testUtils.tsx too.

Since you've expressed that it's helpful to keep the code in sync with your existing code, could you not apply the same changes to the existing codebase as well, so they stay in sync?

@bradenmacdonald
Thanks! done - the transcript-editor module is now TypeScript, with PropTypes/defaultProps removed, and the new TranscriptEditor.test.tsx use initializeMocks from src/testUtils.tsx.

[abhalsod-sonata]

@mphilbrick211, I’m unable to add @bradenmacdonald as a reviewer. Could you please add them to this PR?

[mphilbrick211]

@mphilbrick211, I’m unable to add @bradenmacdonald as a reviewer. Could you please add them to this PR?

All set! @bradenmacdonald could you re-enable the checks to run?

[codecov]

Codecov Report

❌ Patch coverage is 91.82390% with 39 lines in your changes missing coverage. Please review.
✅ Project coverage is 95.85%. Comparing base (16e19f1) to head (5addd72).
⚠️ Report is 6 commits behind head on master.

Files with missing lines	Patch %	Lines
...videos-page/transcript-editor/TranscriptEditor.tsx	94.42%	14 Missing ⚠️
...-videos/videos-page/info-sidebar/TranscriptTab.jsx	90.09%	10 Missing ⚠️
...s-page/info-sidebar/transcript-item/Transcript.jsx	71.42%	5 Missing and 1 partial ⚠️
...ge/info-sidebar/transcript-item/TranscriptMenu.jsx	42.85%	4 Missing ⚠️
...ge/info-sidebar/transcript-item/LanguageSelect.jsx	86.66%	2 Missing ⚠️
src/files-and-videos/generic/FileTable.jsx	92.30%	1 Missing ⚠️
src/files-and-videos/generic/InfoModal.jsx	0.00%	1 Missing ⚠️
...d-videos/videos-page/transcript-editor/srtUtils.ts	97.82%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3215      +/-   ##
==========================================
- Coverage   95.92%   95.85%   -0.08%     
==========================================
  Files        1397     1401       +4     
  Lines       33581    34067     +486     
  Branches     7947     8075     +128     
==========================================
+ Hits        32214    32656     +442     
- Misses       1308     1352      +44     
  Partials       59       59              

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[bradenmacdonald]

Thanks! This is really cool. I did find a bunch of issues that we should clean up before merging, but feel free to push back on anything that doesn't make sense or is out of scope.

1. It seems odd that you can edit an existing transcript but not create one from scratch. Should it be possible to create a blank transcript and then fill it out?
2. When the transcript fails to download, it says "Unable to save transcript" which is a confusing error message. It should have a clear, distinct error message for this case.
   
3. Nit/optional: The formatting of the timestamps uses a comma , as the decimal point marker, which is incorrect for English-speaking countries and looks strange to me. I think it should use . or be based on the user's locale.
   
4. The description says "Depends on feat: return 200 when a transcript upload replaces an existing language openedx-platform#39038", but I can't see in the diff where that would make a difference or where that return code is used.
5. There are a lot more minor issues that Claude pointed out to me, which I haven't bothered to re-state here for now. I suggest you get Claude or another AI to review the PR and work through any important issues it reports and then ping me for a final review.

[abhalsod-sonata]

Thanks! This is really cool. I did find a bunch of issues that we should clean up before merging, but feel free to push back on anything that doesn't make sense or is out of scope.

1. It seems odd that you can edit an existing transcript but not create one from scratch. Should it be possible to create a blank transcript and then fill it out?
2. When the transcript fails to download, it says "Unable to save transcript" which is a confusing error message. It should have a clear, distinct error message for this case.
   
3. Nit/optional: The formatting of the timestamps uses a comma , as the decimal point marker, which is incorrect for English-speaking countries and looks strange to me. I think it should use . or be based on the user's locale.
   
4. The description says "Depends on feat: return 200 when a transcript upload replaces an existing language openedx-platform#39038", but I can't see in the diff where that would make a difference or where that return code is used.
5. There are a lot more minor issues that Claude pointed out to me, which I haven't bothered to re-state here for now. I suggest you get Claude or another AI to review the PR and work through any important issues it reports and then ping me for a final review.

Thanks for the thorough review! Worked through everything - all inline comments are addressed in the latest commit; per-thread replies below. On your numbered points:

1. Creating a transcript from scratch - agreed it's a natural extension, but I'd like to keep it out of this PR: the accepted product proposal covers editing existing transcripts (creation still goes through upload / "Add transcript"), and creating a first transcript from the editor also needs the videos list refreshed after save, which the editor currently doesn't touch. I'll open a follow-up issue for it if that works for you.

2. Load failure message - fixed. Fetch failures now show a distinct "Unable to load transcript, please try again." message (loadFailedLabel), with a test asserting it's different from the save error.

3. Comma vs dot in timestamps - pushing back gently on this one: the comma is the SRT format's millisecond separator, and the fields edit the literal timestamps that end up in the .srt file, so showing dots would mismatch what gets saved. The inputs do accept . while typing and normalize it to ,. Happy to revisit with locale-aware display if you feel strongly.

4. "Depends on #39038" - you're right, and I've corrected both PR descriptions. The frontend never branches on the response code (uploadTranscript just awaits the POST; any 2xx is success), so there's no hard dependency. #39038 makes the endpoint's semantics accurate (200 replace / 201 create) for API consumers, but this editor works against either.

5. Done - ready for your final review.

[bradenmacdonald]

1. Creating a transcript from scratch - agreed it's a natural extension, but I'd like to keep it out of this PR: the accepted product proposal covers editing existing transcripts (creation still goes through upload / "Add transcript"), and creating a first transcript from the editor also needs the videos list refreshed after save, which the editor currently doesn't touch. I'll open a follow-up issue for it if that works for you.

Yep, no problem to leave that as a future enhancement.

3. Comma vs dot in timestamps - pushing back gently on this one: the comma is the SRT format's millisecond separator, and the fields edit the literal timestamps that end up in the .srt file, so showing dots would mismatch what gets saved. The inputs do accept . while typing and normalize it to ,. Happy to revisit with locale-aware display if you feel strongly.

I do think it would be a good future enhancement. Using '.' is more natural for English speakers, and I don't think the user really cares about the detail of the SRT format. However, it's completely fine to leave as is for this PR.

I'll review the other changes later; for now, I've set the tests to run again. Please make sure the test coverage checks are passing, as I can't merge otherwise.

[bradenmacdonald]

Thanks for those changes! It looks good to me now, but please check the coverage report and get the coverage checks passing, so I can merge it.

Note that if there are some things which aren't worth covering or are not possible to test properly, you can use istanbul ignore comments.

[abhalsod-sonata]

@bradenmacdonald - pushed a commit covering the lines Codecov flagged (add-transcript form flow, editor interactions, transcript menu, row replace/validation). The only istanbul ignore markers are on branches with no UI entry point - disabled-button guards and default parameters that callers always override. The workflows are waiting on maintainer approval to run; could you approve them so Codecov can report? Should be good to merge once it's green.