Support setting Next.js basePath in Reflex config. (reflex-dev#1633)

- Tests.
- And sorted config in next.config.js template.

reflex/.templates/web/next.config.js

@@ -1,5 +1,6 @@
 module.exports = {
-  reactStrictMode: true,
+  basePath: "",
   compress: true,
+  reactStrictMode: true,
   trailingSlash: true,
 };

reflex/config.py

@@ -138,6 +138,9 @@ class Config:
     # The port to run the frontend on.
     frontend_port: int = 3000
 
+    # The path to run the frontend on.
+    frontend_path: str = ""
+
     # The port to run the backend on.
     backend_port: int = 8000
 

reflex/utils/prerequisites.py

@@ -21,7 +21,7 @@
 from redis import Redis
 
 from reflex import constants, model
-from reflex.config import get_config
+from reflex.config import Config, get_config
 from reflex.utils import console, path_ops, processes
 
 
@@ -214,23 +214,41 @@ def initialize_web_directory():
     next_config_file = os.path.join(constants.WEB_DIR, constants.NEXT_CONFIG_FILE)
 
     with open(next_config_file, "r") as file:
-        lines = file.readlines()
-        for i, line in enumerate(lines):
-            if "compress:" in line:
-                new_line = line.replace(
-                    "true", "true" if get_config().next_compression else "false"
-                )
-                lines[i] = new_line
+        next_config = file.read()
+        next_config = update_next_config(next_config, get_config())
 
     with open(next_config_file, "w") as file:
-        file.writelines(lines)
+        file.write(next_config)
 
     # Write the current version of distributed reflex package to a REFLEX_JSON."""
     with open(constants.REFLEX_JSON, "w") as f:
         reflex_json = {"version": constants.VERSION}
         json.dump(reflex_json, f, ensure_ascii=False)
 
 
+def update_next_config(next_config: str, config: Config) -> str:
+    """Update Next.js config from Reflex config. Is its own function for testing.
+
+    Args:
+        next_config: Content of next.config.js.
+        config: A reflex Config object.
+
+    Returns:
+        The next_config updated from config.
+    """
+    next_config = re.sub(
+        "compress: (true|false)",
+        f'compress: {"true" if config.next_compression else "false"}',
+        next_config,
+    )
+    next_config = re.sub(
+        'basePath: ".*?"',
+        f'basePath: "{config.frontend_path or ""}"',
+        next_config,
+    )
+    return next_config
+
+
 def remove_existing_bun_installation():
     """Remove existing bun installation."""
     console.debug("Removing existing bun installation.")

tests/test_config.py

@@ -46,6 +46,7 @@ def test_deprecated_params(base_config_values, param):
     [
         ("APP_NAME", "my_test_app"),
         ("FRONTEND_PORT", 3001),
+        ("FRONTEND_PATH", "/test"),
         ("BACKEND_PORT", 8001),
         ("API_URL", "https://mybackend.com:8000"),
         ("DEPLOY_URL", "https://myfrontend.com"),

tests/test_prerequites.py

@@ -0,0 +1,103 @@
+import pytest
+
+from reflex.config import Config
+from reflex.utils.prerequisites import update_next_config
+
+
+@pytest.mark.parametrize(
+    "template_next_config, reflex_config, expected_next_config",
+    [
+        (
+            """
+                module.exports = {
+                basePath: "",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+            Config(
+                app_name="test",
+            ),
+            """
+                module.exports = {
+                basePath: "",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+        ),
+        (
+            """
+                module.exports = {
+                basePath: "",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+            Config(
+                app_name="test",
+                next_compression=False,
+            ),
+            """
+                module.exports = {
+                basePath: "",
+                compress: false,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+        ),
+        (
+            """
+                module.exports = {
+                basePath: "",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+            Config(
+                app_name="test",
+                frontend_path="/test",
+            ),
+            """
+                module.exports = {
+                basePath: "/test",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+        ),
+        (
+            """
+                module.exports = {
+                basePath: "",
+                compress: true,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+            Config(
+                app_name="test",
+                frontend_path="/test",
+                next_compression=False,
+            ),
+            """
+                module.exports = {
+                basePath: "/test",
+                compress: false,
+                reactStrictMode: true,
+                trailingSlash: true,
+                };
+            """,
+        ),
+    ],
+)
+def test_update_next_config(template_next_config, reflex_config, expected_next_config):
+    assert (
+        update_next_config(template_next_config, reflex_config) == expected_next_config
+    )