<form class="collection-edit-form group-configuration-edit-form">
    <% if (error && error.message) { %>
        <div class="group-configuration-edit-error message message-status message-status error is-shown" name="group-configuration-edit-error">
          <%- gettext(error.message) %>
        </div>
    <% } %>
    <div class="wrapper-form">
        <fieldset class="collection-fields group-configuration-fields">
            <legend class="sr"><%- gettext("Group Configuration information") %></legend>
            <div class="input-wrap field text required add-collection-name add-group-configuration-name <% if(error && error.attributes && error.attributes.name) { print('error'); } %>">
                <label for="group-configuration-name-<%- uniqueId %>"><%- gettext("Group Configuration Name") %></label><%
                if (!_.isUndefined(id)) {
                    %><span class="group-configuration-id">
                        <span class="group-configuration-label"><%- gettext('Group Configuration ID') %></span>
                        <span class="group-configuration-value"><%- id %></span>
                    </span><%
                }
                %>
                <input id="group-configuration-name-<%- uniqueId %>" class="collection-name-input input-text" name="group-configuration-name" type="text" placeholder="<%- gettext("This is the Name of the Group Configuration") %>" value="<%- name %>">
                <span class="tip tip-stacked"><%- gettext("Name or short description of the configuration") %></span>
            </div>
            <div class="input-wrap field text add-group-configuration-description">
                <label for="group-configuration-description-<%- uniqueId %>"><%- gettext("Description") %></label>
                <textarea id="group-configuration-description-<%- uniqueId %>" class="group-configuration-description-input text input-text" name="group-configuration-description" placeholder="<%- gettext("This is the Description of the Group Configuration") %>"><%- description %></textarea>
                <span class="tip tip-stacked"><%- gettext("Optional long description") %></span>
            </div>
        </fieldset>
        <fieldset class="groups-fields">
            <legend class="sr"><%- gettext("Group information") %></legend>
            <label class="groups-fields-label required"><%- gettext("Groups") %></label>
            <span class="tip tip-stacked"><%- gettext("Name of the groups that students will be assigned to, for example, Control, Video, Problems. You must have two or more groups.") %></span>
            <ol class="groups list-input enum"></ol>
            <button class="action action-add-group action-add-item"><span class="icon fa fa-plus" aria-hidden="true"></span> <%- gettext("Add another group") %></button>
        </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 configuration is currently used in content experiments. If you make changes to the groups, you may need to edit those experiments.') %>
                </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">
                    <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 an experiment') %>">
                    <a class="button action-delete delete is-disabled" href="#" aria-disabled="true" ><%- gettext("Delete") %></a>
                </span>
            <% } %>
        <% } %>
    </div>
</form>