<!doctype html>
<html lang="ko">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <%- include('partials/favicon') %>
    <title>사용자 현황관리 - XAVIS</title>
    <link rel="stylesheet" href="/public/styles.css" />
  </head>
  <body>
    <div class="app-shell">
      <%- include('partials/nav', { activeMenu: 'admin-users', adminMode: true }) %>
      <div class="content-area">
        <header class="topbar">
          <h1>사용자 현황관리</h1>
          <a class="top-action-link" href="/learning">학습센터</a>
        </header>
        <main class="container">
          <section class="panel">
            <p class="subtitle" style="margin-bottom: 16px">
              OPS 이메일(<strong>@xavis.co.kr</strong>) 매직 링크로 <strong>로그인에 성공한</strong> 사용자 목록입니다. 이메일과 최근 접속일(마지막 로그인 시각)을 표시합니다.
            </p>
            <% if (typeof dbError !== 'undefined' && dbError) { %>
            <p class="admin-error">목록을 불러오지 못했습니다: <%= dbError %></p>
            <% } else if (!pgConnected) { %>
            <p class="admin-warn">PostgreSQL이 비활성화되어 있어 사용자 목록을 조회할 수 없습니다.</p>
            <% } else if (!users || users.length === 0) { %>
            <p class="admin-hint">아직 로그인 기록이 없습니다.</p>
            <% } else { %>
            <div class="table-wrap">
              <table class="data-table" aria-label="인증 사용자 목록">
                <thead>
                  <tr>
                    <th scope="col">이메일</th>
                    <th scope="col">최근 접속일</th>
                  </tr>
                </thead>
                <tbody>
                  <% users.forEach(function (u) { %>
                  <tr>
                    <td><%= u.email %></td>
                    <td>
                      <% if (u.lastLoginAt) { %>
                      <%= new Date(u.lastLoginAt).toLocaleString('ko-KR', { timeZone: 'Asia/Seoul' }) %>
                      <% } else { %>
                      —
                      <% } %>
                    </td>
                  </tr>
                  <% }); %>
                </tbody>
              </table>
            </div>
            <p class="admin-hint" style="margin-top: 12px">총 <%= users.length %>명</p>
            <% } %>
          </section>
        </main>
      </div>
    </div>
  </body>
</html>
