@shellui/core 0.2.0 → 0.3.0-beta.1

package/src/routes/hooks/useNavigationItems.ts

@@ -1,21 +1,31 @@
 import { useMemo } from 'react';
 import { useConfig } from '../../features/config/useConfig';
+import { useAuth } from '../../features/auth/hooks/useAuth';
 import {
+  filterNavigationForAuthState,
   flattenNavigationItems,
   getBaseUrlWithoutHash,
   getHashPathFromUrl,
   getNavPathPrefix,
   isHashRouterNavItem,
 } from '../../features/layouts/utils';
+import { useSettings } from '../../features/settings/hooks/useSettings';
 import { useLocation } from 'react-router';
 
 export function useNavigationItems() {
   const { config } = useConfig();
+  const { isAuthenticated } = useAuth();
+  const { settings } = useSettings();
   const location = useLocation();
 
   const navigationItems = useMemo(() => {
-    return flattenNavigationItems(config?.navigation ?? []);
-  }, [config]);
+    const authAndDevFilteredNavigation = filterNavigationForAuthState(
+      config?.navigation ?? [],
+      isAuthenticated,
+      settings.developerFeatures.enabled,
+    );
+    return flattenNavigationItems(authAndDevFilteredNavigation);
+  }, [config?.navigation, isAuthenticated, settings.developerFeatures.enabled]);
 
   const navigationItem = useMemo(() => {
     return navigationItems.find((item) => {
@@ -29,6 +39,10 @@ export function useNavigationItems() {
     () => navigationItems.find((item) => item.path === '' || item.path === '/'),
     [navigationItems],
   );
+  const isRootFallback = useMemo(
+    () => !navigationItem && Boolean(rootItem) && location.pathname !== '/',
+    [navigationItem, rootItem, location.pathname],
+  );
 
   /**
    * Constructs the final URL for the iframe based on the navigation item and the pathname.
@@ -39,7 +53,7 @@ export function useNavigationItems() {
   const url = useMemo(() => {
     const pathname = location.pathname;
 
-    const useRootFallback = !navigationItem && rootItem && pathname !== '/';
+    const useRootFallback = isRootFallback;
     const actualNavItem = navigationItem ?? (useRootFallback ? rootItem : null);
 
     if (!actualNavItem) {
@@ -72,7 +86,7 @@ export function useNavigationItems() {
       }
     }
     return finalUrl;
-  }, [navigationItem, rootItem, location.pathname]);
+  }, [navigationItem, rootItem, location.pathname, isRootFallback]);
 
   return {
     url: url,
@@ -80,5 +94,6 @@ export function useNavigationItems() {
     currentItem: navigationItem || rootItem,
     navigationItem: navigationItem || rootItem,
     navigationItems: navigationItems,
+    isRootFallback,
   };
 }

package/src/routes/routes.tsx

@@ -16,6 +16,25 @@ const CookiePreferencesView = lazy(() =>
     default: m.CookiePreferencesView,
   })),
 );
+const LoginView = lazy(() =>
+  import('../features/auth/components/LoginView').then((m) => ({ default: m.LoginView })),
+);
+const OAuthCallbackView = lazy(() =>
+  import('../features/auth/components/OAuthCallbackView').then((m) => ({
+    default: m.OAuthCallbackView,
+  })),
+);
+const AdminView = lazy(() =>
+  import('../features/admin/AdminView').then((m) => ({ default: m.AdminView })),
+);
+const LegalDocumentView = lazy(() =>
+  import('../features/legal/LegalDocumentView').then((m) => ({ default: m.LegalDocumentView })),
+);
+const LegalDocumentsIndexView = lazy(() =>
+  import('../features/legal/LegalDocumentsIndexView').then((m) => ({
+    default: m.LegalDocumentsIndexView,
+  })),
+);
 const NavigationItemRoute = lazy(() =>
   import('./components/NavigationItemRoute').then((m) => ({ default: m.NavigationItemRoute })),
 );
@@ -27,6 +46,11 @@ const NotFoundView = lazy(() =>
 );
 
 export const createRoutes = (config: ShellUIConfig): RouteObject[] => {
+  const configuredAdminPathname = config.backend?.adminPathname?.trim();
+  const adminPath =
+    configuredAdminPathname && configuredAdminPathname.startsWith('/')
+      ? configuredAdminPathname
+      : urls.admin;
   const routes: RouteObject[] = [
     {
       path: '/',
@@ -51,6 +75,69 @@ export const createRoutes = (config: ShellUIConfig): RouteObject[] => {
             </Suspense>
           ),
         },
+        {
+          // Login route
+          path: urls.login.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LoginView />
+            </Suspense>
+          ),
+        },
+        {
+          // OAuth callback route (frontend receives code, then exchanges via backend).
+          path: urls.loginCallback.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <OAuthCallbackView />
+            </Suspense>
+          ),
+        },
+        {
+          path: urls.legalDocuments.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LegalDocumentsIndexView />
+            </Suspense>
+          ),
+        },
+        {
+          path: urls.legalPrivacyPolicy.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LegalDocumentView />
+            </Suspense>
+          ),
+        },
+        {
+          path: urls.legalTermsOfService.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LegalDocumentView />
+            </Suspense>
+          ),
+        },
+        {
+          path: urls.legalNotice.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LegalDocumentView />
+            </Suspense>
+          ),
+        },
+        {
+          path: urls.legalDataProcessingAgreement.replace(/^\//, ''),
+          element: (
+            <Suspense fallback={<RouteFallback />}>
+              <LegalDocumentView />
+            </Suspense>
+          ),
+        },
+        {
+          // Admin route
+          path: `${adminPath.replace(/^\//, '')}/*`,
+          element: <AdminView />,
+        },
         {
           // Catch-all route
           path: '*',