Docker/Maybe
Docker/Maybe
1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-09 07:25:19 +02:00
Code Issues Releases Activity Actions

Improve rules - add name, allow sorting, improve UI (#2177)

Browse source 
* Add ability to name a rule

* Add sorting by name and date,

* Improve rule page and form design

* Small header tweak

* Improve sorting click areas by including icon

* Fix brakeman

* Use icon helper instead of lucide_icon helper

* Fix double headers with new DialogComponent

* Use updated_at for sorting instead of created_at

* Use copy-plus icon for compound rules

* Remove icons and change IF/THEN/FOR font in edit form

* Use text-secondary on disabled rules

* First pass at redesigning the sorting menu

* New rule list

* Borders instead of shadows

* Apply proper text color to TO in edit form

* Improve dark mode with proper background color classes

* Use border-secondary

* Add touch: true to conditions and actions of a rule, so updated_at works as expected

* Fix db schema

* Change sort direction to be a LinkComponent outside of the form for better sort behavior

* Clean up dropdown design to match figma

* Match tags/categories design

* Fix name text color, add bg-divider background for dividers

* Fix family subscription tests (thanks zach!)
This commit is contained in:
Alex Hatzenbuhler 2025-05-13 14:53:13 -05:00 • committed by GitHub
parent 050d5ebaad
commit bebe7b40d6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 176 additions and 79 deletions
Download patch file Download diff file Expand all files Collapse all files

58
app/views/rules/_form.html.erb
View file

@ -1,6 +1,6 @@
<%# locals: (rule:) %>
<%= styled_form_with model: rule, class: "space-y-4",
<%= styled_form_with model: rule, class: "space-y-6",
data: { controller: "rules", rule_registry_value: rule.registry.to_json } do |f| %>
<%= f.hidden_field :resource_type, value: rule.resource_type %>
@ -10,7 +10,19 @@
<% end %>
<section class="space-y-4">
<h3 class="text-sm font-medium text-primary">If <%= rule.resource_type %></h3>
<div class="flex items-center gap-1 text-secondary">
<%= icon "tag", size: "sm" %>
<h3 class="text-sm font-medium text-primary">Rule name (optional)</h3>
</div>
<div class="ml-6">
<%= f.text_field :name, placeholder: "Enter a name for this rule", class: "form-field__input" %>
</div>
</section>
<section class="space-y-4">
<div class="flex items-center gap-1 text-secondary">
<h3 class="text-sm font-medium text-primary">IF</h3>
</div>
<%# Condition Group template, used by Stimulus controller to add new conditions dynamically %>
<template data-rules-target="conditionGroupTemplate">
@ -26,24 +38,27 @@
<% end %>
</template>
<ul data-rules-target="conditionsList" class="space-y-3 mb-4">
<%= f.fields_for :conditions do |cf| %>
<% if cf.object.compound? %>
<%= render "rule/conditions/condition_group", form: cf %>
<% else %>
<%= render "rule/conditions/condition", form: cf %>
<div class="ml-6 space-y-4">
<ul data-rules-target="conditionsList" class="space-y-3">
<%= f.fields_for :conditions do |cf| %>
<% if cf.object.compound? %>
<%= render "rule/conditions/condition_group", form: cf %>
<% else %>
<%= render "rule/conditions/condition", form: cf %>
<% end %>
<% end %>
<% end %>
</ul>
</ul>
<div class="flex items-center gap-2">
<%= render ButtonComponent.new(text: "Add condition", icon: "plus", variant: "ghost", type: "button", data: { action: "rules#addCondition" }) %>
<%= render ButtonComponent.new(text: "Add condition group", icon: "boxes", variant: "ghost", type: "button", data: { action: "rules#addConditionGroup" }) %>
<%= render ButtonComponent.new(text: "Add condition group", icon: "copy-plus", variant: "ghost", type: "button", data: { action: "rules#addConditionGroup" }) %>
</div>
</section>
<section class="space-y-4">
<h3 class="text-sm font-medium text-primary">Then</h3>
<div class="flex items-center gap-1 text-secondary">
<h3 class="text-sm font-medium text-primary">THEN</h3>
</div>
<%# Action template, used by Stimulus controller to add new actions dynamically %>
<template data-rules-target="actionTemplate">
@ -52,22 +67,25 @@
<% end %>
</template>
<ul data-rules-target="actionsList" class="space-y-3">
<%= f.fields_for :actions do |af| %>
<%= render "rule/actions/action", form: af %>
<% end %>
</ul>
<div class="ml-6 space-y-4">
<ul data-rules-target="actionsList" class="space-y-3">
<%= f.fields_for :actions do |af| %>
<%= render "rule/actions/action", form: af %>
<% end %>
</ul>
<%= render ButtonComponent.new(text: "Add action", icon: "plus", variant: "ghost", type: "button", data: { action: "rules#addAction" }) %>
</section>
<section class="space-y-4">
<h3 class="text-sm font-medium text-primary">Apply this</h3>
<div class="flex items-center gap-1 text-secondary">
<h3 class="text-sm font-medium text-primary">FOR</h3>
</div>
<div class="space-y-2">
<div class="ml-6 space-y-3">
<div class="flex items-center gap-2">
<%= f.radio_button :effective_date_enabled, false, checked: rule.effective_date.nil?, data: { action: "rules#clearEffectiveDate" } %>
<%= f.label :effective_date_enabled_false, "To all past and future #{rule.resource_type}s", class: "text-sm text-primary" %>
<%= f.label :effective_date_enabled_false, "All past and future #{rule.resource_type}s", class: "text-sm text-primary" %>
</div>
<div class="flex items-center gap-2">