Registry Service

The registry service is the storage layer behind the menu, widget, and hook services — and the place to register your own component contributions and registries.

You'll touch it for two main reasons:

1. Inject a component into another extension's slot — e.g., a tab panel into Fleet-Ops's vehicle detail
2. Create your own registry — so other extensions can plug into yours

// addon/extension.js
import { ExtensionComponent } from '@fleetbase/ember-core/contracts';

export default {
    setupExtension(app, universe) {
        const registryService = universe.getService('registry');
        // …
    },
};

Two-Level Storage

Registries are organized as section → list → items. For example:

• console:admin (section) → menu-item (list) → admin items
• console:admin (section) → menu-panel (list) → admin panels
• fleet-ops:component:order:details (section) → components (list) → renderable components

The menu service writes into <registry>:menu-item lists; the registry service's registerRenderableComponent writes into the components list. You usually don't need to think about lists — the dedicated registrars handle them.

registerRenderableComponent(registryName, component, options?)

Inject a component into a host extension's slot. The host renders it via <RegistryYield>.

import { ExtensionComponent } from '@fleetbase/ember-core/contracts';

registryService.registerRenderableComponent(
    'fleet-ops:component:order:details',
    new ExtensionComponent('@fleetbase/storefront-engine', 'storefront-order-summary')
);

Forms supported for the component argument:

Well-Known Renderable-Component Registries

Real engines expose these slots (extracted from the extension.js files of the open-source extensions):

For Fleet-Ops's full list of slots, see fleetops/addon/extension.js#createRegistries.

createRegistry(name) / createRegistries(names)

Create your own registries so other extensions can plug into them.

const registryService = universe.getService('registry');

registryService.createRegistries([
    'my-extension:sidebar',
    'my-extension:order:tabs',
    'my-extension:dashboard:widgets',
]);

Other extensions can then registerRenderableComponent('my-extension:sidebar', …) and your templates yield via <RegistryYield>.

getRenderableComponents(registryName)

Read the components in a registry. Useful when iterating in your own template:

get sidebarComponents() {
    return this.universe.getService('registry').getRenderableComponents('my-extension:sidebar');
}

Lower-Level Registry API

These methods underpin the higher-level registrars. You'll rarely call them directly.

Registering Components, Services, and Helpers Globally

Beyond renderable components, the registry service can also register first-class components, services, and helpers into the host application's container — making them available to every engine:

registerComponent(name, ComponentClass, options?)

Make a component available to all engines by name.

import MyComponent from './components/my-component';
registryService.registerComponent('my-component', MyComponent);

registerService(name, ServiceClass, options?)

Make a service available to all engines by name.

import MyService from './services/my-service';
registryService.registerService('my-service', MyService);

registerHelper(helperName, helperOrTemplateHelper, options?)

Register a Handlebars helper. Supports lazy-loading via the TemplateHelper contract:

import TemplateHelper from '@fleetbase/ember-core/contracts/template-helper';

registryService.registerHelper(
    'calculate-delivery-fee',
    new TemplateHelper('@fleetbase/storefront-engine', 'helpers/calculate-delivery-fee')
);

Most extensions don't need these global registrars — engine-local components, services, and helpers are auto-resolved by Ember within your engine. Use these only when something must be visible to other engines.

Real-World References

See Also

• <RegistryYield> — render registry contents in templates
• ExtensionComponent contract
• Menu Service — for menu-item registries

Source