mirror of
https://github.com/we-promise/sure.git
synced 2026-09-03 05:41:18 +00:00
Victor Dusart
ca876fa02a
The selected view lives only in the request params, so a reload renders the
default "Total value" chart. Browsers restore form control state on reload,
which left the selector showing the previously picked view while the chart
below it showed the total value. Opting the select out of autocomplete makes
it fall back to the server-rendered default alongside the chart.
Also switch the selector labels and the empty state to absolute i18n keys.
Lazy `t(".")` lookups resolve against a lowercased scope (`ui.account.chart`)
while the locale files declare the `UI:` namespace, so they silently rendered
titleized key names.
60 lines
2.6 KiB
ERB
60 lines
2.6 KiB
ERB
<div id="<%= dom_id(account, :chart) %>" class="bg-container shadow-border-xs rounded-xl space-y-2">
|
|
<div class="flex justify-between flex-col-reverse lg:flex-row gap-2 px-4 pt-4 mb-2">
|
|
<div class="space-y-2 w-full">
|
|
<div class="flex items-center gap-1">
|
|
<%= tag.p title, class: "text-sm font-medium text-secondary" %>
|
|
|
|
<% if account.supports_trades? %>
|
|
<%= render "investments/value_tooltip", balance: account.balance_money, holdings: holdings_value_money, cash: account.cash_balance_money %>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex flex-row gap-2 items-baseline">
|
|
<%= tag.p view_balance_display, class: "text-primary text-3xl font-medium truncate privacy-sensitive" %>
|
|
|
|
<% if converted_balance_display %>
|
|
<%= tag.p converted_balance_display, class: "text-sm font-medium text-secondary privacy-sensitive" %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-center gap-2">
|
|
<% if account.supports_trades? %>
|
|
<%= form_with url: account_path(account), method: :get, data: { controller: "auto-submit-form" } do |form| %>
|
|
<%= form.select :chart_view,
|
|
[[t("UI.account.chart.views.total_value"), "balance"], [t("UI.account.chart.views.holdings"), "holdings_balance"], [t("UI.account.chart.views.cash"), "cash_balance"], [t("UI.account.chart.views.gains"), "gains"]],
|
|
{ selected: view },
|
|
class: "bg-container border border-secondary rounded-lg text-sm pr-7 cursor-pointer text-primary focus:outline-hidden focus:ring-0",
|
|
autocomplete: "off",
|
|
data: { "auto-submit-form-target": "auto" } %>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<%= render UI::PeriodPicker.new(
|
|
selected: period,
|
|
url: account_path(account),
|
|
extra_params: account.supports_trades? ? { chart_view: view } : {}
|
|
) %>
|
|
</div>
|
|
</div>
|
|
|
|
<%= turbo_frame_tag dom_id(@account, :chart_details) do %>
|
|
<div class="px-4">
|
|
<%= render partial: "shared/trend_change", locals: { trend: trend, comparison_label: comparison_label } %>
|
|
</div>
|
|
|
|
<div class="h-64 pb-4">
|
|
<% if series.any? %>
|
|
<div
|
|
id="lineChart"
|
|
class="w-full h-full privacy-sensitive"
|
|
data-controller="time-series-chart"
|
|
data-time-series-chart-data-value="<%= series.to_json %>"></div>
|
|
<% else %>
|
|
<div class="w-full h-full flex items-center justify-center">
|
|
<p class="text-secondary text-sm"><%= t("UI.account.chart.no_data_available") %></p>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|