QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-05-30 07:49:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(savings): add "ONGOING · N" + "COMPLETED · N" section dividers

Browse Source 
Same pattern as the bank-providers page's `AVAILABLE · 3` header (see
`app/views/settings/providers/_search_filters.html.erb` references):
small uppercase tracking-wide secondary label, separator dot, tabular
count. Replaces the prior "Completed · 1" inline label with a more
consistent treatment and adds an "Ongoing · N" header above the active
goals grid.

Name choice: "Ongoing" rather than "Active" because the grid includes
both `active` and `paused` AASM states; "ongoing" reads as still-in-
progress for both. Parallel to the existing "Completed" sibling.
This commit is contained in:
Guillem Arias
2026-05-11 12:35:25 +02:00
parent f70e908043
commit fe9e2dccbe
2 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/views/savings_goals/index.html.erb
View File

@@ -106,6 +106,11 @@
<% end %> <% end %>
<% if @active_goals.any? %> <% if @active_goals.any? %>
<div class="flex items-center gap-1.5 mb-2.5 text-[11px] font-medium uppercase tracking-wide text-secondary">
<span><%= t(".ongoing_section.heading") %></span>
<span class="text-subdued">·</span>
<span class="tabular-nums"><%= @active_goals.size %></span>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3.5"> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3.5">
<% @active_goals.each do |goal| %> <% @active_goals.each do |goal| %>
<%= render Savings::GoalCardComponent.new(goal: goal) %> <%= render Savings::GoalCardComponent.new(goal: goal) %>
@@ -123,8 +128,7 @@
<% if @completed_goals.any? %> <% if @completed_goals.any? %>
<section> <section>
<div class="flex items-center gap-2 mb-3 text-sm text-secondary"> <div class="flex items-center gap-1.5 mb-2.5 text-[11px] font-medium uppercase tracking-wide text-secondary">
<%= icon("circle-check-big", size: "sm") %>
<span><%= t(".completed_section.heading") %></span> <span><%= t(".completed_section.heading") %></span>
<span class="text-subdued">·</span> <span class="text-subdued">·</span>
<span class="tabular-nums"><%= @completed_goals.size %></span> <span class="tabular-nums"><%= @completed_goals.size %></span>

2
config/locales/views/savings_goals/en.yml
View File

@@ -20,6 +20,8 @@ en:
goals_section: goals_section:
heading: Goals heading: Goals
subtitle: Save toward what matters. subtitle: Save toward what matters.
ongoing_section:
heading: Ongoing
completed_section: completed_section:
heading: Completed heading: Completed
search: search: