1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-02 20:15:22 +02:00

Add trends to sidebar account list (#697)

This commit is contained in:
Josh Brown 2024-04-29 14:56:38 +01:00 committed by GitHub
parent 93953499a6
commit 7f491f5064
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 87 additions and 28 deletions

View file

@ -8,20 +8,58 @@
<div class="text-left"><%= type.model_name.human %></div>
<div class="ml-auto flex flex-col items-end">
<p class="text-right"><%= format_money group.sum %></p>
<div class="flex items-center gap-1">
<%=
tag.div(
id: "#{group.name}_sparkline",
class: "h-3 w-8 ml-auto",
data: {
controller: "time-series-chart",
"time-series-chart-data-value": group.series.to_json,
"time-series-chart-stroke-width-value": 1,
"time-series-chart-use-labels-value": false,
"time-series-chart-use-tooltip-value": false
}
)
%>
<% styles = trend_styles(group.series.trend) %>
<span class="text-xs <%= styles[:text_class] %>"><%= sprintf("%+.2f", group.series.trend.percent) %>%</span>
</div>
</div>
</summary>
<% group.children.each do |account_value_node| %>
<%= link_to account_path(account_value_node.original), class: "flex items-center w-full gap-3 px-2 py-3 mb-1 hover:bg-gray-100 rounded-[10px]" do %>
<% account = account_value_node.original %>
<%= link_to account_path(account), class: "flex items-center w-full gap-3 px-3 py-2 mb-1 hover:bg-gray-100 rounded-[10px]" do %>
<%= image_tag account_logo_url(account), class: "w-6 h-6" %>
<div>
<p class="font-medium"><%= account_value_node.name %></p>
<% if account_value_node.original.subtype %>
<p class="text-xs text-gray-500"><%= account_value_node.original.subtype&.humanize %></p>
<% if account.subtype %>
<p class="text-xs text-gray-500"><%= account.subtype&.humanize %></p>
<% end %>
</div>
<p class="ml-auto font-medium"><%= format_money account_value_node.original.balance_money %></p>
<div class="flex flex-col ml-auto font-medium text-right">
<p><%= format_money account.balance_money %></p>
<div class="flex items-center gap-1">
<%=
tag.div(
id: dom_id(account, :list_sparkline),
class: "h-3 w-8 ml-auto",
data: {
controller: "time-series-chart",
"time-series-chart-data-value": account_value_node.series.to_json,
"time-series-chart-stroke-width-value": 1,
"time-series-chart-use-labels-value": false,
"time-series-chart-use-tooltip-value": false
}
)
%>
<% styles = trend_styles(account_value_node.series.trend) %>
<span class="text-xs <%= styles[:text_class] %>"><%= sprintf("%+.2f", account_value_node.series.trend.percent) %>%</span>
</div>
</div>
<% end %>
<% end %>
<%= link_to new_account_path(step: "method", type: type.name.demodulize), class: "flex items-center gap-4 px-2 py-3 mb-1 text-gray-500 text-sm font-medium rounded-[10px] hover:bg-gray-100", data: { turbo_frame: "modal" } do %>
<%= link_to new_account_path(step: "method", type: type.name.demodulize), class: "flex items-center min-h-10 gap-4 px-3 py-2 mb-1 text-gray-500 text-sm font-medium rounded-[10px] hover:bg-gray-100", data: { turbo_frame: "modal" } do %>
<%= lucide_icon("plus", class: "w-5 h-5") %>
<p>New <%= type.model_name.human.downcase %></p>
<% end %>

View file

@ -0,0 +1,5 @@
<turbo-frame id="account-list" target="_top">
<% account_groups(period: @period).each do |group| %>
<%= render "accounts/account_list", group: group %>
<% end %>
</turbo-frame>