extends ../../layout/main
block view-content

  section.uk-section.uk-section-default.uk-section-small
    .uk-container

      .uk-margin
        - var actionUrl = !!project ? `/client/${client._id}/project/${project._id}` : `/client/${client._id}/project`;
        form(method="POST", action= actionUrl).uk-form
          .uk-card.uk-card-default.uk-card-small
            .uk-card-header
              div(uk-grid).uk-grid-small.uk-flex-middle
                .uk-width-expand
                  h1.uk-card-title #[span= !!project ? "Edit" : "New"] Project
                .uk-width-auto
                  div #{client.name}

            .uk-card-body
              .uk-margin
                label(for="name").uk-form-label Project name
                input(
                  id="name",
                  name="name",
                  type="text",
                  value= !!project ? project.name : undefined,
                  placeholder="Enter project name",
                ).uk-input

              .uk-margin
                label(for="description").uk-form-label Project description
                textarea(
                  id="name",
                  name="description",
                  rows=4,
                  placeholder="Enter project description"
                ).uk-textarea.uk-resize-vertical= !!project ? project.description : ""

              .uk-margin
                label(for="managers").uk-form-label Managers
                input(
                  id="managers",
                  name="managers",
                  type="text",
                  value= !!project ? (project.managers || [ ]).map((m) => m.username).join(',') : undefined,
                  placeholder="Enter comma-separated list of usernames",
                ).uk-input
                .uk-text-small.uk-text-muted Managers can review work sessions and access billing information.

              .uk-margin
                label(for="hourly-rate").uk-form-label Hourly rate
                input(
                  id="hourly-rate",
                  name="hourlyRate",
                  type="number",
                  value= !!project ? project.hourlyRate : undefined,
                  placeholder="Enter hourly rate",
                ).uk-input

            .uk-card-footer.uk-flex.uk-flex-right
              button(type="submit").uk-button.uk-button-default.uk-border-rounded #[span= !!project ? "Update" : "Create"] Project