import { Component } from '@angular/core';
import { AppComponent } from '../../../app.component';
import { Sidebar } from "../default/sidebar";

@Component({
  selector: "rd-frame-sidebar-backend",
  template: `
    <button #asideCloseBtn class="m-aside-left-close m-aside-left-close--skin-light" id="m_aside_left_close_btn" appunwraptag>
      <i class="la la-close"></i>
    </button>
    <div id="m_aside_left" class="m-grid__item	m-aside-left  m-aside-left--skin-light" style="top:60px" [hidden]="app?.instance?.isPageNotFound">
      <div id="m_ver_menu" class="m-aside-menu  m-aside-menu--skin-light m-aside-menu--submenu-skin-light" data-menu-vertical="true"
        m-menu-scrollable="1" m-menu-dropdown-timeout="500">
        <ul class="m-menu__nav  m-menu__nav--dropdown-submenu-arrow">

          <li class="m-menu__item m-menu__item--open" *ngFor="let subItem of items;" rd-sidebar-item [item]="subItem" 
            [ngClass]="{'m-menu__item--submenu': subItem.type == SidebarItemType.Container,'m-menu__item--active': subItem.active}"
            [attr.m-menu-submenu-toggle]="subItem.type == SidebarItemType.Container ? 'hover' : ''" 
            routerLinkActive="m-menu__item--active" aria-haspopup="true">
          </li>

        </ul>
      </div>
    </div>
  `
})
export class SidebarBackend extends Sidebar {
  app = AppComponent;
}