<%- include('partials/header') %>

<h1>Meine Projekte</h1>
<p>
  Hier ist eine Auswahl meiner bisherigen Projekte. Da ich erst kürzlich
  angefangen habe meine Projekte zu präsentierern ist die Liste noch nicht
  vollständig und wird in der nächsten Zeit noch etwas wachsen.
</p>

<ul>
  <% projekte.forEach(projekt => { %>
  <li>
    <h3><a href="/project/<%= projekt.id %>"><%= projekt.name %></a></h3>
    <p><%= projekt.kurzbeschreibung %></p>
  </li>
  <% }) %>
</ul>

<% if (session && session.role === 'admin') { %>

<button
  type="button"
  class="btn btn-primary"
  data-bs-toggle="modal"
  data-bs-target="#newProject"
>
  Neues Projekt
</button>

<!-- Modal -->
<div
  class="modal fade"
  id="newProject"
  tabindex="-1"
  aria-labelledby="newProjectModalLabel"
  aria-hidden="true"
>
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">
          Neues Projekt anlegen
        </h5>
        <button
          type="button"
          class="btn-close"
          data-bs-dismiss="modal"
          aria-label="Close"
        ></button>
      </div>
      <div class="modal-body">
        <form action="/projects" method="post">
          <label for="name" class="form-label">Name</label>
          <input type="text" class="form-control" id="name" name="name" />
          <label for="beschreibung" class="form-label">Beschreibung</label>
          <input
            type="text"
            class="form-control"
            id="beschreibung"
            name="beschreibung"
          />
          <button type="submit" class="btn btn-primary">Create</button>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
          Close
        </button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>
<% } %> <%- include('partials/footer') %>
