mirror of
https://github.com/we-promise/sure.git
synced 2026-05-08 21:25:00 +00:00
83cb287294
* chore(design-system): swap raw gray classes for semantic tokens in settings/
Pilot for the broader raw-color sweep. Maps 21 occurrences across 11
files to design-system equivalents:
- text-white bg-gray-900 hover:bg-gray-800 (CTA buttons)
-> text-inverse button-bg-primary hover:button-bg-primary-hover
- bg-gray-25 / bg-gray-50 / bg-gray-100 (subtle surface backgrounds)
-> bg-surface-inset
- bg-gray-800 (tooltip pills) -> bg-inverse
- text-white inside tooltips -> text-inverse
- text-gray-300 (muted tooltip labels) -> text-inverse opacity-70
- text-gray-600 (muted body text) -> text-secondary
- hover:text-gray-700 -> hover:text-primary
- focus:ring-gray-900 -> focus:ring-button-bg-primary
The 7 status-indicator dots (`bg-gray-400`) are intentionally left
as raw classes. Gray-400 against both light and dark container bgs
gives reasonable contrast either way, and there's no semantic token
that fits a "neutral inactive indicator" use case yet. Worth a
follow-up if a `bg-subdued` token would benefit other places.
* fix(design-system): use theme-aware focus ring on provider submit buttons
Two issues caught in code review:
1. focus:ring-button-bg-primary silently emits no CSS (CodeRabbit, Codex).
button-bg-primary is a custom @utility, not a theme color, so Tailwind's
ring-{name} resolution finds no --color-button-bg-primary and falls
back to the default. Replaces with focus:ring-gray-900
theme-dark:focus:ring-white — same color flip as the button bg, but
resolved through theme colors so ring-{name} actually generates CSS.
2. _enable_banking_panel.html.erb dropped focus-ring + transition entirely
in the original sweep (CodeRabbit). Restores parity with the other
provider panels using the corrected ring classes.
Long-term cleanup: tracked under issue #1653 (modifier-aware utilities)
to make button-bg-primary also a theme color so ring-button-bg-primary
becomes valid.
87 lines
3.2 KiB
Plaintext
87 lines
3.2 KiB
Plaintext
<%
|
|
# Parameters:
|
|
# - configuration: Provider::Configurable::Configuration object
|
|
%>
|
|
|
|
<div class="space-y-4">
|
|
<div>
|
|
<% if configuration.provider_description.present? %>
|
|
<div class="text-sm text-secondary mb-4 prose prose-sm">
|
|
<%= markdown(configuration.provider_description).html_safe %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% env_configured = configuration.fields.any? { |f| f.env_key && ENV[f.env_key].present? } %>
|
|
<% if env_configured %>
|
|
<p class="text-sm text-secondary">
|
|
Configuration can be set via environment variables or overridden below.
|
|
</p>
|
|
<% end %>
|
|
|
|
<% if configuration.fields.any? { |f| f.description.present? } %>
|
|
<p class="text-secondary text-sm mb-4">Field descriptions:</p>
|
|
<ul class="text-sm text-secondary mb-4 list-disc ml-6 space-y-2">
|
|
<% configuration.fields.each do |field| %>
|
|
<% if field.description.present? %>
|
|
<li><strong><%= field.label %>:</strong> <%= field.description %></li>
|
|
<% end %>
|
|
<% end %>
|
|
</ul>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= styled_form_with model: Setting.new,
|
|
url: settings_providers_path,
|
|
method: :patch do |form| %>
|
|
<div class="space-y-4">
|
|
<% configuration.fields.each do |field| %>
|
|
<%
|
|
env_value = ENV[field.env_key] if field.env_key
|
|
# Use dynamic hash-style access - works without explicit field declaration
|
|
setting_value = Setting[field.setting_key]
|
|
|
|
# Show the setting value if it exists, otherwise show ENV value
|
|
# This allows users to see what they've overridden
|
|
current_value = setting_value.presence || env_value
|
|
|
|
# Mask secret values if they exist
|
|
display_value = if field.secret && current_value.present?
|
|
"********"
|
|
else
|
|
current_value
|
|
end
|
|
|
|
# Determine input type
|
|
input_type = field.secret ? "password" : "text"
|
|
|
|
# Don't disable fields - allow overriding ENV variables
|
|
disabled = false
|
|
%>
|
|
|
|
<%= form.text_field field.setting_key,
|
|
label: field.label,
|
|
type: input_type,
|
|
placeholder: field.default || (field.required ? "" : "Optional"),
|
|
value: display_value,
|
|
disabled: disabled %>
|
|
<% end %>
|
|
|
|
<div class="flex justify-end">
|
|
<%= form.submit "Save Configuration",
|
|
class: "inline-flex items-center justify-center rounded-lg px-4 py-2 text-sm font-medium text-inverse button-bg-primary hover:button-bg-primary-hover focus:outline-none focus:ring-2 focus:ring-gray-900 theme-dark:focus:ring-white focus:ring-offset-2 transition-colors" %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%# Show configuration status %>
|
|
<div class="flex items-center gap-2 mt-4">
|
|
<% if configuration.configured? %>
|
|
<div class="w-2 h-2 bg-success rounded-full"></div>
|
|
<p class="text-sm text-secondary">Configured and ready to use</p>
|
|
<% else %>
|
|
<div class="w-2 h-2 bg-gray-400 rounded-full"></div>
|
|
<p class="text-sm text-secondary">Not configured</p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|