Skip to content

Conversation

@devin-ai-integration
Copy link

@devin-ai-integration devin-ai-integration bot commented Jan 2, 2026

Summary

This PR migrates the frontend from Astro to a Vite + React Router single-page application (SPA). This change is required because Discord Activities require SPAs for proper functionality.

Key changes:

  • Replace Astro build tooling with Vite
  • Add React Router for client-side routing instead of Astro's file-based routing
  • Convert Astro pages (.astro files) to React page components
  • Remove Astro-specific components (MiniRouter, RoomLoaderAutomatic, AdminRoomEditPage) and replace with React Router equivalents
  • Update backend to serve Vite's build output (/assets instead of /_astro) and serve index.html for all frontend routes (SPA fallback)

Updates since last revision

  • Fixed assets routing bug: removed app.all("/assets/:unused", proxyDownstream) which was incorrectly proxying frontend assets to Broadcast Box instead of serving them from the static folder
  • Local testing performed with docker compose - basic routes (/, /room/{id}, /discord) render correctly

Review & Testing Checklist for Human

  • Test Discord Activity integration - This is the primary reason for the migration. Verify the app works correctly when embedded as a Discord Activity (hostname ending in .discordsays.com)
  • Test WebRTC room viewing - Navigate to /room/{roomId} and verify video streaming works. The Room.jsx component was modified to remove an Astro import
  • Test admin panel with basic auth - The admin routes now serve the same index.html as other routes. Verify basic auth still protects the admin API endpoints and the UI works
  • Test the "Publish" button on homepage - Note: RoomLaunch.jsx still uses location.href for navigation to /publish/:key which proxies to Broadcast Box. Verify this still works correctly
  • Test fullscreen mode - Add ?fullscreen=1 to a room URL and verify the fullscreen styling applies correctly

Recommended Test Plan

  1. Run npm install && npm run build in rtmediaproxy_frontend/
  2. Start the backend server and Broadcast Box via docker compose up
  3. Test each route: /, /room, /room/{id}, /discord, /admin, /admin/room/{id}
  4. If possible, test as a Discord Activity to verify the SPA requirement is satisfied

Local Testing Screenshots

Home page rendering correctly
Room page with "not found" message (expected - no room exists)
Discord page rendering

Notes

  • Link to Devin run: https://app.devin.ai/sessions/04a005efc4f14ae6bff6537b76c7e6a8
  • Requested by: Raymond / @javaarchive
  • Local testing confirmed basic routes render correctly with Pico CSS styling
  • WebRTC streaming was not tested due to Broadcast Box setup requirements
  • Some components (DiscordMagicRedirect, utils.js) still use location.href for redirects which causes full page reloads - this may be intentional for Discord context switching

- Replace Astro with Vite for build tooling
- Add React Router for client-side routing (SPA)
- Convert Astro pages to React Router pages
- Remove Astro-specific imports and components (MiniRouter, layouts)
- Update components to use React Router navigation (useNavigate, Link)
- Update backend to serve Vite build output (assets folder instead of _astro)
- Update backend to serve index.html for all frontend routes (SPA fallback)
- Update tsconfig.json for Vite compatibility

This change is required for Discord Activities which require SPAs.

Co-Authored-By: Raymond <20248577+javaarchive@users.noreply.github.com>
@devin-ai-integration
Copy link
Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment and CI monitoring

…downstream

Co-Authored-By: Raymond <20248577+javaarchive@users.noreply.github.com>
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