diff --git a/plugins/catalog-react/src/index.ts b/plugins/catalog-react/src/index.ts index 2ea1eb6f53..2b1664abe2 100644 --- a/plugins/catalog-react/src/index.ts +++ b/plugins/catalog-react/src/index.ts @@ -27,6 +27,7 @@ export * from './apis'; export * from './components'; export * from './hooks'; export * from './filters'; +export type { EntityRouteParamsOptions } from './routes'; export { entityRouteParams, entityRouteRef } from './routes'; export * from './types'; export * from './overridableComponents'; diff --git a/plugins/catalog-react/src/routes.test.ts b/plugins/catalog-react/src/routes.test.ts index 2b172ae201..6299c0bdba 100644 --- a/plugins/catalog-react/src/routes.test.ts +++ b/plugins/catalog-react/src/routes.test.ts @@ -77,4 +77,27 @@ describe('entityRouteParams', () => { expect(actualRouteParams).toEqual(expectedRouteParams); }, ); + + it('should not encode route params by default', () => { + const actualRouteParams = entityRouteParams( + 'Custom Entity:Test Namespace/Test Component', + ); + expect(actualRouteParams).toEqual({ + kind: 'custom entity', + name: 'Test Component', + namespace: 'test namespace', + }); + }); + + it('should encode route params', () => { + const actualRouteParams = entityRouteParams( + 'Custom Entity:Test Namespace/Test Component', + { encodeParams: true }, + ); + expect(actualRouteParams).toEqual({ + kind: 'custom%20entity', + name: 'Test%20Component', + namespace: 'test%20namespace', + }); + }); }); diff --git a/plugins/catalog-react/src/routes.ts b/plugins/catalog-react/src/routes.ts index 13421fafef..34b9437691 100644 --- a/plugins/catalog-react/src/routes.ts +++ b/plugins/catalog-react/src/routes.ts @@ -42,12 +42,21 @@ export const entityRouteRef = getOrCreateGlobalSingleton( }), ); +/** + * Configurable options for `entityRouteParams` + * @public + */ +export type EntityRouteParamsOptions = { + encodeParams?: boolean; +}; + /** * Utility function to get suitable route params for entityRoute, given an * @public */ export function entityRouteParams( entityOrRef: Entity | CompoundEntityRef | string, + options?: EntityRouteParamsOptions, ) { let kind; let namespace; @@ -71,6 +80,13 @@ export function entityRouteParams( kind = kind.toLocaleLowerCase('en-US'); namespace = namespace?.toLocaleLowerCase('en-US') ?? DEFAULT_NAMESPACE; + const { encodeParams = false } = options || {}; + if (encodeParams) { + kind = encodeURIComponent(kind); + namespace = encodeURIComponent(namespace); + name = encodeURIComponent(name); + } + return { kind, namespace,