@if(!empty($job_group->jobGroups))

	@foreach($job_group->jobGroups as $kk => $sub_group)
	<ul>
	  <li data-jstree='{"icon" : "fas fa-sitemap"}'>
        {{ $sub_group->name }}

        <span class="dropdown">
          <button type="button" class="btn btn-sm dropdown-toggle hide-arrow py-0" data-bs-toggle="dropdown">
            <i data-feather="more-vertical"></i>
          </button>
          <div class="dropdown-menu dropdown-menu-end">
              @can('Administration - Job Departments - Edit')
                <a class="dropdown-item" href="{{ route('job-groups.edit', ['job_group' => $sub_group->id]) }}" onclick="window.location=this.href">
                    <i data-feather="edit-2" class="me-50"></i>
                    <span>Edit</span>
                </a>
              @endcan
              @can('Administration - Job Groups - Remove')
                <a class="dropdown-item" href="{{ route('job-groups.destroy', ['job_group' => $sub_group->id]) }}" onclick="event.preventDefault(); document.getElementById('destroy-form-{{ $sub_group->id }}').submit();">
                    <i data-feather="trash" class="me-50"></i>
                    <span>Remove</span>
                </a>
                <form method="POST" id="destroy-form-{{ $sub_group->id }}" action="{{ route('job-groups.destroy', ['job_group' => $sub_group->id]) }}">
                    @csrf
                    @method('delete')
                </form>
              @endcan
          </div>
        </span>

        @include('content.subsystem.job.groups-child', [ 'job_group' => $sub_group])
	  </li>
	</ul>
	@endforeach

@endif