<!--

    Copyright (c) 2015-2018 Red Hat, Inc.
    This program and the accompanying materials are made
    available under the terms of the Eclipse Public License 2.0
    which is available at https://www.eclipse.org/legal/epl-2.0/

    SPDX-License-Identifier: EPL-2.0

    Contributors:
      Red Hat, Inc. - initial API and implementation

-->
<che-popup title="{{editComponentDialogController.index === -1 ? 'Add a new component' : 'Edit the component'}}"
           on-close="editComponentDialogController.hide()">
  <ng-form name="editComponentForm" class="edit-component-form">
    <div class="form-input-fields">
      <che-input type="text"
                 che-form="editComponentForm"
                 che-label-name="Name"
                 che-name="name"
                 che-place-holder="Enter component's name"
                 custom-validator="editComponentDialogController.isUnique($value)"
                 ng-model="editComponentDialogController.name"
                 ng-maxlength="256"
                 required>
        <div ng-message="required">Component's name is required.</div>
        <div ng-message="customValidator">This component's name is already in use.</div>
        <div ng-message="maxlength">Component's name should be less than 256 characters long.</div>
      </che-input>
      <che-input che-form="editComponentForm"
                 che-label-name="Version"
                 che-name="version"
                 che-place-holder="Enter component's version"
                 type="text"
                 ng-model="editComponentDialogController.version"
                 ng-maxlength="256">
        <div ng-message="maxlength">Component's version should be less than 256 characters long.</div>
      </che-input>
    </div>
    <che-button-primary che-button-title="{{editComponentDialogController.index === -1 ? 'Add' : 'Save'}}"
                        ng-click="editComponentDialogController.updateComponent()"
                        ng-disabled="editComponentForm.$invalid">
    </che-button-primary>
    <che-button-notice che-button-title="Cancel"
                       ng-click="editComponentDialogController.hide()">
    </che-button-notice>
  </ng-form>
</che-popup>
