Display permission error instead of blank page in transcription interfaces

[Copilot]

Transcription interfaces (/transcribe and /transcribe-simple) render a blank white page when users lack permissions. Other interfaces display error messages.

Changes

• Added utilities/renderPermissionError.js: Shared utility for rendering styled permission errors with navigation links
• Updated interfaces/transcription/index.js: Replace this.remove() with renderPermissionError() call in authgate
• Updated components/simple-transcription/index.js: Replace this.remove() with renderPermissionError() call in authgate

Before/After

// Before: Removes element, leaving blank page
async authgate() {
  if (!CheckPermissions.checkViewAccess("ANY", "CONTENT")) {
    this.remove()
    return
  }
  // ...
}

// After: Displays styled error message
async authgate() {
  if (!CheckPermissions.checkViewAccess("ANY", "CONTENT")) {
    this.renderPermissionError()
    return
  }
  // ...
}

Users now see "Permission Denied" heading with explanation and navigation options (Back to Project / Go to Home) instead of a blank page.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Loading Projects Without Correct Permissions in Transcribe</issue_title>
<issue_description>Other interfaces and components warn that the user does not have the appropriate permissions. The transcription interface just gives a blank white page.

</issue_description>

<agent_instructions>confirm correct behavior at /transcribe and/transcribe-simple</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes Loading Projects Without Correct Permissions in Transcribe #362

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[github-actions]

🚀 Deployed on https://6941b14e3c548753b4d22662--tpen-interfaces-preview.netlify.app