@extends('layouts.admin')

@section('title', 'Management User - KLISE')
@section('page_title', 'Management User')
@section('page_subtitle', 'Kelola akun wartawan.')
@section('hide_pagehead', '1')

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/admin/users.css') }}?v={{ filemtime(public_path('css/admin/users.css')) }}">
@endpush

@push('scripts')
    @include('layouts.partials.confirm-modal')
@endpush

@section('content')
    @php
        $sortUrl = function (string $column) use ($sort, $direction): string {
            $nextDirection = $sort === $column && $direction === 'asc' ? 'desc' : 'asc';

            return request()->fullUrlWithQuery([
                'sort' => $column,
                'direction' => $nextDirection,
                'page' => 1,
            ]);
        };

        $sortIcon = function (string $column) use ($sort, $direction): string {
            if ($sort !== $column) {
                return 'bi-arrow-down-up';
            }

            return $direction === 'asc' ? 'bi-caret-up-fill' : 'bi-caret-down-fill';
        };
    @endphp

    <div class="users-page-actions">
        <div class="users-page-actions__title">
            <h2>Daftar Wartawan</h2>
        </div>
        <div class="users-page-actions__controls">
            <a href="{{ route('admin.users.create') }}" class="table-toolbar-button table-toolbar-button--primary">Tambah User</a>
            <a
                href="{{ route('admin.users.download-accounts', request()->only(['q', 'sort', 'direction'])) }}"
                class="table-toolbar-button"
            >
                Download Akun
            </a>
        </div>
    </div>

    <section class="users-table-card">
        <div class="admin-table-toolbar">
            <form method="GET" action="{{ route('admin.users.index') }}" class="admin-table-toolbar__side">
                <input type="hidden" name="sort" value="{{ $sort }}">
                <input type="hidden" name="direction" value="{{ $direction }}">
                <label class="admin-search-field">
                    <span class="admin-search-field__icon" aria-hidden="true">
                        <i class="bi bi-search"></i>
                    </span>
                    <input
                        type="search"
                        name="q"
                        value="{{ $search }}"
                        class="admin-table-search admin-table-search--with-icon"
                        placeholder="Cari wartawan..."
                    >
                </label>
            </form>
        </div>

        <div class="table-wrap">
            <table class="admin-table admin-table--users">
                <thead>
                    <tr>
                        <th class="admin-table__th">No</th>
                        <th class="admin-table__th">
                            <a href="{{ $sortUrl('name') }}" class="admin-table__sort-link {{ $sort === 'name' ? 'is-active' : '' }}">
                                <span>Nama</span>
                                <span class="admin-table__sort-icon" aria-hidden="true">
                                    <i class="bi {{ $sortIcon('name') }}"></i>
                                </span>
                            </a>
                        </th>
                        <th class="admin-table__th">
                            <a href="{{ $sortUrl('media_name') }}" class="admin-table__sort-link {{ $sort === 'media_name' ? 'is-active' : '' }}">
                                <span>Nama Media</span>
                                <span class="admin-table__sort-icon" aria-hidden="true">
                                    <i class="bi {{ $sortIcon('media_name') }}"></i>
                                </span>
                            </a>
                        </th>
                        <th class="admin-table__th">
                            <a href="{{ $sortUrl('email') }}" class="admin-table__sort-link {{ $sort === 'email' ? 'is-active' : '' }}">
                                <span>Email</span>
                                <span class="admin-table__sort-icon" aria-hidden="true">
                                    <i class="bi {{ $sortIcon('email') }}"></i>
                                </span>
                            </a>
                        </th>
                        <th class="admin-table__th">Password Baru</th>
                        <th class="admin-table__th admin-table__th--actions">Aksi</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($users as $user)
                        <tr>
                            <td class="admin-table__td">{{ $users->firstItem() + $loop->index }}</td>
                            <td class="admin-table__td"><span class="user-cell__text" title="{{ $user->name }}">{{ $user->name }}</span></td>
                            <td class="admin-table__td"><span class="user-cell__text" title="{{ $user->media_name ?: '-' }}">{{ $user->media_name ?: '-' }}</span></td>
                            <td class="admin-table__td"><span class="user-cell__text" title="{{ $user->email }}">{{ $user->email }}</span></td>
                            <td class="admin-table__td">
                                <div class="temporary-password">
                                    @if ($user->temporary_password && $user->must_change_password)
                                        <span class="temporary-password__value">{{ $user->temporary_password }}</span>
                                    @else
                                        <span class="temporary-password__empty">Sudah diganti user</span>
                                    @endif
                                </div>
                            </td>
                            <td class="admin-table__td admin-table__td--actions">
                                <div class="table-actions">
                                    <form
                                        method="POST"
                                        action="{{ route('admin.users.update-password', $user) }}"
                                        data-confirm-form
                                        data-confirm-title="Reset Password"
                                        data-confirm-message="Password sementara baru akan dibuat untuk user ini."
                                        data-confirm-button="Ya, reset"
                                        data-confirm-variant="primary"
                                    >
                                        @csrf
                                        @method('PATCH')
                                        <button type="submit" class="button-primary button-primary--small">Reset Password</button>
                                    </form>

                                    <a
                                        href="{{ route('admin.users.edit', $user) }}"
                                        class="table-icon-button table-icon-button--edit"
                                        title="Edit user"
                                        aria-label="Edit user"
                                    >
                                        <i class="bi bi-pencil-square" aria-hidden="true"></i>
                                    </a>

                                    <form
                                        method="POST"
                                        action="{{ route('admin.users.destroy', $user) }}"
                                        data-confirm-form
                                        data-confirm-title="Hapus User"
                                        data-confirm-message="User ini akan dihapus permanen dari sistem."
                                        data-confirm-button="Ya, hapus"
                                        data-confirm-variant="danger"
                                    >
                                        @csrf
                                        @method('DELETE')
                                        <button
                                            type="submit"
                                            class="table-icon-button table-icon-button--danger"
                                            title="Hapus user"
                                            aria-label="Hapus user"
                                        >
                                            <i class="bi bi-trash3" aria-hidden="true"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="admin-table__empty">Belum ada user wartawan.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        <div class="admin-table-footer">
            <p class="admin-table-footer__meta">
                Showing {{ $users->count() ? $users->firstItem() : 0 }} to {{ $users->count() ? $users->lastItem() : 0 }} of {{ $users->total() }} results
            </p>

            @if ($users->hasPages())
                <div class="admin-table-footer__pager">
                    @if ($users->onFirstPage())
                        <span class="admin-table-footer__link is-disabled">Previous</span>
                    @else
                        <a href="{{ $users->previousPageUrl() }}" class="admin-table-footer__link">Previous</a>
                    @endif

                    <span class="admin-table-footer__current">Page {{ $users->currentPage() }}</span>

                    @if ($users->hasMorePages())
                        <a href="{{ $users->nextPageUrl() }}" class="admin-table-footer__link">Next</a>
                    @else
                        <span class="admin-table-footer__link is-disabled">Next</span>
                    @endif
                </div>
            @endif
        </div>
    </section>
@endsection