From a5d643345e1376cbabc257de32f3376aa9e4c92e Mon Sep 17 00:00:00 2001
From: gabalafou <gabriel@fouasnon.com>
Date: Fri, 18 Oct 2024 16:30:09 +0300
Subject: [PATCH] Add config option REACT_APP_URL_BASENAME

---
 .env.example        |  5 +++++
 src/App.tsx         |  6 ++++--
 src/preferences.tsx | 11 ++++++++++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/.env.example b/.env.example
index 2ae183ae..06203a2f 100644
--- a/.env.example
+++ b/.env.example
@@ -22,6 +22,11 @@ REACT_APP_SHOW_AUTH_BUTTON=true
 REACT_APP_LOGOUT_PAGE_URL=http://localhost:8080/conda-store/logout?next=/
 REACT_APP_ROUTER_TYPE=browser
 
+# If you need to mount the React app at some URL path other than "/". This value
+# is passed directly to React Router, see:
+# https://reactrouter.com/en/main/routers/create-browser-router#optsbasename
+# REACT_APP_URL_BASENAME="/conda-store"
+
 # If you want to use a version other than the pinned conda-store-server version
 # Set the CONDA_STORE_SERVER_VERSION to the package version that you want
 # CONDA_STORE_SERVER_VERSION="2024.3.1"
diff --git a/src/App.tsx b/src/App.tsx
index e62cec36..7d534c14 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -68,10 +68,12 @@ export class App<
   // }
 
   render(): React.ReactNode {
+    const { routerType, urlBasename: basename } = this.state.pref;
+
     const router =
-      this.state.pref.routerType === "memory"
+      routerType === "memory"
         ? createMemoryRouter(routes, { initialEntries: ["/"] })
-        : createBrowserRouter(routes);
+        : createBrowserRouter(routes, { basename });
 
     return (
       <PrefContext.Provider value={this.state.pref}>
diff --git a/src/preferences.tsx b/src/preferences.tsx
index 34d0ba94..a0834c16 100644
--- a/src/preferences.tsx
+++ b/src/preferences.tsx
@@ -15,6 +15,10 @@ export interface IPreferences {
   // the URL routes in the browser address bar are for JupyterLab, not for
   // conda-store-ui.
   routerType: "browser" | "memory";
+
+  // urlBasename - Defaults to "/" but can be changed if the app needs to be
+  // mounted at a different URL path, such as "/conda-store"
+  urlBasename: string;
 }
 
 const { condaStoreConfig = {} } =
@@ -61,7 +65,12 @@ export const prefDefault: Readonly<IPreferences> = {
   routerType:
     process.env.REACT_APP_ROUTER_TYPE ??
     condaStoreConfig.REACT_APP_ROUTER_TYPE ??
-    "browser"
+    "browser",
+
+  urlBasename:
+    process.env.REACT_APP_URL_BASENAME ??
+    condaStoreConfig.REACT_APP_URL_BASENAME ??
+    "/"
 };
 
 export class Preferences implements IPreferences {