<FwTopLink @route='index' @class="fw-app-info pull-left clearfix" @tagName='section'>
    <img class="fw-app-logo pull-left" src="{{logo}}" />
    {{#if config.shortName}}
        <span class="fw-app-name full-name pull-left">{{config.name}}</span>
        <span class="fw-app-name short-name pull-left">{{config.shortName}}</span>
    {{else}}
        <span class="fw-app-name pull-left">{{config.name}}</span>
    {{/if}}
</FwTopLink>

{{#if session.isAuthenticated}}
    <section class="fw-header-link pull-right clearfix dropdown {{if showDropdown 'open'}}" {{action 'toggleDropdown' true}}>
        <a class="link-text" role="button" style="text-align: right;">
            {{! if small enough screen just show First L.}}
            <strong class="fw-user-name full-name">{{currentUser.nameFull}}</strong>
            <strong class="fw-user-name short-name">{{if currentUser.namePref currentUser.namePref currentUser.nameFirst}}</strong><br>
            <small>{{currentDepartment}}</small>
        </a>

        {{#if showDropdown}}
            <ul class="dropdown-menu dropdown-menu-right">
                <li class="apps-dropdown"><a role="button" {{action "toggleAppsModal"}}><i class="fa-solid fa-table-cells" style="margin-right: 2px;"></i>&nbsp;Apps</a></li>
                {{#if currentUser.hasDepartments}}
                    {{!-- Show loading spinner while waiting for department fetch --}}
                    {{#if departments}}
                        <FwDropdown @class="department-switch" @label={{switchDepartmentLabel}} @tagName="li" @toggleTag="a" @side="left" @right={{true}}>
                            {{#each sortedDepartments as |dept|}}
                                {{#if (eq dept.id currentUser.currentDept)}}
                                    <li class='active' {{action "toggleDropdown" false}}> {{dept.name}} </li>
                                {{else}}
                                    <li {{action "changeDepartment" dept}}> {{dept.name}} </li>
                                {{/if}}
                            {{/each}}
                        </FwDropdown>
                    {{else}}
                        <li><a role="button"><i class="fa-solid fa-rotate fa-spin" style="margin-right: 2px;"></i>&nbsp;Switch Departments</a></li>
                    {{/if}}
                {{/if}}
                {{#if currentUser.hasRoles}}
                    <li {{action "toggleDropdown" false}}><FwTopLink @route='profile'><i class="fa-solid fa-user" style="margin-right: 2px;"></i>&nbsp;Profile</FwTopLink></li>
                {{/if}}
                {{#if (or currentUser.hasDepartments currentUser.hasRoles)}}
                    <li role="separator" class="divider"></li>
                {{/if}}
                <li><a role="button" {{action 'showModal' 'about'}}><i class="fa-solid fa-circle-info" style="margin-right: 2px;"></i>&nbsp;About</a></li>
                <li><a role="button" {{action 'reload'}}><i class="fa-solid fa-rotate-right"></i>&nbsp;Reload Permissions</a></li>
                <li><a role="button" {{action 'logout'}}><i class="fa-solid fa-power-off" style="margin-right: 2px;"></i>&nbsp;Logout</a></li>
            </ul>

            <div class="dropdown-click-target" {{action "toggleDropdown" false}} {{action "toggleDropdown" false on="touchStart" preventDefault=false}}></div>
        {{/if}}
    </section>
    <section class="fw-header-link pull-right clearfix border-right apps-button" role="button" {{action "toggleAppsModal"}}>
        <span class="link-text pull-right">
            <i class="fa-solid fa-table-cells" style="margin-right: 2px;"/>
            Apps
        </span>
    </section>
{{/if}}

{{#if modals.about}}
    <FwFullscreenModal @modal="about-app" @model={{app}} @size="md" @close={{action (mut modals.about) false}} />
{{else if modals.apps}}
    <FwFullscreenModal @modal="app-switch" @size="lg" @close={{action "toggleAppsModal"}} />
{{else if modals.change}}
    <FwFullscreenModal @modal="change-password" @size="sm" @close={{action "toggleChangeModal"}} @model={{hash needSecure=needSecureChangePassword}} />
{{/if}}
