<aside class="collapse show collapse-horizontal col-sm-2 p-3 border-end bg-body-tertiary" id="collapseWidthExample">
    <div class="dropdown">
      <a href="#" class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="true">
        <img src="{{ auth()->user()->getAvatar() }}" alt="" width="32" height="32" class="rounded-circle me-2">
        <span class="d-print-block"><strong>{{ auth()->user()->getName() }}</strong></span>
      </a>
      <ul class="dropdown-menu text-small shadow">
        <li><a class="dropdown-item" href="#">ESI Scopes</a></li>
        <li><a class="dropdown-item" href="#">Roles</a></li>
        <li><a class="dropdown-item" href="#">Permissions</a></li>
        <li><a class="dropdown-item" href="#">Profile</a></li>
        <li>
          <hr class="dropdown-divider">
        </li>
        <li><a class="dropdown-item" href="#">Sign out</a></li>
      </ul>
    </div>
    <hr>
    <ul class="list-unstyled ps-0">
      <li class="mb-1">
        <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0 collapsed" data-bs-toggle="collapse" data-bs-target="#dashboard-collapse" aria-expanded="false">
            Dashboard
        </button>
        <div class="collapse" id="dashboard-collapse">
          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">User</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Admin</a></li>
          </ul>
        </div>
      </li>
      <li class="mb-1">
        <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0 collapsed" data-bs-toggle="collapse" data-bs-target="#finance-collapse" aria-expanded="false">
          Finance
        </button>
        <div class="collapse" id="finance-collapse">
          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Overiew</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Alliance</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Corporation</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Fleet Insurance</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Personal</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Ship Insurance</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Buyback</a></li>
          </ul>
        </div>
      </li>
      <li class="mb-1">
        <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0 collapsed" data-bs-toggle="collapse" data-bs-target="#logistics-collapse" aria-expanded="false">
          Logistics
        </button>
        <div class="collapse" id="logistics-collapse">
          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Citadel Fuel</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Jump Bridge Fuel</a></li>
          </ul>
        </div>
      </li>
      <li class="mb-1">
        <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0 collapsed" data-bs-toggle="collapse" data-bs-target="#srp-collapse" aria-expanded="false">
          Ship Replacement Program
        </button>
        <div class="collapse" id="srp-collapse">
          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Submit New</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">View Past</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Admin</a></li>
          </ul>
        </div>
      </li>
      <li class="mb-1">
        <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0 collapsed" data-bs-toggle="collapse" data-bs-target="#taxes-collapse" aria-expanded="false">
           Taxes
        </button>
        <div class="collapse" id="taxes-collapse">
          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Corporate</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Mining</a></li>
            <li><a href="#" class="link-body-emphasis d-inline-flex text-decoration-none rounded">Ratting</a></li>
          </ul>
        </div>
      </li>
    </ul>
    <hr>
  </aside>