Route registry (#6600)

packages/coresandbox/src/index.ts

@@ -235,6 +235,16 @@ const applyConfig = (config: ConfigType) => {
     predicates: [ContentTypeCondition(['Document']), RouteCondition('/hello')],
   });
 
+  config.registerRoute({
+    type: 'route',
+    path: '/hello',
+    file: 'src/components/Views/NewsAndEvents/asd.tsx',
+    options: {
+      id: 'hello',
+      index: true,
+    },
+  });
+
   return config;
 };
 

packages/registry/news/6600.feature

@@ -0,0 +1 @@
+Added route registry. @sneridagh

packages/registry/src/index.ts

@@ -13,6 +13,7 @@ import type {
   UtilitiesConfig,
   ViewsConfig,
   WidgetsConfig,
+  ReactRouterRouteEntry,
 } from '@plone/types';
 
 export type ConfigData = {
@@ -22,6 +23,7 @@ export type ConfigData = {
   widgets: WidgetsConfig | Record<string, never>;
   addonReducers?: AddonReducersConfig;
   addonRoutes?: AddonRoutesConfig;
+  routes?: Array<ReactRouterRouteEntry>;
   slots: SlotsConfig | Record<string, never>;
   components: ComponentsConfig | Record<string, never>;
   utilities: UtilitiesConfig | Record<string, never>;
@@ -126,6 +128,14 @@ class Config {
     this._data.addonRoutes = addonRoutes;
   }
 
+  get routes() {
+    return this._data.routes;
+  }
+
+  set routes(routes) {
+    this._data.routes = routes;
+  }
+
   get slots() {
     return this._data.slots;
   }
@@ -494,6 +504,12 @@ class Config {
 
     return utilities;
   }
+
+  registerRoute(options: ReactRouterRouteEntry) {
+    const route = this._data.routes || [];
+    route.push(options);
+    this._data.routes = route;
+  }
 }
 
 const instance = new Config();

packages/registry/src/registry.test.tsx

@@ -1073,3 +1073,100 @@ describe('Utilities registry', () => {
     ).toEqual([]);
   });
 });
+
+describe('Routes registry', () => {
+  afterEach(() => {
+    config.set('routes', []);
+  });
+
+  it('registers a simple route', () => {
+    config.registerRoute({
+      type: 'route',
+      path: '/login',
+      file: 'login.tsx',
+    });
+
+    expect(config.routes).toEqual([
+      {
+        type: 'route',
+        path: '/login',
+        file: 'login.tsx',
+      },
+    ]);
+  });
+
+  it('registers a simple route with options', () => {
+    config.registerRoute({
+      type: 'route',
+      path: '/login',
+      file: 'login.tsx',
+      options: { id: 'login', caseSensitive: true },
+    });
+
+    expect(config.routes).toEqual([
+      {
+        type: 'route',
+        path: '/login',
+        file: 'login.tsx',
+        options: { id: 'login', caseSensitive: true },
+      },
+    ]);
+  });
+
+  it('registers a nested route', () => {
+    config.registerRoute({
+      type: 'route',
+      path: '/login',
+      file: 'login.tsx',
+      children: [
+        {
+          type: 'route',
+          path: '/login/ok',
+          file: 'ok.tsx',
+        },
+      ],
+    });
+
+    expect(config.routes).toEqual([
+      {
+        type: 'route',
+        path: '/login',
+        file: 'login.tsx',
+        children: [
+          {
+            type: 'route',
+            path: '/login/ok',
+            file: 'ok.tsx',
+          },
+        ],
+      },
+    ]);
+  });
+
+  it('registers a couple of routes', () => {
+    config.registerRoute({
+      type: 'route',
+      path: '/login',
+      file: 'login.tsx',
+    });
+
+    config.registerRoute({
+      type: 'route',
+      path: '/logout',
+      file: 'logout.tsx',
+    });
+
+    expect(config.routes).toEqual([
+      {
+        type: 'route',
+        path: '/login',
+        file: 'login.tsx',
+      },
+      {
+        type: 'route',
+        path: '/logout',
+        file: 'logout.tsx',
+      },
+    ]);
+  });
+});

packages/types/news/6600.feature

@@ -0,0 +1 @@
+Added typings for the route registry. @sneridagh

packages/types/src/config/index.d.ts

@@ -13,6 +13,24 @@ export type AddonRoutesConfig = {
   component: React.ComponentType;
 }[];
 
+export type AddonRoutesEntry = {
+  path: string;
+  exact: boolean;
+  component: React.ComponentType;
+};
+
+export type ReactRouterRouteEntry = {
+  type: 'route' | 'index' | 'layout' | 'prefix';
+  path: string;
+  file: string;
+  options?: {
+    id?: string;
+    index?: boolean;
+    caseSensitive?: boolean;
+  };
+  children?: ReactRouterRouteEntry[];
+};
+
 export type ComponentsConfig = Record<
   string,
   { component: React.ComponentType }

packages/types/src/utils.d.ts

@@ -2,3 +2,11 @@
  * Get the type of the elements in an array
  */
 export type ArrayElement<A> = A extends readonly (infer T)[] ? T : never;
+
+export type RequireAtLeastOne<T, Keys extends keyof T = keyof T> = Pick<
+  T,
+  Exclude<keyof T, Keys>
+> &
+  {
+    [K in Keys]-?: Required<Pick<T, K>> & Partial<Pick<T, Exclude<Keys, K>>>;
+  }[Keys];