refactor(console): add prefix to pv path

packages/console/src/containers/ConsoleContent/index.tsx

@@ -14,8 +14,8 @@ function ConsoleContent() {
  const { scrollableContent } = useOutletContext<AppContentOutletContext>();
  const routeObjects = useConsoleRoutes();
  const routes = useRoutes(routeObjects);
- usePlausiblePageview(routeObjects);
 
+ usePlausiblePageview(routeObjects, ':tenantId');
  // Use this hook here to make sure console listens to user tenant scope changes.
  useTenantScopeListener();
 

packages/console/src/hooks/use-plausible-pageview.ts

@@ -8,7 +8,13 @@ import { getRoutePattern } from '@/utils/route';
 
 const log = debug('usePlausiblePageview');
 
-export const usePlausiblePageview = (routes: RouteObject[]) => {
+/**
+ * Track pageview with Plausible by listening to route changes.
+ *
+ * @param routes An array of route objects to match the current route against.
+ * @param prefix A prefix to prepend to the route pattern.
+ */
+export const usePlausiblePageview = (routes: RouteObject[], prefix: string) => {
  const { pathname } = useLocation();
 
  useEffect(() => {
@@ -19,8 +25,8 @@ export const usePlausiblePageview = (routes: RouteObject[]) => {
  // https://plausible.io/docs/custom-locations#3-specify-a-custom-location
  window.plausible?.('pageview', {
  u:
- appendPath(new URL('https://' + plausibleDataDomain), routePattern).href +
+ appendPath(new URL('https://' + plausibleDataDomain), prefix, routePattern).href +
  window.location.search,
  });
- }, [pathname, routes]);
+ }, [pathname, prefix, routes]);
 };

packages/console/src/onboarding/index.tsx

@@ -43,7 +43,7 @@ export function OnboardingApp() {
  const matched = useMatch(welcomePathname);
  const routes = useRoutes(routeObjects);
 
- usePlausiblePageview(routeObjects);
+ usePlausiblePageview(routeObjects, 'onboarding');
 
  useEffect(() => {
  setThemeOverride(Theme.Light);

packages/console/src/pages/Profile/index.tsx

@@ -34,7 +34,7 @@ function Profile() {
  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
  const { navigate } = useTenantPathname();
  const childrenRoutes = useRoutes(profile);
- usePlausiblePageview(profile);
+ usePlausiblePageview(profile, 'profile');
 
  const api = useStaticApi({ prefixUrl: adminTenantEndpoint, resourceIndicator: meApi.indicator });
  const fetcher = useSwrFetcher<ConnectorResponse[]>(api);