mirror of
https://github.com/we-promise/sure.git
synced 2026-05-24 04:54:56 +00:00
391364dc4b
Lifts the per-panel status indicator up to each collapsed accordion header so admins can see at a glance which providers are connected without expanding every section. Connected providers sort first. - Add optional status: and meta: locals to settings/_section partial; pill hides via group-open:hidden when the section is expanded - New settings/providers/_status_pill partial (ok/warn/err/off states) - Add SettingsHelper#provider_summary to centralise the connected-vs-not logic already scattered across panel partials - Refactor show.html.erb to pass status to every section and sort family_panels by connection state - Add settings.providers.status.* i18n keys - Add system tests asserting pill renders and sort order https://claude.ai/code/session_01KW2HCN9rP1fiyQuw7Cju9D
42 lines
1.7 KiB
Plaintext
42 lines
1.7 KiB
Plaintext
<%# locals: (title:, subtitle: nil, content:, collapsible: false, open: true, auto_open_param: nil, status: nil, meta: nil) %>
|
|
<% if collapsible %>
|
|
<details <%= "open" if open %>
|
|
class="group bg-container shadow-border-xs rounded-xl p-4"
|
|
<%= "data-controller=\"auto-open\" data-auto-open-param-value=\"#{h(auto_open_param)}\"".html_safe if auto_open_param.present? %>>
|
|
<summary class="flex items-center justify-between gap-2 cursor-pointer rounded-lg list-none [&::-webkit-details-marker]:hidden">
|
|
<div class="flex items-center gap-2">
|
|
<%= icon "chevron-right", class: "text-secondary group-open:transform group-open:rotate-90 transition-transform" %>
|
|
<div>
|
|
<h2 class="text-lg font-medium text-primary"><%= title %></h2>
|
|
<% if subtitle.present? %>
|
|
<p class="text-secondary text-sm"><%= subtitle %></p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<% if status.present? %>
|
|
<div class="flex items-center gap-2 shrink-0 group-open:hidden">
|
|
<% if meta.present? %>
|
|
<span class="text-xs text-subdued"><%= meta %></span>
|
|
<% end %>
|
|
<%= render "settings/providers/status_pill", status: status %>
|
|
</div>
|
|
<% end %>
|
|
</summary>
|
|
<div class="space-y-4 mt-4">
|
|
<%= content %>
|
|
</div>
|
|
</details>
|
|
<% else %>
|
|
<section class="bg-container shadow-border-xs rounded-xl p-4 space-y-4">
|
|
<div>
|
|
<h2 class="text-lg font-medium text-primary"><%= title %></h2>
|
|
<% if subtitle.present? %>
|
|
<p class="text-secondary text-sm mt-1"><%= subtitle %></p>
|
|
<% end %>
|
|
</div>
|
|
<div class="space-y-4">
|
|
<%= content %>
|
|
</div>
|
|
</section>
|
|
<% end %>
|