scinote-web/app/views/projects/index/modals/_edit_project_contents.html.erb

<div class="modal-header">
  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  <h4 class="modal-title" id="edit-project-modal-label">
    <%= t('projects.index.modal_edit_project.modal_title', project: @project.name) %>
  </h4>
</div>
<%= form_with model: @project, url: project_path(@project ,format: :json), method: :put, data: { remote: true } do |f| %>
  <div class="modal-body">
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 sci-input-container">
        <label><%= t("projects.index.modal_new_project.name") %></label>
        <%= f.text_field :name, autofocus: true, placeholder: t("projects.index.modal_new_project.name_placeholder"), class: 'sci-input-field' %>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 mt-4">
        <div class="flex gap-2 text-xs">
          <div class="sci-checkbox-container mt-0.5">
            <%= f.check_box :visibility,
                            { class: 'sci-checkbox', checked: f.object.visible?, data: { action: 'toggle-visibility', target: 'edit_project_role_select_wrapper' } },
                            :visible,
                            :hidden %>
            <span class="sci-checkbox-label"></span>
          </div>
          <span><%= t('projects.index.modal_new_project.visibility_html') %></span>
        </div>
      </div>
    </div>
    <div class="row mt-4 <%= f.object.hidden? ? 'hidden' : '' %>" id="edit_project_role_select_wrapper">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <%= f.label :default_public_user_role_id, t('user_assignment.select_default_user_role') %>
        <%= f.select :default_public_user_role_id,
                     options_for_select(user_roles_collection(@project), selected: f.object.default_public_user_role_id),
                     {},
                     class: 'form-control selectpicker'%>
      </div>
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
    <button class="btn btn-primary" type="submit"><%=t "projects.index.modal_edit_project.submit" %></button>
  </div>
<% end %>