<form class="collection-edit-form">
    <% if (error && error.message) { %>
        <div class="content-group-edit-error message message-status message-status error is-shown">
          <%- gettext(error.message) %>
        </div>
    <% } %>
    <div class="wrapper-form">
        <fieldset class="collection-fields">
            <div class="input-wrap field text required add-collection-name <% if(error && error.attributes && error.attributes.name) { print('error'); } %>">
                <label for="group-cohort-name-<%- uniqueId %>"><%- gettext("Content Group Name") %></label><%
                if (!_.isUndefined(id) && !_.isEmpty(id)) {
                    %><span class="group-configuration-id">
                        <span class="group-configuration-label"><%- gettext('Content Group ID') %></span>
                        <span class="group-configuration-value"><%- id %></span>
                    </span><%
                }
                %>
                <input name="group-cohort-name" id="group-cohort-name-<%- uniqueId %>" class="collection-name-input input-text" value="<%- name %>" type="text" placeholder="<%- gettext("This is the name of the group") %>">
            </div>
        </fieldset>
        <% if (!_.isEmpty(usage)) { %>
            <div class="wrapper-group-configuration-validation usage-validation">
                <span class="icon fa fa-warning" aria-hidden="true"></span>
                <p class="group-configuration-validation-text">
                    <%- gettext('This content group is used in one or more units.') %>
                </p>
            </div>
        <% } %>
    </div>
    <div class="actions">
        <button class="action action-primary" type="submit"><% if (isNew) { print(gettext("Create")) } else { print(gettext("Save")) } %></button>
        <button class="action action-secondary action-cancel"><%- gettext("Cancel") %></button>

         <% if (!isNew) { %>
            <% if (_.isEmpty(usage)) { %>
                <span class="wrapper-delete-button" data-tooltip="<%- gettext("Delete") %>">
                    <a class="button action-delete delete" href="#"><%- gettext("Delete") %></a>
                </span>
            <% } else { %>
                <span class="wrapper-delete-button" data-tooltip="<%- gettext('Cannot delete when in use by a unit') %>">
                    <a class="button action-delete delete is-disabled" href="#" aria-disabled="true" ><%- gettext("Delete") %></a>
                </span>
            <% } %>
        <% } %>
    </div>
</form>