1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-04 13:05:19 +02:00

Sankey Diagram (#2269)

* Enhance cash flow dashboard with new cash flow period handling and improved Sankey diagram rendering. Update D3 and related dependencies for better performance and features.

* Fix Rubocop offenses

* Refactor Sankey chart controller to use Number.parseFloat for value formatting and improve code readability by restructuring conditional logic for node shapes.
This commit is contained in:
Josh Pigford 2025-05-20 13:31:05 -05:00 committed by GitHub
parent caf35701ef
commit 868d4ede6e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
44 changed files with 451 additions and 20 deletions

View file

@ -31,13 +31,21 @@
period: @period
} %>
</section>
<section>
<%= render "pages/dashboard/balance_sheet", balance_sheet: @balance_sheet %>
</section>
<%= turbo_frame_tag "cashflow_sankey_section" do %>
<section class="bg-container py-4 rounded-xl shadow-border-xs">
<%= render partial: "pages/dashboard/cashflow_sankey", locals: {
sankey_data: @cashflow_sankey_data,
period: @cashflow_period
} %>
</section>
<% end %>
<% else %>
<section>
<%= render "pages/dashboard/no_accounts_graph_placeholder" %>
</section>
<% end %>
<section>
<%= render "pages/dashboard/balance_sheet", balance_sheet: @balance_sheet %>
</section>
</div>

View file

@ -0,0 +1,24 @@
<%# locals: (sankey_data:, period:) %>
<div id="cashflow-sankey-chart">
<div class="flex justify-between items-center gap-4 px-4 mb-4">
<h2 class="text-lg font-medium inline-flex items-center gap-1.5">
Cashflow
</h2>
<%= form_with url: root_path, method: :get, data: { controller: "auto-submit-form", turbo_frame: "cashflow_sankey_section" } do |form| %>
<%= form.select :cashflow_period,
Period.as_options,
{ selected: period.key },
data: { "auto-submit-form-target": "auto" },
class: "bg-container border border-secondary font-medium rounded-lg px-3 py-2 text-sm pr-7 cursor-pointer text-primary focus:outline-hidden focus:ring-0" %>
<% end %>
</div>
<div class="w-full h-96">
<div
data-controller="sankey-chart"
data-sankey-chart-data-value="<%= sankey_data.to_json %>"
data-sankey-chart-currency-symbol-value="<%= sankey_data[:currency_symbol] %>"
class="w-full h-full"></div>
</div>
</div>