Skip to content

Add support for app deployment under sub-paths #577

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 8 commits into
base: develop
Choose a base branch
from

Conversation

creativeindustriesgroup
Copy link
Contributor

@creativeindustriesgroup creativeindustriesgroup commented May 24, 2025

Overview

This pull request refactors the routing system in the frontend to allow the application to be hosted under sub-paths such as example.com/somerandomdir.

With this implementation, we can now install the applications under subdirectories rather than only at the root domain level.

Example:
The base directory /ticketing will be calculated from the VITE_FRONTEND_URL environment variable:
VITE_FRONTEND_URL=https://example.com/ticketing

The changes include separating route definitions and options, introducing a utility function for determining the base path, and updating relevant configurations and imports to align with the new structure.

Additional Info

Routing Refactor:

  • frontend/src/router.tsx: Refactored to export routes and options separately for clarity. Added getBasePath to dynamically determine the base path for the application based on an environment variable. [1] [2]
  • frontend/src/entry.client.tsx and frontend/src/entry.server.tsx: Updated to use the newly named routes and options exports instead of the previously named router constant. [1] [2] [3] [4] [5]
  • Updated frontend/src/App.tsx to enforce that the app is always accessed via the base path by redirecting users if the current path does not match the base path. This is required as react-router v6 no longer does this automatically as it did in v5.

Base Path Utility:

  • frontend/src/utilites/basePath.ts: Introduced a new function getBasePath to compute the base path dynamically based on the environment variable VITE_FRONTEND_URL. Includes fallback and error handling for invalid URLs.

Configuration Updates:

  • frontend/vite.config.ts: Updated the Vite configuration to use relative paths for assets by setting the base property to "./". This allows resource URI's such as /assets/* to change to /somebasedir/assets dynamically.

Reviews:

This is my first PR on the project! Hopefully all is well but feel free to drop a message if there is anything more I can do as I hope to contribute more in future.

Copy link
Contributor

github-actions bot commented May 24, 2025

All contributors have signed the CLA ✍️ ✅
Posted by the CLA Assistant Lite bot.

@daveearley
Copy link
Contributor

Thanks @creativeindustriesgroup! I'll test this soon

@creativeindustriesgroup
Copy link
Contributor Author

@daveearley I kept as a draft as theres still a few issues with this implementation. I think it is something to do with PHP in Docker.

Thanks, Joe Berry.

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.

2 participants