Add proper radio functionality to column picker

This commit is contained in:
Andy Smith
2025-10-06 14:25:07 -05:00
parent a2b21b75ee
commit 7affff16fd
2 changed files with 34 additions and 15 deletions
+12 -1
View File
@@ -1,16 +1,27 @@
<% if workflow = card.collection.workflow %> <% if workflow = card.collection.workflow %>
<div id="<%= dom_id(card, :stages) %>" class="card__stages"> <div id="<%= dom_id(card, :stages) %>" class="card__stages" role="radiogroup">
<legend class="for-screen-reader">Choose a column for this card</legend>
<%= button_to "Not now", card_closure_path(card, reason: "Not now"), <%= button_to "Not now", card_closure_path(card, reason: "Not now"),
class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ], class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ],
role: "radio",
aria: { checked: card.closed? },
form_class: "flex align-center gap-half" %> form_class: "flex align-center gap-half" %>
<%= button_to "The Stream", card_engagement_path(card), method: :delete, <%= button_to "The Stream", card_engagement_path(card), method: :delete,
class: [ "workflow-stage workflow-stage--stream btn", { "workflow-stage--current": card.considering? } ], class: [ "workflow-stage workflow-stage--stream btn", { "workflow-stage--current": card.considering? } ],
role: "radio",
aria: { checked: card.considering? },
form_class: "flex align-center gap-half" %> form_class: "flex align-center gap-half" %>
<% workflow.stages.each do |stage| %> <% workflow.stages.each do |stage| %>
<%= button_to_set_stage card, stage %> <%= button_to_set_stage card, stage %>
<% end %> <% end %>
<%= button_to "Closed", card_closure_path(card, reason: "Completed"), <%= button_to "Closed", card_closure_path(card, reason: "Completed"),
class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ], class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ],
role: "radio",
aria: { checked: card.closed? },
form_class: "flex align-center gap-half" %> form_class: "flex align-center gap-half" %>
</div> </div>
<% end %> <% end %>
+22 -14
View File
@@ -1,17 +1,25 @@
<div id="<%= dom_id(card, :stages) %>" class="card__stages"> <div id="<%= dom_id(card, :stages) %>" class="card__stages" role="radiogroup">
<%= button_to "Not now", card_not_now_path(card), <legend class="for-screen-reader">Choose a column for this card</legend>
class: [ "workflow-stage btn", { "workflow-stage--current": card.postponed? } ],
form_class: "flex align-center gap-half" %>
<%= button_to "The Stream", card_triage_path(card), method: :delete, <%= button_to "Not now", card_not_now_path(card),
class: [ "workflow-stage workflow-stage--stream btn", { "workflow-stage--current": card.awaiting_triage? } ], class: [ "workflow-stage btn", { "workflow-stage--current": card.postponed? } ],
form_class: "flex align-center gap-half" %> role: "radio",
aria: { checked: card.postponed? },
form_class: "flex align-center gap-half" %>
<% card.collection.columns.each do |column| %> <%= button_to "The Stream", card_triage_path(card), method: :delete,
<%= button_to_set_column card, column %> class: [ "workflow-stage workflow-stage--stream btn", { "workflow-stage--current": card.awaiting_triage? } ],
<% end %> role: "radio",
aria: { checked: card.awaiting_triage? },
form_class: "flex align-center gap-half" %>
<%= button_to "Closed", card_closure_path(card, reason: "Completed"), <% card.collection.columns.each do |column| %>
class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ], <%= button_to_set_column card, column %>
form_class: "flex align-center gap-half" %> <% end %>
</div>
<%= button_to "Closed", card_closure_path(card, reason: "Completed"),
class: [ "workflow-stage btn", { "workflow-stage--current": card.closed? } ],
role: "radio",
aria: { checked: card.closed? },
form_class: "flex align-center gap-half" %>
</div>