mirror of
https://github.com/we-promise/sure.git
synced 2026-04-19 03:54:08 +00:00
Add global sync summary component for all providers (#588)
* Add shared sync statistics collection and provider sync summary UI - Introduced `SyncStats::Collector` concern to centralize sync statistics logic, including account, transaction, holdings, and health stats collection. - Added collapsible `ProviderSyncSummary` component for displaying sync summaries across providers. - Updated syncers (e.g., `LunchflowItem::Syncer`) to use the shared collector methods for consistent stats calculation. - Added rake tasks under `dev:sync_stats` for testing and development purposes, including fake stats generation with optional issues. - Enhanced provider-specific views to include sync summaries using the new shared component. * Refactor `ProviderSyncSummary` to improve maintainability - Extracted `severity_color_class` to simplify severity-to-CSS mapping. - Replaced `holdings_label` with `holdings_label_key` for streamlined localization. - Updated locale file to separate `found` and `processed` translations for clarity. --------- Signed-off-by: Juan José Mata <juanjo.mata@gmail.com> Co-authored-by: Josh Waldrep <joshua.waldrep5+github@gmail.com> Co-authored-by: Juan José Mata <juanjo.mata@gmail.com>
This commit is contained in:
LPW
105
app/components/provider_sync_summary.html.erb
Normal file
105
app/components/provider_sync_summary.html.erb
Normal file
@@ -0,0 +1,105 @@
|
||||
<details class="group bg-surface rounded-lg border border-surface-inset/50">
|
||||
<summary class="flex items-center justify-between gap-2 p-3 cursor-pointer">
|
||||
<div class="flex items-center gap-2">
|
||||
<%= helpers.icon "chevron-right", class: "group-open:transform group-open:rotate-90" %>
|
||||
<span class="text-sm text-primary font-medium"><%= t("provider_sync_summary.title") %></span>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 text-xs text-secondary">
|
||||
<% if last_synced_at %>
|
||||
<span><%= t("provider_sync_summary.last_sync", time_ago: last_synced_ago) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</summary>
|
||||
|
||||
<div class="p-3 text-sm text-secondary grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<%# Accounts section - always shown if we have account stats %>
|
||||
<% if total_accounts > 0 || stats.key?("total_accounts") %>
|
||||
<div>
|
||||
<h4 class="text-primary font-medium mb-1"><%= t("provider_sync_summary.accounts.title") %></h4>
|
||||
<div class="flex items-center gap-3 flex-wrap">
|
||||
<span><%= t("provider_sync_summary.accounts.total", count: total_accounts) %></span>
|
||||
<span><%= t("provider_sync_summary.accounts.linked", count: linked_accounts) %></span>
|
||||
<span><%= t("provider_sync_summary.accounts.unlinked", count: unlinked_accounts) %></span>
|
||||
<% if institutions_count.present? %>
|
||||
<span><%= t("provider_sync_summary.accounts.institutions", count: institutions_count) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%# Transactions section - shown if provider collects transaction stats %>
|
||||
<% if has_transaction_stats? %>
|
||||
<div>
|
||||
<h4 class="text-primary font-medium mb-1"><%= t("provider_sync_summary.transactions.title") %></h4>
|
||||
<div class="flex items-center gap-3 flex-wrap">
|
||||
<span><%= t("provider_sync_summary.transactions.seen", count: tx_seen) %></span>
|
||||
<span><%= t("provider_sync_summary.transactions.imported", count: tx_imported) %></span>
|
||||
<span><%= t("provider_sync_summary.transactions.updated", count: tx_updated) %></span>
|
||||
<span><%= t("provider_sync_summary.transactions.skipped", count: tx_skipped) %></span>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%# Holdings section - shown if provider collects holdings stats %>
|
||||
<% if has_holdings_stats? %>
|
||||
<div>
|
||||
<h4 class="text-primary font-medium mb-1"><%= t("provider_sync_summary.holdings.title") %></h4>
|
||||
<div class="flex items-center gap-3">
|
||||
<span><%= t("provider_sync_summary.holdings.#{holdings_label_key}", count: holdings_count) %></span>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%# Health section - always shown %>
|
||||
<div>
|
||||
<h4 class="text-primary font-medium mb-1"><%= t("provider_sync_summary.health.title") %></h4>
|
||||
<div class="flex flex-col gap-1">
|
||||
<div class="flex items-center gap-3 flex-wrap">
|
||||
<% if rate_limited? %>
|
||||
<span class="text-warning">
|
||||
<%= t("provider_sync_summary.health.rate_limited", time_ago: rate_limited_ago || t("provider_sync_summary.health.recently")) %>
|
||||
</span>
|
||||
<% end %>
|
||||
<% if has_errors? %>
|
||||
<span class="text-destructive"><%= t("provider_sync_summary.health.errors", count: total_errors) %></span>
|
||||
<% elsif import_started? %>
|
||||
<span class="text-success"><%= t("provider_sync_summary.health.errors", count: 0) %></span>
|
||||
<% else %>
|
||||
<span><%= t("provider_sync_summary.health.errors", count: 0) %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<%# Data quality warnings %>
|
||||
<% if has_data_quality_issues? %>
|
||||
<div class="flex items-center gap-3 mt-1">
|
||||
<% if data_warnings > 0 %>
|
||||
<div class="flex items-center gap-1">
|
||||
<%= helpers.icon "alert-triangle", size: "sm", color: "warning" %>
|
||||
<span class="text-warning"><%= t("provider_sync_summary.health.data_warnings", count: data_warnings) %></span>
|
||||
</div>
|
||||
<% end %>
|
||||
<% if notices > 0 %>
|
||||
<div class="flex items-center gap-1">
|
||||
<%= helpers.icon "info", size: "sm" %>
|
||||
<span><%= t("provider_sync_summary.health.notices", count: notices) %></span>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<% if data_quality_details.any? %>
|
||||
<details class="mt-2">
|
||||
<summary class="text-xs cursor-pointer text-secondary hover:text-primary">
|
||||
<%= t("provider_sync_summary.health.view_data_quality") %>
|
||||
</summary>
|
||||
<div class="mt-1 pl-2 border-l-2 border-surface-inset space-y-1">
|
||||
<% data_quality_details.each do |detail| %>
|
||||
<p class="text-xs <%= severity_color_class(detail["severity"]) %>"><%= detail["message"] %></p>
|
||||
<% end %>
|
||||
</div>
|
||||
</details>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
157
app/components/provider_sync_summary.rb
Normal file
157
app/components/provider_sync_summary.rb
Normal file
@@ -0,0 +1,157 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
# Reusable sync summary component for provider items.
|
||||
#
|
||||
# This component displays sync statistics in a collapsible panel that can be used
|
||||
# by any provider (SimpleFIN, Plaid, Lunchflow, etc.) to show their sync results.
|
||||
#
|
||||
# @example Basic usage
|
||||
# <%= render ProviderSyncSummary.new(
|
||||
# stats: @sync_stats,
|
||||
# provider_item: @plaid_item
|
||||
# ) %>
|
||||
#
|
||||
# @example With custom institution count
|
||||
# <%= render ProviderSyncSummary.new(
|
||||
# stats: @sync_stats,
|
||||
# provider_item: @simplefin_item,
|
||||
# institutions_count: @simplefin_item.connected_institutions.size
|
||||
# ) %>
|
||||
#
|
||||
class ProviderSyncSummary < ViewComponent::Base
|
||||
attr_reader :stats, :provider_item, :institutions_count
|
||||
|
||||
# @param stats [Hash] The sync statistics hash from sync.sync_stats
|
||||
# @param provider_item [Object] The provider item (must respond to last_synced_at)
|
||||
# @param institutions_count [Integer, nil] Optional count of connected institutions
|
||||
def initialize(stats:, provider_item:, institutions_count: nil)
|
||||
@stats = stats || {}
|
||||
@provider_item = provider_item
|
||||
@institutions_count = institutions_count
|
||||
end
|
||||
|
||||
def render?
|
||||
stats.present?
|
||||
end
|
||||
|
||||
# Account statistics
|
||||
def total_accounts
|
||||
stats["total_accounts"].to_i
|
||||
end
|
||||
|
||||
def linked_accounts
|
||||
stats["linked_accounts"].to_i
|
||||
end
|
||||
|
||||
def unlinked_accounts
|
||||
stats["unlinked_accounts"].to_i
|
||||
end
|
||||
|
||||
# Transaction statistics
|
||||
def tx_seen
|
||||
stats["tx_seen"].to_i
|
||||
end
|
||||
|
||||
def tx_imported
|
||||
stats["tx_imported"].to_i
|
||||
end
|
||||
|
||||
def tx_updated
|
||||
stats["tx_updated"].to_i
|
||||
end
|
||||
|
||||
def tx_skipped
|
||||
stats["tx_skipped"].to_i
|
||||
end
|
||||
|
||||
def has_transaction_stats?
|
||||
stats.key?("tx_seen") || stats.key?("tx_imported") || stats.key?("tx_updated")
|
||||
end
|
||||
|
||||
# Holdings statistics
|
||||
def holdings_found
|
||||
stats["holdings_found"].to_i
|
||||
end
|
||||
|
||||
def holdings_processed
|
||||
stats["holdings_processed"].to_i
|
||||
end
|
||||
|
||||
def has_holdings_stats?
|
||||
stats.key?("holdings_found") || stats.key?("holdings_processed")
|
||||
end
|
||||
|
||||
def holdings_label_key
|
||||
stats.key?("holdings_processed") ? "processed" : "found"
|
||||
end
|
||||
|
||||
def holdings_count
|
||||
stats.key?("holdings_processed") ? holdings_processed : holdings_found
|
||||
end
|
||||
|
||||
# Returns the CSS color class for a data quality detail severity
|
||||
# @param severity [String] The severity level ("warning", "error", or other)
|
||||
# @return [String] The Tailwind CSS class for the color
|
||||
def severity_color_class(severity)
|
||||
case severity
|
||||
when "warning" then "text-warning"
|
||||
when "error" then "text-destructive"
|
||||
else "text-secondary"
|
||||
end
|
||||
end
|
||||
|
||||
# Health statistics
|
||||
def rate_limited?
|
||||
stats["rate_limited"].present? || stats["rate_limited_at"].present?
|
||||
end
|
||||
|
||||
def rate_limited_ago
|
||||
return nil unless stats["rate_limited_at"].present?
|
||||
|
||||
begin
|
||||
helpers.time_ago_in_words(Time.parse(stats["rate_limited_at"]))
|
||||
rescue StandardError
|
||||
nil
|
||||
end
|
||||
end
|
||||
|
||||
def total_errors
|
||||
stats["total_errors"].to_i
|
||||
end
|
||||
|
||||
def import_started?
|
||||
stats["import_started"].present?
|
||||
end
|
||||
|
||||
def has_errors?
|
||||
total_errors > 0
|
||||
end
|
||||
|
||||
# Data quality / warnings
|
||||
def data_warnings
|
||||
stats["data_warnings"].to_i
|
||||
end
|
||||
|
||||
def notices
|
||||
stats["notices"].to_i
|
||||
end
|
||||
|
||||
def data_quality_details
|
||||
stats["data_quality_details"] || []
|
||||
end
|
||||
|
||||
def has_data_quality_issues?
|
||||
data_warnings > 0 || notices > 0 || data_quality_details.any?
|
||||
end
|
||||
|
||||
# Last sync time
|
||||
def last_synced_at
|
||||
provider_item.last_synced_at
|
||||
end
|
||||
|
||||
def last_synced_ago
|
||||
return nil unless last_synced_at
|
||||
|
||||
helpers.time_ago_in_words(last_synced_at)
|
||||
end
|
||||
end
|
||||
Reference in New Issue
Block a user