mirror of
https://github.com/we-promise/sure.git
synced 2026-04-14 09:34:05 +00:00
49b603f478
* Reindent TimeSeries classes * Fix spacing in time series tests * Remove trend tests where current is nil I think if we've gotten this far with a nil value for current, there's a data integrity problem. If we allow this, we'll have to be very defensive in our code. Best to raise and fix early. * Reindent Money class * Refactor TimeSeries artifacts * Use as_json in TimeSeries * Bring back tests for trends where current is nil * Bring back trend test * Correctly enumerate trend test * Use favorable_direction for trend_styles helper * Make trend public in TimeSeries::Value * Allow nil current values in trends I think I might've gotten it wrong before, nils might appear in trends if values are unavailable for snapshots * Clean up TimeSeries::Trend * Skip trend values same class validations if any values are nil * Refactor Money * Remove object parsing in TimeSeries::Value We're only every passing hashes * Refactor trendline chart controller into a time series chart controller * Replace trendline controller * Implement empty state * Port line-chart controller into time-series-chart * Split out methods * Group similar time series chart functionality * Fix indicator color * Fix empty state in time series chart * Replace line-chart controller with time-series-chart controller * Draw empty time series chart if less than 2 data points * Fix favorable direction serialization * Handle integers as well as money * Fix favorable direction serialization * Replace chart types with optional elements * Prevent double-renders when displaying turbo caches of time series charts * Remove ambiguities between time series and series data * Improve time series chart property names * Clean up tooltip template * Match tooltip designs * Apply trendline gradient * Implement trendline split behavior * Use same stroke width on all trend lines * Sort time series data by date * Support percentages * Use data color for guideline circles * Revert "Use data color for guideline circles" This reverts commit f239a1e00f84ae28e32f48315d67cf990e541a8a. * Use expected defaults for time series chart * Include day in time-series chart x-axis labels * favorableDirection -> favorable_direction * data -> datum where appropriate * Hide change data in tooltip for percentages
77 lines
3.9 KiB
Plaintext
77 lines
3.9 KiB
Plaintext
<div class="space-y-4">
|
|
<div class="flex items-center justify-between">
|
|
<h1 class="text-xl font-medium text-gray-900">Accounts</h1>
|
|
<%= link_to new_account_path, class: "flex text-white text-sm font-medium items-center gap-1 bg-gray-900 rounded-lg p-2", data: { turbo_frame: "modal" } do %>
|
|
<%= lucide_icon("plus", class: "w-5 h-5") %>
|
|
<span><%= t(".new") %></span>
|
|
<% end %>
|
|
</div>
|
|
<div class="bg-white rounded-xl shadow-xs border border-alpha-black-100 flex divide-x divide-gray-200">
|
|
<div class="w-1/2 p-4 flex items-stretch justify-between">
|
|
<div class="space-y-2 grow">
|
|
<%= render partial: "shared/value_heading", locals: {
|
|
label: "Assets",
|
|
period: @period,
|
|
value: Current.family.assets,
|
|
trend: @asset_series.trend
|
|
} %>
|
|
</div>
|
|
<div
|
|
id="assetsChart"
|
|
class="h-full w-2/5"
|
|
data-controller="time-series-chart"
|
|
data-time-series-chart-data-value="<%= @asset_series.to_json %>"
|
|
data-time-series-chart-use-labels-value="false"></div>
|
|
</div>
|
|
<div class="w-1/2 p-4 flex items-stretch justify-between">
|
|
<div class="space-y-2 grow">
|
|
<%= render partial: "shared/value_heading", locals: {
|
|
label: "Liabilities",
|
|
period: @period,
|
|
size: "md",
|
|
value: Current.family.liabilities,
|
|
trend: @liability_series.trend
|
|
} %>
|
|
</div>
|
|
<div
|
|
id="liabilitiesChart"
|
|
class="h-full w-2/5"
|
|
data-controller="time-series-chart"
|
|
data-time-series-chart-data-value="<%= @liability_series.to_json %>"
|
|
data-time-series-chart-use-labels-value="false"></div>
|
|
</div>
|
|
</div>
|
|
<div class="p-4 bg-white rounded-xl shadow-xs border border-alpha-black-25 space-y-4">
|
|
<div class="flex justify-between items-center mb-5">
|
|
<h2 class="text-lg font-medium text-gray-900">Assets</h2>
|
|
<div class="flex items-center gap-2">
|
|
<%= link_to new_account_path, class: "flex items-center gap-1 p-2 text-gray-900 text-sm font-medium bg-gray-50 rounded-lg hover:bg-gray-100", data: { turbo_frame: "modal" } do %>
|
|
<%= lucide_icon("plus", class: "w-5 h-5 text-gray-500") %>
|
|
<p><%= t(".new") %></p>
|
|
<% end %>
|
|
<%= form_with url: summary_accounts_path, method: :get, class: "flex items-center gap-4", data: { controller: "auto-submit-form" } do %>
|
|
<%= render partial: "shared/period_select", locals: { value: @period.name } %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<%= render partial: "pages/account_percentages_bar", locals: { account_groups: @account_groups[:assets].children } %>
|
|
<%= render partial: "pages/account_percentages_table", locals: { account_groups: @account_groups[:assets].children } %>
|
|
</div>
|
|
<div class="p-4 bg-white rounded-xl shadow-xs border border-alpha-black-25 space-y-4">
|
|
<div class="flex justify-between items-center mb-5">
|
|
<h2 class="text-lg font-medium text-gray-900">Liabilities</h2>
|
|
<div class="flex items-center gap-2">
|
|
<%= link_to new_account_path, class: "flex items-center gap-1 p-2 text-gray-900 text-sm font-medium bg-gray-50 rounded-lg hover:bg-gray-100", data: { turbo_frame: "modal" } do %>
|
|
<%= lucide_icon("plus", class: "w-5 h-5 text-gray-500") %>
|
|
<p><%= t(".new") %></p>
|
|
<% end %>
|
|
<%= form_with url: summary_accounts_path, method: :get, class: "flex items-center gap-4", data: { controller: "auto-submit-form" } do %>
|
|
<%= render partial: "shared/period_select", locals: { value: @period.name } %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<%= render partial: "pages/account_percentages_bar", locals: { account_groups: @account_groups[:liabilities].children } %>
|
|
<%= render partial: "pages/account_percentages_table", locals: { account_groups: @account_groups[:liabilities].children } %>
|
|
</div>
|
|
</div>
|