zitadel/internal/ui/login/static/templates/select_user.html

{{template "main-top" .}}

<div class="lgn-head">
    {{if .Linking}}
    <h1>{{t "UserSelection.TitleLinking"}}</h1>
    <p>{{t "UserSelection.DescriptionLinking"}}{{if .OrgName}} 
        {{t "UserSelection.MustBeMemberOfOrg" "OrgName" .OrgName}}{{end}}</p>
    {{else}}
    <h1>{{t "UserSelection.Title"}}</h1>
    <p>{{t "UserSelection.Description"}}{{if .OrgName}} 
        {{t "UserSelection.MustBeMemberOfOrg" "OrgName" .OrgName}}
        {{end}}
    </p>
    {{end}}
</div>


<form action="{{ userSelectionUrl }}" method="POST">

    {{ .CSRF }}

    <input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />

    <div class="lgn-account-selection">
        {{ if .Users }}
        {{ $displayLoginNameSuffix := and .OrgID (not .DisplayLoginNameSuffix)}}
        {{ range $user := .Users }}
        {{ $sessionState := (printf "UserSelection.SessionState%v" $user.UserSessionState) }}
        <button type="submit" name="userID" value="{{$user.UserID}}" class="lgn-account" 
        {{if not $user.SelectionPossible}}disabled title="{{t "Errors.User.NotAllowedOrg"}}"{{end}}>
            <div class="left">
                <div class="lgn-avatar" displayname="{{$user.DisplayName}}">
                    <span class="initials">A</span>
                </div>
            </div>
            <div class="lgn-names">
                <p class="lgn-displayname">{{$user.DisplayName}}</p>
                <p class="lgn-loginname">{{if and $displayLoginNameSuffix $user.SelectionPossible}}{{$user.UserName}}{{else}}{{$user.LoginName}}{{end}}</p>
                <p class="lgn-session-state i{{$user.UserSessionState}}">{{t $sessionState}}</p>
            </div>
            <span class="fill-space"></span>
            <i class="lgn-icon-angle-right-solid"></i>
        </button>
        {{ end }}
        {{ end }}
        <button type="submit" name="userID" value="0" class="lgn-account">
            <div class="left">
                <div class="lgn-avatar transparent">
                    <i class="lgn-icon-user-plus-solid"></i>
                </div>
            </div>
            <div class="lgn-names">
                <p>{{t "UserSelection.OtherUser"}}</p>
            </div>
            <span class="fill-space"></span>
            <i class="lgn-icon-angle-right-solid"></i>
        </button>
    </div>
</form>

<script src="{{ resourceUrl "scripts/avatar.js" }}"></script>

{{template "main-bottom" .}}