diff --git a/app/src/ui/Admin.tsx b/app/src/ui/Admin.tsx
index 766b56a8..c62eedce 100644
--- a/app/src/ui/Admin.tsx
+++ b/app/src/ui/Admin.tsx
@@ -16,6 +16,11 @@ export type BkndAdminConfig = {
* @default `/`
*/
basepath?: string;
+ /**
+ * Sub-path for the Admin UI within the base path
+ * @default ``
+ */
+ admin_basepath?: string;
/**
* Path to return to when clicking the logo
* @default `/`
diff --git a/app/src/ui/components/wouter/Link.tsx b/app/src/ui/components/wouter/Link.tsx
index 4c5238d6..051364dc 100644
--- a/app/src/ui/components/wouter/Link.tsx
+++ b/app/src/ui/components/wouter/Link.tsx
@@ -1,5 +1,6 @@
import { type LinkProps, Link as WouterLink, useRouter } from "wouter";
import { useEvent } from "../../hooks/use-event";
+import { useBkndOptions } from "ui/client/BkndProvider";
/*
* Transforms `path` into its relative `base` version
@@ -70,11 +71,13 @@ export function Link({
return false;
}
-
+ const bkndOptions = useBkndOptions();
+ const adminBasePath = bkndOptions?.admin_basepath ?? "";
const _href = props.href ?? props.to;
+
const href = router
.hrefs(
- _href[0] === "~" ? _href.slice(1) : router.base + _href,
+ _href[0] === "~" ? adminBasePath + _href.slice(1) : router.base + _href,
router, // pass router as a second argument for convinience
)
.replace("//", "/");
@@ -82,8 +85,9 @@ export function Link({
const active =
href.replace(router.base, "").length <= 1 ? href === absPath : isActive(absPath, href);
+ // console.log({ adminBasePath, _href, href, bkndOptions })
if (native) {
- return ;
+ return ;
}
const wouterOnClick = (e: any) => {
@@ -99,10 +103,11 @@ export function Link({
};
return (
+ // @ts-expect-error className is not typed on WouterLink
);
diff --git a/app/src/ui/lib/routes.ts b/app/src/ui/lib/routes.ts
index 46ed4fbe..a2b5bcc6 100644
--- a/app/src/ui/lib/routes.ts
+++ b/app/src/ui/lib/routes.ts
@@ -101,7 +101,7 @@ export function useNavigate() {
}
}
- const _url = options?.absolute ? `~/${basepath}${url}`.replace(/\/+/g, "/") : url;
+ const _url = options?.absolute ? `~/${app.options.basepath}/${app.options.admin_basepath}${url}`.replace(/\/+/g, "/") : url;
const state = {
...options?.state,
referrer: location,