Add groups step to budget creation

Note we're keeping this section's original design (which had one button
to add a new group which after being pressed was replaced by a button to
cancel) but we aren't using Foundation's `data-toggle` because there
were a couple of usability and accessibility issues.

First, using `data-toggle` multiple times and applying it to multiple
elements led to the "cancel" button not being available after submitting
a form with errors. Fixing it made the code more complicated.

Second, the "Add new group" button always had the `aria-expanded`
attribute set to "true", so my screen reader was announcing the button
as expanded even when it wasn't. I didn't manage to fix it using
`data-toggle`.

Finally, after pressing either the "Add new group" and "Cancel" buttons,
the keyboard focus was lost since the elements disappeared.

So we're simplifying the HTML and adding some custom JavaScript to be
able to handle the focus and manually setting the `aria-expanded`
attribute.

Co-Authored-By: Javi Martín <javim@elretirao.net>
Co-Authored-By: Julian Herrero <microweb10@gmail.com>
This commit is contained in:
Alberto
2020-03-21 03:45:59 +01:00
committed by Javi Martín
parent e71ccee682
commit b304c640e1
30 changed files with 457 additions and 71 deletions

View File

@@ -1,64 +1,22 @@
class Admin::BudgetGroupsController < Admin::BaseController
include Translatable
include FeatureFlags
feature_flag :budgets
include Admin::BudgetGroupsActions
before_action :load_budget
before_action :load_group, only: [:edit, :update, :destroy]
before_action :load_groups, only: :index
def index
@groups = @budget.groups.order(:id)
end
def new
@group = @budget.groups.new
end
def edit
end
def create
@group = @budget.groups.new(budget_group_params)
if @group.save
redirect_to groups_index, notice: t("admin.budget_groups.create.notice")
else
render :new
end
end
def update
if @group.update(budget_group_params)
redirect_to groups_index, notice: t("admin.budget_groups.update.notice")
else
render :edit
end
end
def destroy
if @group.headings.any?
redirect_to groups_index, alert: t("admin.budget_groups.destroy.unable_notice")
else
@group.destroy!
redirect_to groups_index, notice: t("admin.budget_groups.destroy.success_notice")
end
end
private
def load_budget
@budget = Budget.find_by_slug_or_id! params[:budget_id]
end
def load_group
@group = @budget.groups.find_by_slug_or_id! params[:id]
end
def groups_index
admin_budget_groups_path(@budget)
end
def budget_group_params
valid_attributes = [:max_votable_headings]
params.require(:budget_group).permit(*valid_attributes, translation_params(Budget::Group))
def new_action
:new
end
end