{{define "title"}}Admin - Feedback & User Reports{{end}}
{{define "content"}}
{{$Root := .}}
<div class="container">
    <section class="hero is-danger is-bold">
        <div class="hero-body">
            <div class="container">
                <h1 class="title">
                    Feedback &amp; User Reports
                </h1>
            </div>
        </div>
    </section>

    <div class="block p-4">
        <div class="columns">
            <div class="column">
                There {{Pluralize64 .Pager.Total "is" "are"}} <strong>{{.Pager.Total}}</strong>
                {{if .Acknowledged}}acknowledged{{else}}unread{{end}}
                {{if eq .Intent "report"}}report{{else}}feedback message{{end}}{{Pluralize64 .Pager.Total}}.
            </div>
            <div class="column is-narrow">
                <div class="tabs is-toggle">
                    <ul>
                        <li{{if eq .Intent ""}} class="is-active"{{end}}>
                            <a href="{{.Request.URL.Path}}?{{QueryPlus "intent" ""}}">All</a>
                        </li>
                        <li{{if eq .Intent "contact"}} class="is-active"{{end}}>
                            <a href="{{.Request.URL.Path}}?{{QueryPlus "intent" "contact"}}">Contact</a>
                        </li>
                        <li{{if eq .Intent "report"}} class="is-active"{{end}}>
                            <a href="{{.Request.URL.Path}}?{{QueryPlus "intent" "report"}}">Reports</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="column is-narrow">
                <div class="tabs is-toggle">
                    <ul>
                        <li{{if not .Acknowledged}} class="is-active"{{end}}>
                            <a href="{{.Request.URL.Path}}?{{QueryPlus "acknowledged" "false"}}">Unread</a>
                        </li>
                        <li{{if .Acknowledged}} class="is-active"{{end}}>
                            <a href="{{.Request.URL.Path}}?{{QueryPlus "acknowledged" "true"}}">Acknowledged</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Search fields -->
        <div class="mb-4">
            <form action="{{.Request.URL.Path}}" method="GET">
                <input type="hidden" name="intent" value="{{.Intent}}">
                <input type="hidden" name="acknowledged" value="{{.Acknowledged}}">

                <div class="card nonshy-collapsible-mobile">
                    <header class="card-header has-background-link-light">
                        <p class="card-header-title has-text-dark">
                            Search Filters
                        </p>
                        <button class="card-header-icon" type="button">
                            <span class="icon">
                                <i class="fa fa-angle-up"></i>
                            </span>
                        </button>
                    </header>
                    <div class="card-content">
                        <div class="columns">

                            <div class="column pr-1">
                                <div class="field">
                                    <label class="label" for="q">Search terms:</label>
                                    <input type="text" class="input"
                                        name="q" id="q"
                                        autocomplete="off"
                                        value="{{.SearchTerm}}">
                                    <p class="help">
                                        Tip: you can <span class="has-text-success">"quote exact phrases"</span> and
                                        <span class="has-text-success">-exclude</span> words (or
                                        <span class="has-text-success">-"exclude phrases"</span>) from your search.
                                    </p>
                                </div>
                            </div>

                            <div class="column px-1">
                                <div class="field">
                                    <label class="label" for="subject">Subject:</label>
                                    <div class="select is-fullwidth">
                                        <select id="subject" name="subject">
                                            <option value=""></option>
                                            {{range .DistinctSubjects}}
                                            <option value="{{.}}" {{if eq $Root.Subject .}}selected{{end}}>{{.}}</option>
                                            {{end}}
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="column px-1">
                                <div class="field">
                                    <label class="label" for="sort">Sort by:</label>
                                    <div class="select is-fullwidth">
                                        <select id="sort" name="sort">
                                            <option value="created_at desc"{{if eq .Sort "created_at desc"}} selected{{end}}>Newest</option>
                                            <option value="created_at asc"{{if eq .Sort "created_at asc"}} selected{{end}}>Oldest</option>
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="column is-narrow pl-1 has-text-right">
                                <label class="label">&nbsp;</label>
                                <a href="{{.Request.URL.Path}}" class="button">Reset</a>
                                <button type="submit" class="button is-success">
                                    <span>Search</span>
                                    <span class="icon"><i class="fa fa-search"></i></span>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>

            </form>

        </div>

        {{SimplePager .Pager}}

        <div class="columns is-multiline">
        {{range .Feedback}}
            <div class="column is-one-third">
                {{$User := $Root.UserMap.Get .UserID}}
                <form action="{{$Root.Request.URL.Path}}" method="POST">
                    {{InputCSRF}}
                    <input type="hidden" name="id" value="{{.ID}}">

                    <div class="card" style="max-width: 512px">
                        <header class="card-header {{if eq .Intent "report"}}has-background-danger{{else}}has-background-link{{end}}">
                            <p class="card-header-title has-text-light">
                                {{if eq .Intent "report"}}
                                    <span class="icon"><i class="fa fa-flag"></i></span>
                                    <span>Report: {{.Subject}}</span>
                                {{else}}
                                    <span class="icon"><i class="fa fa-message"></i></span>
                                    <span>Contact: {{.Subject}}</span>
                                {{end}}
                            </p>
                        </header>
                        <div class="card-content">

                            <table class="table is-fullwidth">
                                <tr>
                                    <td class="has-text-right is-narrow">
                                        <strong>Intent:</strong>
                                    </td>
                                    <td>{{.Intent}}</td>
                                </tr>
                                <tr>
                                    <td class="has-text-right">
                                        <strong>Subject:</strong>
                                    </td>
                                    <td>{{.Subject}}</td>
                                </tr>
                                <tr>
                                    <td class="has-text-right">
                                        <strong>Table:</strong>
                                    </td>
                                    <td>
                                        {{if eq .TableName ""}}
                                            n/a
                                            {{if ne .TableID 0}} - {{.TableID}}{{end}}
                                        {{else if eq .TableName "users"}}
                                            Users: {{.TableID}}
                                            <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true"
                                                class="fa fa-external-link ml-2"
                                                target="_blank"
                                                title="Visit the reported user's profile"></a>
                                        {{else if eq .TableName "photos"}}
                                            Photos: {{.TableID}}
                                            <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true"
                                                class="fa fa-external-link mx-2"
                                                target="_blank"
                                                title="Visit the reported photo"></a>
                                            <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true&profile=true"
                                                class="fa fa-user"
                                                target="_blank"
                                                title="Visit the user profile who owns the reported photo"></a>
                                        {{else if eq .TableName "messages"}}
                                            Messages: {{.TableID}}
                                            <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true"
                                                class="fa fa-ghost ml-2"
                                                target="_blank"
                                                title="Impersonate the reporter and view this message thread"></a>
                                        {{else}}
                                            {{.TableName}}: {{.TableID}}
                                            <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true" class="fa fa-external-link ml-2" target="_blank"></a>
                                        {{end}}
                                    </td>
                                </tr>
                                <tr>
                                    <td class="has-text-right">
                                        <strong>Reply&nbsp;To:</strong>
                                    </td>
                                    <td>
                                        {{if $User}}
                                            <a href="/u/{{$User.Username}}">{{$User.Username}}</a>
                                        {{else if ne .ReplyTo ""}}
                                            <a href="mailto:{{.ReplyTo}}">{{.ReplyTo}}</a>
                                        {{else}}
                                            n/a
                                        {{end}}
                                    </td>
                                </tr>
                                <tr>
                                    <td class="has-text-right">
                                        <strong>Date:</strong>
                                    </td>
                                    <td>
                                        {{.CreatedAt.Format "2006-01-02 15:04:05 MST"}}
                                    </td>
                                </tr>
                            </table>

                            <div class="content">
                                {{if eq .Message ""}}
                                    <p><em>No message attached.</em></p>
                                {{else}}
                                    {{ToMarkdown .Message}}
                                {{end}}

                                <!-- Photo attachment? -->
                                {{if eq .TableName "photos"}}
                                    {{$Photo := $Root.PhotoMap.Get .TableID}}
                                    {{if $Photo}}
                                    <div class="is-clipped">
                                        <a href="{{$Root.Request.URL.Path}}?id={{.ID}}&visit=true">
                                            <img src="{{PhotoURL $Photo.Filename}}"
                                                class="blurred-explicit">
                                        </a>
                                    </div>
                                    <div class="mt-3 has-text-smaller">
                                        <a href="/photo/edit?id={{.TableID}}">
                                            <i class="fa fa-edit mr-1"></i> Edit this photo
                                        </a>
                                    </div>
                                    {{end}}
                                {{end}}
                            </div>

                        </div>
                        <footer class="card-footer">
                            {{if not .Acknowledged}}
                            <button type="submit" name="verdict" value="acknowledge" class="card-footer-item button is-success">
                                <span class="icon"><i class="fa fa-check"></i></span>
                                <span>Acknowledge</span>
                            </button>
                            {{end}}

                            {{if .Acknowledged}}
                            <button type="submit" name="verdict" value="unacknowledge" class="card-footer-item button is-warning">
                                <span class="icon"><i class="fa fa-xmark"></i></span>
                                <span>Mark Unread</span>
                            </button>
                            {{end}}
                        </footer>
                    </div>
                </form>
            </div>
        {{end}}
        </div>
    </div>

</div>
{{end}}