<%# Admin page for listing pending physics questions %> 
<%# ARGUMENTS:
    questions - array containing questions
%>

<%- include("../../partials/header") -%>
<%- include("../../partials/navigationPrivate") -%>

<style>
    .grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
        box-sizing: border-box;
    }
</style>

<h1 class="my-5 container">ADMIN PAGE: Pending Physics Questions</h1>
<div class="jumbotron container">
    <a class="btn btn-primary btn-lg w-100 my-2" href="/admin/reviewQuestions">Back To Review Dashboard</a>
</div>
<div class="jumbotron container">
    <div class="grid">
        <% for (let question of questions) { %>
            <% if (question.subject.includes("Physics") && !question.reviewers.includes(logUser.contributor)) { %>
            <div class="card g-col-4 p-3 m-0 bg-light">
                <h4>
                    <a class="text-decoration-none" href="/admin/reviewQuestion?id=<%= question['_id'] %>">
                    <%= question['subject'] %> (<%= question['rating'] %> rated)
                    </a>
                </h4>
                <span class="mb-2">ID: <code><%= question['_id']%></code></span>
                <div class="mb-2">
                    <% for (let tag of question['tags']) { %>
                        <div class="badge bg-secondary"><%= tag %></div>
                    <% } %>
                    <% for (let unit of question['units']) { %>
                        <div class="badge bg-primary"><%= unit %></div>
                    <% } %>
                </div>
                
                <!-- Question content -->
                <div>
                    <span><%= question['question'] %></span>
                </div>
            </div>
            <% } %>
        <% } %>
    </div>
</div>

<%- include("../../partials/footer") -%>