/ Main Sidebar Container
%aside.main-sidebar.sidebar-dark-primary.elevation-4{ data: { controller: 'left-nav' }}
  / Brand Logo
  %a.brand-link{ href: "/", class: sidebar_background_class }
    %img.brand-image.img-circle.elevation-3{:alt => @context.logo.alt, :src => @context.logo.url, :style => "opacity: .8"}/
    %span.brand-text.font-weight-light= sidebar_context_name
  / Sidebar
  .sidebar
    / SidebarSearch Form
    .form-inline{ style: 'padding-top: 7px' }
      .input-group{"data-widget" => "sidebar-search"}
        %input.form-control.form-control-sidebar{"aria-label" => "Search Menu Items", :placeholder => "Search Menu Items", :type => "search"}/
        .input-group-append
          %button.btn.btn-sidebar
            %i.fas.fa-search.fa-fw
    / Sidebar Menu
    %nav.mt-2
      %ul.nav.nav-pills.nav-sidebar.nav-compact.flex-column{"data-accordion" => "false", "data-widget" => "treeview", :role => "menu"}
        - @context.menu_items.each do |menu_item|
          = render Olivander::Components::MenuItemComponent.new(menu_item)


:javascript
  $(document).ready(function(){
    function getUrl() {
      const locationUrl = new URL(window.location),
            reg = /\/new|\/[0-9]+[\/edit]*/;
      
      locationUrl.pathname = locationUrl.pathname.replace(reg, '')
      return locationUrl.href;
    }
    const url = getUrl();

    $('ul.nav-sidebar a').filter(function() {
      return this.href == url;
    }).addClass('active');

    $('ul.nav-sidebar a').filter(function() {
      return this.href == url;
    }).parent().addClass('active');

    $('ul.nav-treeview a').filter(function() {
      return this.href == url;
    }).parentsUntil(".sidebar-menu > .nav-treeview").addClass('menu-open');

    $('ul.nav-treeview a').filter(function() {
      return this.href == url;
    }).addClass('active');

    $('li.has-treeview a').filter(function() {
      return this.href == url;
    }).addClass('active');

    $('ul.nav-treeview a').filter(function() {
      return this.href == url;
    }).parentsUntil(".sidebar-menu > .nav-treeview").children(0).addClass('active');
  });