Application Bar

import { OdsApplicationBar } from '@ods/components/react.application-bar';
import { OdsApplicationBarDivider } from '@ods/components/react.application-bar-divider';
import { OdsApplicationSwitcher } from '@ods/components/react.application-switcher';
import { OdsAdminButton } from '@ods/components/react.ods-admin-button';
import { OdsInsightsButton } from '@ods/components/react.ods-insights-button';
import { OdsAssetcareButton } from '@ods/components/react.ods-assetcare-button';
import { OdsReportsButton } from '@ods/components/react.ods-reports-button';
import { OdsApplicationUserMenu } from '@ods/components/react.application-user-menu';

const Example = () => {
  const onOdsSelectHandler = (event: any) => {
    console.log("In onOdsSelectHandler", event);
  }

  return (
    <OdsApplicationBar className="application-bar-demo" application-title="Reports">
      <div slot="right-content-region">
        <OdsApplicationUserMenu
          id="user-menu"
          onOdsSelect={onOdsSelectHandler}
          trigger-label="Dr. Jill Lopez M.D."
          headline="Dr. Jill Lopez M.D."
          subline="Gastroenterologist"
          language="English"
          languages={
            [
              {
                label: 'English',
                description: 'English'
              },
              {
                label: 'Deutsch',
                description: 'Germany'
              },
              {
                label: 'Español',
                description: 'Spain'
              },
              {
                label: 'Français',
                description: 'France'
              }
            ]
          } />

        <OdsApplicationBarDivider vertical />

        <OdsApplicationSwitcher>
          <OdsAdminButton href="/"></OdsAdminButton>
          <OdsInsightsButton href="/about/about-us/"></OdsInsightsButton>
          <OdsReportsButton href="/developing/"></OdsReportsButton>
          <OdsAssetcareButton href="/components/button/"></OdsAssetcareButton>
        </OdsApplicationSwitcher>
      </div>
    </OdsApplicationBar>
  )
};

export default Example;