{{page-title (t 'form.project_create.title')}}

<AppBreadcrumbs/>
<PageHeader @iconName="plus">
  <div class="title">
    <h1>{{t 'form.project_create.title'}}</h1>
  </div>
</PageHeader>

<form class="pds-form" {{on "submit" this.saveProject}}>
  <div part="fields" class="card">
    <fieldset class="pds-formFieldSet">
      <div class="pds-formField">
        <label for="project-name" class="pds-fieldName">
          {{t 'form.project_create.project_name_label'}}
        </label>
        <Pds::Input
          @type="text"
          id="project-name"
          placeholder="my-new-project"
          required
          value={{this.model.name}}
          {{on "input" (pick "target.value" (set this "model.name"))}}
        />
      </div>
    </fieldset>
    <hr />
    <fieldset class="pds-formFieldSet">
      <div class="pds-formField">
        <div class="pds-fieldName" id="create-git-help-text">
          <span>
            <FlightIcon @name="git-repo" @size="16" class="icon" />
            {{t 'form.project_create.create_git_label'}}
          </span>
          <Pds::HelpText>
            {{t 'form.project_create.create_git_helptext'}}
          </Pds::HelpText>
        </div>
        <Pds::CheckboxField
          @checked={{this.createGit}}
          @id="create-git"
          aria-describedby="create-git-help-text"
          {{on "change" (set this "createGit" (not this.createGit))}}
        >
          {{t 'form.project_create.create_git_checkbox_label'}}
        </Pds::CheckboxField>
      </div>
    </fieldset>
  </div>
  <Pds::Button @variant="primary" @type="submit">
    {{t 'form.project_create.button'}}
  </Pds::Button>
</form>
