<div class="admin-navbar-menu recent-workspaces"
     ng-show="navbarRecentWorkspacesController.getRecentWorkspaces().length">
  <section class="left-sidebar-menu" layout="column" layout-align="start stretch">

    <div class="navbar-section navbar-section-title"
         flex layout="row">
      <span>Recent workspaces</span>
    </div>

    <md-list layout="column">
      <md-list-item flex class="navbar-subsection-item">
        <md-button flex che-reload-href
                   ng-href="{{navbarRecentWorkspacesController.workspaceCreationLink}}"
                   layout-align="left">
          <div class="navbar-item" layout="row" layout-align="start center">
            <i class="fa fa-plus navbar-icon navbar-primary"></i>
            <span>Create Workspace</span>
          </div>
        </md-button>
      </md-list-item>
      <md-list-item flex class="navbar-subsection-item"
                    ng-repeat="workspace in navbarRecentWorkspacesController.getRecentWorkspaces() | limitTo: navbarRecentWorkspacesController.maxItemsNumber"
                    ng-class="{'recent-workspaces-last-opened': navbarRecentWorkspacesController.isOpen(workspace.id)}">
        <navbar-dropdown-menu flex
                              navbar-dropdown-items="navbarRecentWorkspacesController.getDropdownItems(workspace.id)"
                              navbar-dropdown-right-click
                              navbar-dropdown-external-class="recent-workspaces-menu"
                              navbar-dropdown-offset="30 22">
          <md-button nav-bar-selected flex che-reload-href
                     ng-href="{{navbarRecentWorkspacesController.getLink(workspace)}}"
                     layout-align="left"
                     target="_self">
            <div class="navbar-item" layout="row" layout-align="start center">
              <workspace-status-indicator
                che-status="navbarRecentWorkspacesController.getWorkspaceStatus(workspace.id)"
                che-empty-circle="true"
                class="navbar-icon"
                title="{{navbarRecentWorkspacesController.getWorkspaceStatus(workspace.id)}}"></workspace-status-indicator>
              <span title="{{navbarRecentWorkspacesController.getWorkspaceName(workspace.id)}}"
                    class="recent-workspace-name-container"
                    ng-class="{'recent-workspaces-stopped-workspace': navbarRecentWorkspacesController.getWorkspaceStatus(workspace.id) === 'STOPPED'}">
                <span che-clip-the-middle>{{workspace.config.name}}</span>
              </span>
            </div>
          </md-button>
        </navbar-dropdown-menu>
      </md-list-item>
    </md-list>
  </section>
</div>
