mirror of
https://github.com/we-promise/sure.git
synced 2026-04-19 20:14:08 +00:00
6f0e410684
* Handle Turbo updates with tabs Fixes #491 * Add Filterable concern for controllers * Add trendline chart * Extract common UI to partials * Series refactor * Put placeholders for calculations in * Add classification generated column to account * Add basic net worth calculation * Add net worth tests * Get net worth graph working * Fix lint errors * Implement asset grouping query * Make trends and series more intuitive * Fully functional dashboard * Remove logging
58 lines
2.8 KiB
Plaintext
58 lines
2.8 KiB
Plaintext
<%= turbo_stream_from @account %>
|
|
<% balance = Money.from_amount(@account.balance, @account.currency) %>
|
|
<div class="space-y-4">
|
|
<div class="flex justify-between items-center">
|
|
<div class="flex items-center gap-3">
|
|
<div class="bg-green-600/10 rounded-full h-8 w-8 flex items-center justify-center">
|
|
<span class="text-green-600"><%= @account.name[0].upcase %></span>
|
|
</div>
|
|
<h2 class="font-medium text-xl"><%= @account.name %></h2>
|
|
</div>
|
|
<div class="flex items-center gap-3">
|
|
<div class="relative cursor-not-allowed">
|
|
<div class="flex items-center gap-2 px-3 py-2">
|
|
<span class="text-gray-900"><%= balance.currency %> <%= balance.symbol %></span>
|
|
<%= lucide_icon("chevron-down", class: "w-5 h-5 text-gray-500") %>
|
|
</div>
|
|
</div>
|
|
<div class="cursor-not-allowed">
|
|
<%= lucide_icon("more-horizontal", class: "w-5 h-5 text-gray-500") %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<%= turbo_frame_tag "sync_message" do %>
|
|
<%= render partial: "accounts/sync_message", locals: { is_syncing: @account.status == "SYNCING" } %>
|
|
<% end %>
|
|
<div class="bg-white shadow-xs rounded-xl border border-alpha-black-25 rounded-lg">
|
|
<div class="p-4 flex justify-between">
|
|
<div class="space-y-2">
|
|
<%= render partial: "shared/balance_heading", locals: {
|
|
label: "Total Value",
|
|
period: @period,
|
|
balance: Money.from_amount(@account.balance, @account.currency),
|
|
trend: @balance_series.trend
|
|
}
|
|
%>
|
|
</div>
|
|
<%= render partial: "shared/period_dropdown", locals: { period: @period, path: account_path(@account) } %>
|
|
</div>
|
|
<div class="h-96 flex items-center justify-center text-2xl font-bold">
|
|
<%= render partial: "shared/line_chart", locals: { series: @balance_series } %>
|
|
</div>
|
|
</div>
|
|
<div data-controller="tabs" data-tabs-active-class="bg-gray-100" data-tabs-default-tab-value="account-history-tab">
|
|
<div class="flex gap-1 text-sm text-gray-900 font-medium mb-4">
|
|
<button data-id="account-history-tab" class="p-2 rounded-lg" data-tabs-target="btn" data-action="click->tabs#select">History</button>
|
|
<button data-id="account-transactions-tab" class="p-2 rounded-lg" data-tabs-target="btn" data-action="click->tabs#select">Transactions</button>
|
|
</div>
|
|
<div class="min-h-[800px]">
|
|
<div data-tabs-target="tab" id="account-history-tab">
|
|
<%= render partial: "accounts/account_history", locals: { account: @account, valuations: @valuation_series } %>
|
|
</div>
|
|
<div data-tabs-target="tab" id="account-transactions-tab" class="hidden">
|
|
<%= render partial: "accounts/transactions", locals: { transactions: @account.transactions.order(date: :desc) } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|