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

Enhance cash flow dashboard to handle empty data scenarios. Update Sankey diagram rendering to conditionally display a placeholder message when no cash flow data is available, improving user experience and clarity.

This commit is contained in:
Josh Pigford 2025-05-21 05:34:42 -05:00
parent cc9a75ee28
commit 3d2213b760
2 changed files with 47 additions and 26 deletions

View file

@ -14,11 +14,31 @@
<% 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>
<% if sankey_data[:links].present? %>
<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>
<% else %>
<div class="h-[300px] lg:h-[340px] bg-container py-4 flex flex-col items-center justify-center">
<div class="space-y-3 text-center flex flex-col items-center">
<%= render FilledIconComponent.new(
variant: :container,
icon: "activity" # cashflow placeholder icon
) %>
<p class="text-sm font-medium text-primary">No cash flow data for this time period</p>
<p class="text-secondary text-sm">Add transactions to display cash flow data or expand the time period</p>
<%= render LinkComponent.new(
text: "Add transaction",
icon: "plus",
href: new_transaction_path,
frame: :modal
) %>
</div>
</div>
<% end %>
</div>