Application Switcher

Install

Run the following command to copy the Application Switcher into your project:

npx acc-nuxt add ApplicationSwitcher

Composition

ApplicationSwitcher composes Popover for the menu and Button for its trigger and application actions.

Use popoverProps to configure the composed Popover. Applications are read from the public runtime configuration.

Usage

<AcceleratorApplicationSwitcher />

Runtime applications

Applications come from the sites supplied through NUXT_PUBLIC_LEVARNE_ACC_AVAILABLE_SITES. The component determines whether those sites use direct navigation or a session handoff from the configured cookie domain.

export default defineNuxtConfig({
  levarneAcc: {
    availableSites: [
      { siteId: 'site_dashboard', name: 'Dashboard', url: 'https://dashboard.example.com', icon: 'dashboard' },
      { siteId: 'site_news', name: 'News', url: 'https://news.example.com', icon: 'news' },
    ],
  },
});

Application identity

Every deployed application must also configure its own private levarneAcc.siteId. This identifies the source application when a session handoff is requested and identifies the destination when the handoff code is redeemed.

Each siteId in availableSites should be a stable ID registered with the authentication backend. The current application's ID should have a matching entry in the shared available-sites list, while each local or deployed instance sets its own value.

export default defineNuxtConfig({
  levarneAcc: {
    // Private identity for this deployment (not public runtime config).
    siteId: 'site_dashboard',
    availableSites: [
      { siteId: 'site_dashboard', name: 'Dashboard', url: 'https://dashboard.example.com' },
      { siteId: 'site_news', name: 'News', url: 'https://news.example.com' },
    ],
  },
});

Props