<EmberWormhole @to="sidebar-menu-items">
    <StoreSelector @stores={{@model}} @activeStore={{this.activeStore}} @wrapperClass="mb-2" @onCreateStore={{this.createNewStorefront}} @onSwitchStore={{this.switchActiveStore}} />
    <Layout::Sidebar::Panel @open={{true}} @title={{t "storefront.sidebar.storefront"}}>
        <Layout::Sidebar::Item @route="console.storefront.home" @icon="home">{{t "storefront.sidebar.dashboard"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.products"
            @icon="box"
            @permission="storefront list product"
            @visible="storefront see product"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.products"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.catalogs"
            @icon="book-open"
            @permission="storefront list catalog"
            @visible="storefront see catalog"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.catalogs"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item @route="console.storefront.customers" @icon="users" @permission="storefront list user" @visible="storefront see user" disabled={{not this.activeStore.id}}>{{t
                "storefront.sidebar.customers"
            }}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.orders"
            @icon="file-invoice-dollar"
            @permission="storefront list order"
            @visible="storefront see order"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.orders"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.networks"
            @icon="network-wired"
            @permission="storefront list network"
            @visible="storefront see network"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.networks"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.food-trucks"
            @icon="truck"
            @permission="storefront list food-truck"
            @visible="storefront see food-truck"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.food-trucks"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.promotions"
            @icon="bullhorn"
            @permission="storefront view promotions"
            @visible="storefront see promotions"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.promotions"}}</Layout::Sidebar::Item>
        <Layout::Sidebar::Item
            @route="console.storefront.settings"
            @icon="cogs"
            @permission="storefront view settings"
            @visible="storefront see settings"
            disabled={{not this.activeStore.id}}
        >{{t "storefront.sidebar.settings"}}</Layout::Sidebar::Item>
    </Layout::Sidebar::Panel>
    <Layout::Sidebar::Item @url="https://github.com/fleetbase/storefront-app" @target="_github" @icon="rocket">{{t "storefront.sidebar.launch-app"}}</Layout::Sidebar::Item>
</EmberWormhole>

<Layout::Section::Container>
    {{outlet}}
</Layout::Section::Container>

<ContextPanel />