<!DOCTYPE html>
<html lang="en">

<%- include("extra/header", { title: member.name }) %>

  <body>

    <%- include("extra/navbar", { user }) %>


      <ul>
        <li>
          <h1>Avatar:</h1>
          <img style="width:256px;height:256px;" src=<%=member.avatar %> alt=<%= member.name %>>
        </li>

        <li>
          <h2>Name: <%= member.name %>
          </h2>
        </li>
        <li>
          <h2>Created at:
            <%= new Date(member.time).toLocaleString() %>
          </h2>


        </li>
        <li>
          <h2>Is admin? <%= member.admin ? "Yes" : "No" %>
          </h2>
        </li>

        <li>
          <h2> Message: <%= counts.message %>
          </h2>
        </li>
        <li>
          <h2> Thread: <%= counts.thread %>
          </h2>
        </li>
      </ul>

      <% if (user?.admin && !member.deleted) {%>
        <form id="admin">
          <button class="buyuk" type="submit">Give admin permissions!</button>
        </form>

        <form id="delete">
          <button class="buyuk" type="submit">Delete user!</button>
        </form>

        <script type="module">

          import request from "../../js/request.js";

          document.addEventListener("submit", async e => {
            e.preventDefault();

            if (e.target.id == "admin") {

              const response = await request("/api/users/<%= member.id %>/admin");

              if (response.result.admin) 
                return alert("Making admin of "+response.result.name+" is success!");
            } 
         
            const response = await request("/api/users/<%= member.id %>/delete");

            if (response.result.deleted) 
              alert("User Deleted");
            
          });


        </script>
        <% }; %>
        <% if (member.deleted) {%>
          <h1>This user has been deleted!</h1>
        <% }; %>
          
          <%- include("extra/footer") %>
  </body>

</html>