mirror of
https://github.com/we-promise/sure.git
synced 2026-05-09 05:35:00 +00:00
* refactor(design-system): migrate fg-* utilities to text-* and remove namespace
The design system carried two parallel namespaces for foreground colors:
text-* (canonical, ~2,000 uses) and fg-* (32 uses). Most fg-* tokens
were 1:1 duplicates of a text-* counterpart. fg-gray was nearly
identical to text-secondary, with a one-step shade difference in dark
mode.
This PR migrates all 32 usages to their text-* equivalents and removes
the fg-* block from the design tokens. Closes #1606.
Mapping:
- fg-inverse -> text-inverse (20 usages, identical light/dark values)
- fg-gray -> text-secondary (7 usages; light values match, dark is
one step lighter: gray-300 vs gray-400)
- fg-primary -> text-primary (3 usages, identical values)
- fg-subdued -> text-subdued (2 usages, identical values)
The four other fg-* tokens (fg-contrast, fg-primary-variant,
fg-secondary, fg-secondary-variant) had zero usages despite being
defined; they are removed without replacement.
JSON / build:
- design/tokens/sure.tokens.json: $version 1.0.0 -> 2.0.0 (breaking
schema change per the policy added in #1620). 8 fg-* token
definitions removed.
- button-bg-ghost-hover's dark value still references "fg-inverse"
internally; rewritten to "bg-gray-800 text-inverse" so the cleanup
doesn't break that utility.
- _generated.css regenerated. 42 utility blocks now (was 50).
Lookbook tokens preview:
- The Text & foregrounds section dropped its split between text-*
(canonical) and fg-* (legacy). Now a single section listing the
five text-* utilities. The "(legacy)" framing is gone since there's
no legacy left.
README:
- design/tokens/README.md's button-bg-ghost-hover edge-case example
updated to reflect the new "bg-gray-800 text-inverse" dark value.
Visual review needed in dark mode:
- Anywhere icons use the application_helper#icon helper with
color: "default" (most icons in the app). The default class moved
from fg-gray (gray-400 dark) to text-secondary (gray-300 dark), so
default-color icons render slightly lighter in dark mode.
- DS::Buttonish icons in secondary buttons (same shade shift).
- DS::Link icons (same).
- Time series chart axes (same).
- All tooltips, account add flow, settings hostings buttons,
invitations, AI consent, family export, danger-zone buttons --
these used fg-inverse, which is identical to text-inverse, so no
visual change expected.
* fix(design-system): use inverse pair on tooltips for readable dark mode
* fix(lookbook): use semantic tokens in menu preview header text
* fix(lookbook): set text-primary on layout body so previews inherit theme
* fix(design-system): keep shadows dark-toned in dark mode
Inverting shadows to white|8% on dark surfaces produces a halo
effect rather than an elevation cue, and stacks redundantly with
the alpha-white 1px ring already in shadow-border-*.
Switch dark-mode shadows to black at progressively higher alpha
(25%/30%/35%/40%/50% for xs..xl) so they read as actual cast
shadows on near-black surfaces. Surface-tint differences and the
existing alpha-white border ring continue to handle elevation
hierarchy and edge definition.
Approach matches Material 3, Apple HIG, IBM Carbon, Refactoring UI,
and the dark-mode shadows used in Linear/Vercel/Stripe.
* fix(design-system): set text-primary on DS::Dialog element
Browser UA stylesheets apply color: black directly to <dialog>,
which overrides ancestor inheritance even when a body or html
ancestor sets a theme-aware color. Unstyled child content then
renders black regardless of theme.
Setting text-primary on the dialog element itself defeats the UA
override and lets descendants inherit the semantic token.
* fix(lookbook): use shadow css vars in effects preview so dark theme renders
* Revert "fix(design-system): keep shadows dark-toned in dark mode"
This reverts commit 3e9d76ed0b.
* fix(design-system): use opacity-70 instead of text-inverse/70 in value tooltip
The custom @utility text-inverse expands to @apply text-white and
isn't modifier-aware, so text-inverse/70 produced no CSS at all and
the muted labels fell through to inherited color (invisible on the
white pill in dark mode).
Replace with text-inverse + opacity-70. Same visual effect, works
with the existing utility definition.
205 lines
5.7 KiB
Ruby
205 lines
5.7 KiB
Ruby
module ApplicationHelper
|
|
include Pagy::Frontend
|
|
|
|
def product_name
|
|
Rails.configuration.x.product_name
|
|
end
|
|
|
|
def brand_name
|
|
Rails.configuration.x.brand_name
|
|
end
|
|
|
|
def styled_form_with(**options, &block)
|
|
options[:builder] = StyledFormBuilder
|
|
form_with(**options, &block)
|
|
end
|
|
|
|
def icon(key, size: "md", color: "default", custom: false, as_button: false, **opts)
|
|
extra_classes = opts.delete(:class)
|
|
sizes = { xs: "w-3 h-3", sm: "w-4 h-4", md: "w-5 h-5", lg: "w-6 h-6", xl: "w-7 h-7", "2xl": "w-8 h-8" }
|
|
colors = { default: "text-secondary", white: "text-inverse", success: "text-success", warning: "text-warning", destructive: "text-destructive", current: "text-current" }
|
|
|
|
icon_classes = class_names(
|
|
"shrink-0",
|
|
sizes[size.to_sym],
|
|
colors[color.to_sym],
|
|
extra_classes
|
|
)
|
|
|
|
if custom
|
|
inline_svg_tag("#{key}.svg", class: icon_classes, **opts)
|
|
elsif as_button
|
|
render DS::Button.new(variant: "icon", class: extra_classes, icon: key, size: size, type: "button", **opts)
|
|
else
|
|
lucide_icon(key, class: icon_classes, **opts)
|
|
end
|
|
end
|
|
|
|
# Convert alpha (0-1) to 8-digit hex (00-FF)
|
|
def hex_with_alpha(hex, alpha)
|
|
alpha_hex = (alpha * 255).round.to_s(16).rjust(2, "0")
|
|
"#{hex}#{alpha_hex}"
|
|
end
|
|
|
|
def title(page_title)
|
|
content_for(:title) { page_title }
|
|
end
|
|
|
|
def header_title(page_title)
|
|
content_for(:header_title) { page_title }
|
|
end
|
|
|
|
def header_description(page_description)
|
|
content_for(:header_description) { page_description }
|
|
end
|
|
|
|
def page_active?(path)
|
|
current_page?(path) || (request.path.start_with?(path) && path != "/")
|
|
end
|
|
|
|
# Wrapper around I18n.l to support custom date formats
|
|
def format_date(object, format = :default, options = {})
|
|
date = object.to_date
|
|
|
|
format_code = options[:format_code] || Current.family&.date_format
|
|
|
|
if format_code.present?
|
|
date.strftime(format_code)
|
|
else
|
|
I18n.l(date, format: format, **options)
|
|
end
|
|
end
|
|
|
|
|
|
def family_moniker
|
|
Current.family&.moniker_label || "Family"
|
|
end
|
|
|
|
def family_moniker_downcase
|
|
family_moniker.downcase
|
|
end
|
|
|
|
def family_moniker_plural
|
|
Current.family&.moniker_label_plural || "Families"
|
|
end
|
|
|
|
def family_moniker_plural_downcase
|
|
family_moniker_plural.downcase
|
|
end
|
|
|
|
def format_money(number_or_money, options = {})
|
|
return nil unless number_or_money
|
|
|
|
Money.new(number_or_money).format(options)
|
|
end
|
|
|
|
def totals_by_currency(collection:, money_method:, separator: " | ", negate: false)
|
|
collection.group_by(&:currency)
|
|
.transform_values { |item| calculate_total(item, money_method, negate) }
|
|
.map { |_currency, money| format_money(money) }
|
|
.join(separator)
|
|
end
|
|
|
|
def currency_picker_options_for_family(family = Current.family, extra: [])
|
|
return Money::Currency.as_options.map(&:iso_code) unless family
|
|
|
|
family.enabled_currency_codes(extra:)
|
|
end
|
|
|
|
def currency_label(currency_or_code)
|
|
currency = currency_or_code.is_a?(Money::Currency) ? currency_or_code : Money::Currency.new(currency_or_code)
|
|
"#{currency.name} (#{currency.iso_code})"
|
|
end
|
|
|
|
def show_super_admin_bar?
|
|
if params[:admin].present?
|
|
cookies.permanent[:admin] = params[:admin]
|
|
end
|
|
|
|
cookies[:admin] == "true"
|
|
end
|
|
|
|
def assistant_icon
|
|
type = ENV["ASSISTANT_TYPE"].presence || Current.family&.assistant_type.presence || "builtin"
|
|
type == "external" ? "claw" : "ai"
|
|
end
|
|
|
|
def default_ai_model
|
|
# Always return a valid model, never nil or empty
|
|
# Delegates to Chat.default_model for consistency
|
|
Chat.default_model
|
|
end
|
|
|
|
# Renders Markdown text using Redcarpet
|
|
def markdown(text)
|
|
return "" if text.blank?
|
|
|
|
renderer = Redcarpet::Render::HTML.new(
|
|
hard_wrap: true,
|
|
link_attributes: { target: "_blank", rel: "noopener noreferrer" }
|
|
)
|
|
|
|
markdown = Redcarpet::Markdown.new(
|
|
renderer,
|
|
autolink: true,
|
|
tables: true,
|
|
fenced_code_blocks: true,
|
|
strikethrough: true,
|
|
superscript: true,
|
|
underline: true,
|
|
highlight: true,
|
|
quote: true,
|
|
footnotes: true
|
|
)
|
|
|
|
markdown.render(text).html_safe
|
|
end
|
|
|
|
# Generate the callback URL for Enable Banking OAuth (used in views and controller).
|
|
# In production, uses the standard Rails route.
|
|
# In development, uses DEV_WEBHOOKS_URL if set (e.g., ngrok URL).
|
|
def enable_banking_callback_url
|
|
return callback_enable_banking_items_url if Rails.env.production?
|
|
|
|
ENV.fetch("DEV_WEBHOOKS_URL", root_url).chomp("/") + "/enable_banking_items/callback"
|
|
end
|
|
|
|
# Formats quantity with adaptive precision based on the value size.
|
|
# Shows more decimal places for small quantities (common with crypto).
|
|
#
|
|
# @param qty [Numeric] The quantity to format
|
|
# @param max_precision [Integer] Maximum precision for very small numbers
|
|
# @return [String] Formatted quantity with appropriate precision
|
|
def format_quantity(qty)
|
|
return "0" if qty.nil? || qty.zero?
|
|
|
|
abs_qty = qty.abs
|
|
|
|
precision = if abs_qty >= 1
|
|
1 # "10.5"
|
|
elsif abs_qty >= 0.01
|
|
2 # "0.52"
|
|
elsif abs_qty >= 0.0001
|
|
4 # "0.0005"
|
|
else
|
|
8 # "0.00000052"
|
|
end
|
|
|
|
# Use strip_insignificant_zeros to avoid trailing zeros like "0.50000000"
|
|
number_with_precision(qty, precision: precision, strip_insignificant_zeros: true)
|
|
end
|
|
|
|
private
|
|
def calculate_total(item, money_method, negate)
|
|
# Filter out transfer-type transactions from entries
|
|
# Only Entry objects have entryable transactions, Account objects don't
|
|
items = item.reject do |i|
|
|
i.is_a?(Entry) &&
|
|
i.entryable.is_a?(Transaction) &&
|
|
i.entryable.transfer?
|
|
end
|
|
total = items.sum(&money_method)
|
|
negate ? -total : total
|
|
end
|
|
end
|