Require confirmation to delete WebVTT

[kdid]

Summary

Presents users with a confirmation message and button when they delete WebVTT content.

Specific Changes in this PR

• Require confirmation before deleting WebVTT content in the UI associated with Audio and Video files

Version bump required by the PR

See Semantic Versioning 2.0.0 for help discerning which is required.

• Patch
• Minor
• Major

Steps to Test

• Go to a work page in Meadow where a file set has existing WebVTT content
• Click the "Edit WebVTT structure" button
• Click "Delete WebVTT"
• Confirm you are presented with a warning message asking if you are sure you want to delete.
• Click "Yes, delete"
• Confirm the content is deleted
• Repeat above steps, except instead of confirming, click "Cancel"
• Confirm the content is not deleted

🚀 Deployment Notes

Note - if you check any of these boxes go to the (always open) main <- staging PR and add detailed notes and instructions to help out others who may end up deploying your changes to production

• Backward compatible API changes
  • Database Schema changes
  • GraphQL API
  • Elasticsearch API
  • Ingest Sheet
  • CSV metadata export/update API
  • Shared Links export API
• Backwards-incompatible API changes
  • Database Schema changes
  • GraphQL API
  • Elasticsearch API
  • Ingest Sheet
  • CSV metadata export/update API
  • Shared Links export API
• Requires data migration
• Requires database triggers disabled during deployment/migration
• Requires reindex
• Terraform changes
  • Adds/requires new or changed Terraform variables
• Pipeline configuration changes (requires mix meadow.pipeline.setup run)
• Requires new variable added to miscellany
• Specific deployment synchronization instructions with other apps/API's
• Other specific instructions/tasks

Tested/Verified

• End users/stakeholders

[mathewjordan]

I really like this!

Not a big deal, but one thing I think we could add. Take or leave it? On line ~124, we could add this to hide away the textarea during the confirmation.

<textarea
  className="textarea"
  onChange={handleChange}
  placeholder="Enter WebVTT text here"
  ref={textAreaRef}
  rows="10"
- style={{ whiteSpace: "pre-wrap" }}
+ style={{
+  whiteSpace: "pre-wrap",
+  display: confirmDelete ? "none" : "block",
+ }}
  value={webVttValue}
/>

[kdid]

@mathewjordan - this is updated. Now looks like this 👇 . Thanks!