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,