mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-02 20:15:22 +02:00
New Settings Menu, Routes and Controllers Organization (#641)
* Add new settings routes and controllers * Add new settings view, restructure controllers and routes * Fix lint errors
This commit is contained in:
Zach Gollwitzer
GitHub
parent
39d57a167e
commit
9bda7efc3f
52 changed files with 771 additions and 203 deletions
|
|
@ -1,3 +1,6 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<h1 class="text-xl font-medium text-gray-900">Accounts</h1>
|
||||
|
|
@ -6,7 +9,7 @@
|
|||
<span><%= t(".new_account") %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
<% if Current.family.accounts.empty? %>
|
||||
<% if @accounts.empty? %>
|
||||
<div class="flex justify-center items-center h-[800px] text-sm">
|
||||
<div class="text-center flex flex-col items-center max-w-[300px]">
|
||||
<p class="text-gray-900 mb-1 font-medium">No accounts yet</p>
|
||||
|
|
@ -19,8 +22,8 @@
|
|||
</div>
|
||||
<% else %>
|
||||
<div>
|
||||
<% Current.family.accounts.by_provider.each do |item| %>
|
||||
<details class="bg-white group p-4 border border-alpha-black-25 shadow-xs rounded-xl">
|
||||
<% @accounts.by_provider.each do |item| %>
|
||||
<details open class="bg-white group p-4 border border-alpha-black-25 shadow-xs rounded-xl">
|
||||
<summary class="flex items-center gap-2">
|
||||
<%= lucide_icon("chevron-down", class: "hidden group-open:block w-5 h-5 text-gray-500") %>
|
||||
<%= lucide_icon("chevron-right", class: "group-open:hidden w-5 h-5 text-gray-500") %>
|
||||
|
|
@ -54,4 +57,12 @@
|
|||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="flex justify-between gap-4">
|
||||
<% if self_hosted? %>
|
||||
<%= previous_setting("Self Hosting", settings_hosting_path) %>
|
||||
<% else %>
|
||||
<%= previous_setting("Billing", settings_billing_path) %>
|
||||
<% end %>
|
||||
<%= next_setting("Categories", transactions_categories_path) %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
76
app/views/accounts/summary.html.erb
Normal file
76
app/views/accounts/summary.html.erb
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
<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/balance_heading", locals: {
|
||||
label: "Assets",
|
||||
period: @period,
|
||||
balance: Current.family.assets,
|
||||
trend: @asset_series.trend
|
||||
} %>
|
||||
</div>
|
||||
<div
|
||||
data-controller="trendline"
|
||||
id="assetsTrendline"
|
||||
class="h-full w-2/5"
|
||||
data-trendline-series-value="<%= @asset_series.to_json %>"
|
||||
data-trendline-classification-value="asset"></div>
|
||||
</div>
|
||||
<div class="w-1/2 p-4 flex items-stretch justify-between">
|
||||
<div class="space-y-2 grow">
|
||||
<%= render partial: "shared/balance_heading", locals: {
|
||||
label: "Liabilities",
|
||||
period: @period,
|
||||
size: "md",
|
||||
balance: Current.family.liabilities,
|
||||
trend: @liability_series.trend
|
||||
} %>
|
||||
</div>
|
||||
<div
|
||||
data-controller="trendline"
|
||||
id="liabilitiesTrendline"
|
||||
class="h-full w-2/5"
|
||||
data-trendline-series-value="<%= @liability_series.to_json %>"
|
||||
data-trendline-classification-value="liability"></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>
|
||||
88
app/views/layouts/_sidebar.html.erb
Normal file
88
app/views/layouts/_sidebar.html.erb
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
<div class="flex items-center justify-between">
|
||||
<%= link_to root_path do %>
|
||||
<%= image_tag "logo.svg", alt: "Maybe", class: "h-[22px]" %>
|
||||
<% end %>
|
||||
<div id="user-menu" data-controller="menu">
|
||||
<button data-menu-target="button">
|
||||
<div class="text-white w-9 h-9 bg-gray-400 rounded-full flex items-center justify-center text-lg uppercase"><%= Current.user.email.first %></div>
|
||||
</button>
|
||||
<div data-menu-target="content" class="hidden absolute w-[240px] z-10 top-10 left-[255px] top-[72px] bg-white rounded-sm shadow-xs border border-alpha-black-25">
|
||||
<div class="p-3 flex items-center gap-3">
|
||||
<div class="text-white shrink-0 w-9 h-9 bg-gray-400 rounded-full flex items-center justify-center text-lg uppercase"><%= Current.user.email.first %></div>
|
||||
<div>
|
||||
<span class="text-gray-900 font-medium text-sm"><%= Current.user.first_name %> <%= Current.user.last_name %></span>
|
||||
<span class="text-gray-500 text-sm"><%= Current.user.email %></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-t border-b border-alpha-black-100 p-1">
|
||||
<%= link_to settings_profile_path, class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
|
||||
<%= lucide_icon("settings", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">Settings</span>
|
||||
<% end %>
|
||||
<div class="flex justify-between items-center gap-2">
|
||||
<div class="flex items-center gap-2 rounded-lg px-3 py-2">
|
||||
<%= lucide_icon("app-window", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<div>
|
||||
<span class="text-gray-900 text-sm">Demo mode</span>
|
||||
<span class="text-gray-500 text-xs block">Coming soon...</span>
|
||||
</div>
|
||||
</div>
|
||||
<%# TODO: This will be a form toggle when implemented %>
|
||||
<div class="relative inline-block cursor-not-allowed" title="Coming soon...">
|
||||
<label class="cursor-not-allowed block bg-gray-100 w-9 h-5 rounded-full after:content-[''] after:block after:absolute after:top-0.5 after:left-0.5 after:bg-white after:w-4 after:h-4 after:rounded-full after:transition-transform after:duration-300 after:ease-in-out peer-checked:bg-green-600 peer-checked:after:translate-x-4"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-t border-b border-alpha-black-100 p-1">
|
||||
<%= link_to changelog_path, class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
|
||||
<%= lucide_icon("box", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">Changelog</span>
|
||||
<% end %>
|
||||
<%= link_to feedback_path, class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
|
||||
<%= lucide_icon("megaphone", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">Feedback</span>
|
||||
<% end %>
|
||||
<%= link_to "https://link.maybe.co/discord", class: "flex gap-2 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
|
||||
<%= lucide_icon("message-square-more", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">Contact</span>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="p-1">
|
||||
<%= button_to session_path, method: :delete, class: "w-full text-red-400 flex gap-1 items-center hover:bg-gray-50 rounded-lg px-3 py-2" do %>
|
||||
<%= lucide_icon("log-out", class: "w-5 h-5 shrink-0") %>
|
||||
<span class="text-sm">Logout</span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav>
|
||||
<ul class="mt-6 space-y-1">
|
||||
<li>
|
||||
<%= sidebar_link_to t(".dashboard"), root_path, icon: "layout-grid" %>
|
||||
</li>
|
||||
<li>
|
||||
<%= sidebar_link_to t(".accounts"), summary_accounts_path, icon: "layers" %>
|
||||
</li>
|
||||
<li>
|
||||
<%= sidebar_link_to t(".transactions"), transactions_path, icon: "credit-card" %>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="flex flex-col mt-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<%= link_to accounts_path, class: "text-xs uppercase text-gray-500 font-bold tracking-wide" do %>
|
||||
<%= t(".accounts") %>
|
||||
<% end %>
|
||||
<%= link_to new_account_path, class: "block hover:bg-gray-100 p-2 text-sm font-semibold text-gray-900 flex items-center rounded", title: t(".new_account"), data: { turbo_frame: "modal" } do %>
|
||||
<%= lucide_icon("plus", class: "w-5 h-5 text-gray-500") %>
|
||||
<% end %>
|
||||
</div>
|
||||
<%= link_to new_account_path, 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 %>
|
||||
<%= lucide_icon("plus", class: "w-5 h-5") %>
|
||||
<p><%= t(".new_account") %></p>
|
||||
<% end %>
|
||||
<% account_groups.each do |group| %>
|
||||
<%= render "accounts/account_list", group: group %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
@ -25,73 +25,28 @@
|
|||
<body class="h-full">
|
||||
<div id="notification-tray" class="fixed z-50 space-y-1 top-6 right-6"></div>
|
||||
<%= safe_join(flash.map { |type, message| notification(message, type: type) }) %>
|
||||
<div class="flex">
|
||||
<div class="flex-col p-5 min-w-80">
|
||||
<div class="flex items-center justify-between">
|
||||
<%= link_to root_path do %>
|
||||
<%= image_tag "logo.svg", alt: "Maybe", class: "h-[22px]" %>
|
||||
<% end %>
|
||||
<div class="relative" data-controller="menu">
|
||||
<button data-menu-target="button">
|
||||
<div class="text-white w-9 h-9 bg-gray-400 rounded-full flex items-center justify-center text-lg uppercase"><%= Current.user.email.first %></div>
|
||||
</button>
|
||||
<div
|
||||
data-menu-target="content"
|
||||
class="hidden absolute min-w-[200px] z-10 top-10 right-0 bg-white p-1 rounded-sm shadow-xs border border-alpha-black-25 w-fit">
|
||||
<%= link_to edit_settings_path, class: "flex gap-1 items-center hover:bg-gray-50 rounded-md p-2" do %>
|
||||
<%= lucide_icon("pencil-line", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">General Settings</span>
|
||||
<% end %>
|
||||
<% if self_hosted? %>
|
||||
<%= link_to edit_settings_self_hosting_path, class: "flex gap-1 items-center hover:bg-gray-50 rounded-md p-2" do %>
|
||||
<%= lucide_icon("pencil-line", class: "w-5 h-5 text-gray-500 shrink-0") %>
|
||||
<span class="text-gray-900 text-sm">Self Host Settings</span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<%= button_to session_path, method: :delete, class: "w-full text-gray-900 flex gap-1 items-center hover:bg-gray-50 rounded-md p-2" do %>
|
||||
<%= lucide_icon("log-out", class: "w-5 h-5 shrink-0") %>
|
||||
<span class="text-sm">Logout</span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav>
|
||||
<ul class="mt-6 space-y-1">
|
||||
<li>
|
||||
<%= sidebar_link_to t(".dashboard"), root_path, icon: "layout-grid" %>
|
||||
</li>
|
||||
<li>
|
||||
<%= sidebar_link_to t(".accounts"), accounts_path, icon: "layers" %>
|
||||
</li>
|
||||
<li>
|
||||
<%= sidebar_link_to t(".transactions"), transactions_path, icon: "credit-card" %>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="flex flex-col mt-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<%= link_to accounts_path, class: "text-xs uppercase text-gray-500 font-bold tracking-wide" do %>
|
||||
<%= t(".accounts") %>
|
||||
<% end %>
|
||||
<%= link_to new_account_path, class: "block hover:bg-gray-100 p-2 text-sm font-semibold text-gray-900 flex items-center rounded", title: t(".new_account"), data: { turbo_frame: "modal" } do %>
|
||||
<%= lucide_icon("plus", class: "w-5 h-5 text-gray-500") %>
|
||||
<% end %>
|
||||
</div>
|
||||
<%= link_to new_account_path, 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 %>
|
||||
<%= lucide_icon("plus", class: "w-5 h-5") %>
|
||||
<p><%= t(".new_account") %></p>
|
||||
<% end %>
|
||||
<% account_groups.each do |group| %>
|
||||
<%= render "accounts/account_list", group: group %>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="flex h-full">
|
||||
<div class="p-6 w-80 shrink-0 h-full overflow-y-auto">
|
||||
<% if content_for?(:sidebar) %>
|
||||
<%= yield :sidebar %>
|
||||
<% else %>
|
||||
<%= render "layouts/sidebar" %>
|
||||
<% end %>
|
||||
</div>
|
||||
<main class="flex-grow px-20 py-6">
|
||||
<main class="grow px-20 py-6 h-full overflow-y-auto">
|
||||
<%= yield %>
|
||||
</main>
|
||||
</div>
|
||||
<%= turbo_frame_tag "modal" %>
|
||||
<%= render "shared/custom_confirm_modal" %>
|
||||
<%= render "shared/upgrade_notification" %>
|
||||
<% if self_hosted? %>
|
||||
<div class="flex items-center py-0.5 px-0.5 gap-1 fixed bottom-2 right-2 shadow-xs border border-alpha-black-50 rounded-md bg-white">
|
||||
<p class="text-xs text-gray-500 pl-2">Self-hosted Maybe: <%= Maybe.version.to_release_tag %></p>
|
||||
<%= link_to settings_hosting_path, class: "flex gap-1 items-center hover:bg-gray-50 rounded-md p-2" do %>
|
||||
<%= lucide_icon("settings", class: "w-4 h-4 text-gray-500 shrink-0") %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -15,6 +15,6 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="bg-white border border-alpha-black-25 shadow-xs rounded-lg divide-y divide-alpha-black-50">
|
||||
<%= render partial: "account_group_disclosure", collection: account_groups, as: :accountable_group %>
|
||||
<%= render partial: "pages/account_group_disclosure", collection: account_groups, as: :accountable_group %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
15
app/views/pages/changelog.html.erb
Normal file
15
app/views/pages/changelog.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">What's New</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Changelog coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Rules", transactions_rules_path) %>
|
||||
<%= next_setting("Feedback", feedback_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/pages/feedback.html.erb
Normal file
15
app/views/pages/feedback.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Feedback</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Feedback coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("What's New", changelog_path) %>
|
||||
<%= next_setting("Invite friends", invites_path) %>
|
||||
</div>
|
||||
</div>
|
||||
14
app/views/pages/invites.html.erb
Normal file
14
app/views/pages/invites.html.erb
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Invite friends</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Invite friends coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Feedback", feedback_path) %>
|
||||
</div>
|
||||
</div>
|
||||
56
app/views/settings/_nav.html.erb
Normal file
56
app/views/settings/_nav.html.erb
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
<div class="flex items-center gap-1 mb-6">
|
||||
<%= link_to root_path, class: "flex items-center gap-1 text-gray-900 font-medium text-sm" do %>
|
||||
<%= lucide_icon "chevron-left", class: "w-5 h-5 text-gray-500" %>
|
||||
<span>Back</span>
|
||||
<% end %>
|
||||
<span data-controller="hotkey" data-hotkey="Escape" data-action="hotkey#navigateBack" class="uppercase bg-gray-100 rounded-sm px-1 py-0.5 text-xs text-gray-500 shadow-sm ml-1">
|
||||
esc
|
||||
</span>
|
||||
</div>
|
||||
<nav class="space-y-4">
|
||||
<section class="space-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<h3 class="uppercase text-gray-500 font-medium text-xs">General</h3>
|
||||
<div class="h-px bg-alpha-black-100 w-full"></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li>
|
||||
<%= sidebar_link_to t(".profile_label"), settings_profile_path, icon: "circle-user" %>
|
||||
<%= sidebar_link_to t(".preferences_label"), settings_preferences_path, icon: "bolt" %>
|
||||
<%= sidebar_link_to t(".notifications_label"), settings_notifications_path, icon: "bell-dot" %>
|
||||
<%= sidebar_link_to t(".security_label"), settings_security_path, icon: "shield-check" %>
|
||||
<%= sidebar_link_to t(".billing_label"), settings_billing_path, icon: "circle-dollar-sign" %>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="space-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<h3 class="uppercase text-gray-500 font-medium text-xs">Setup</h3>
|
||||
<div class="h-px bg-alpha-black-100 w-full"></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li>
|
||||
<% if self_hosted? %>
|
||||
<%= sidebar_link_to t(".self_hosting_label"), settings_hosting_path, icon: "database" %>
|
||||
<% end %>
|
||||
<%= sidebar_link_to t(".accounts_label"), accounts_path, icon: "layers" %>
|
||||
<%= sidebar_link_to t(".categories_label"), transactions_categories_path, icon: "tags" %>
|
||||
<%= sidebar_link_to t(".merchants_label"), transactions_merchants_path, icon: "store" %>
|
||||
<%= sidebar_link_to t(".rules_label"), transactions_rules_path, icon: "list-checks" %>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="space-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<h3 class="uppercase text-gray-500 font-medium text-xs">More</h3>
|
||||
<div class="h-px bg-alpha-black-100 w-full"></div>
|
||||
</div>
|
||||
<ul class="space-y-1">
|
||||
<li>
|
||||
<%= sidebar_link_to t(".whats_new_label"), changelog_path, icon: "box" %>
|
||||
<%= sidebar_link_to t(".feedback_label"), feedback_path, icon: "megaphone" %>
|
||||
<%= sidebar_link_to t(".invite_label"), invites_path, icon: "gift" %>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</nav>
|
||||
17
app/views/settings/_nav_link_large.html.erb
Normal file
17
app/views/settings/_nav_link_large.html.erb
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
<%# locals: path, direction, title %>
|
||||
<%= link_to path, class: "w-full bg-white hover:bg-gray-50 rounded-xl border border-alpha-black-25 shadow-xs p-4 flex items-center justify-between" do %>
|
||||
<% if direction == 'previous' %>
|
||||
<div class="w-5 h-5 text-gray-500">
|
||||
<%= lucide_icon("arrow-left") %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="<%= "flex-grow" if direction == "next" %> <%= "text-right" if direction == "previous" %>">
|
||||
<span class="block text-sm text-gray-500"><%= t(".#{direction}") %></span>
|
||||
<span class="block text-sm font-medium text-gray-900"><%= title %></span>
|
||||
</div>
|
||||
<% if direction == 'next' %>
|
||||
<div class="w-5 h-5 text-gray-500">
|
||||
<%= lucide_icon("arrow-right") %>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
19
app/views/settings/billings/show.html.erb
Normal file
19
app/views/settings/billings/show.html.erb
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Billing</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Billing settings coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Security", settings_security_path) %>
|
||||
<% if self_hosted? %>
|
||||
<%= next_setting("Self Hosting", settings_hosting_path) %>
|
||||
<% else %>
|
||||
<%= next_setting("Accounts", accounts_path) %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
<h1 class="text-3xl font-semibold font-display">Update settings</h1>
|
||||
<%= form_with model: Current.user, url: settings_path, html: { class: "space-y-4" } do |form| %>
|
||||
<%= form.fields_for :family_attributes do |family_fields| %>
|
||||
<%= family_fields.text_field :name, placeholder: "Family name", value: Current.family.name, label: "Family name" %>
|
||||
<%= family_fields.select :currency, options_for_select(Money::Currency.popular.map { |currency| ["#{currency.iso_code} (#{currency.name})", currency.iso_code] }, selected: Current.family.currency), { label: "Currency" } %>
|
||||
<% end %>
|
||||
<%= form.text_field :first_name, placeholder: "First name", value: Current.user.first_name, label: true %>
|
||||
<%= form.text_field :last_name, placeholder: "Last name", value: Current.user.last_name, label: true %>
|
||||
<%= form.email_field :email, placeholder: "Email", value: Current.user.email, label: true %>
|
||||
<%= form.password_field :password, label: true %>
|
||||
<%= form.password_field :password_confirmation, label: true %>
|
||||
<div class="fixed right-5 bottom-5">
|
||||
<button type="submit" class="flex items-center justify-center w-12 h-12 mb-2 bg-black rounded-full shrink-0 grow-0 hover:bg-gray-600">
|
||||
<%= inline_svg_tag("icn-check.svg", class: "text-white fill-current") %>
|
||||
</button>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -1,11 +1,14 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-3xl font-semibold font-display">Edit Self Hosting Settings</h1>
|
||||
<h1 class="text-3xl font-semibold font-display">Self Hosting</h1>
|
||||
<hr>
|
||||
<%= form_with model: Setting.new, url: settings_self_hosting_path, method: :patch, local: true, html: { class: "space-y-4" } do |form| %>
|
||||
<%= form_with model: Setting.new, url: settings_hosting_path, method: :patch, local: true, html: { class: "space-y-4" } do |form| %>
|
||||
<section class="space-y-3">
|
||||
<h2 class="text-2xl font-semibold">Render Deploy Hook</h2>
|
||||
<p class="text-gray-500">You must fill this in so your app can trigger upgrades when Maybe releases upgrades. Learn more about deploy hooks and how they work in the <%= link_to "Render documentation", "https://docs.render.com/docs/deploy-hooks", target: "_blank", rel: "noopener noreferrer", class: "text-blue-500 hover:underline" %>.</p>
|
||||
<%= form.text_field :render_deploy_hook, label: "Render Deploy Hook", placeholder: "https://api.render.com/deploy/srv-xyz...", value: Setting.render_deploy_hook %>
|
||||
<%= form.url_field :render_deploy_hook, label: "Render Deploy Hook", placeholder: "https://api.render.com/deploy/srv-xyz...", value: Setting.render_deploy_hook %>
|
||||
</section>
|
||||
<section class="space-y-3">
|
||||
<h2 class="text-2xl font-semibold">Auto Upgrades Setting</h2>
|
||||
|
|
@ -37,4 +40,8 @@
|
|||
</button>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Billing", settings_billing_path) %>
|
||||
<%= next_setting("Accounts", accounts_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/settings/notifications/show.html.erb
Normal file
15
app/views/settings/notifications/show.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Notifications</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Notifications coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Preferences", settings_preferences_path) %>
|
||||
<%= next_setting("Security", settings_security_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/settings/preferences/show.html.erb
Normal file
15
app/views/settings/preferences/show.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Preferences</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Preferences coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Account", settings_profile_path) %>
|
||||
<%= next_setting("Notifications", settings_notifications_path) %>
|
||||
</div>
|
||||
</div>
|
||||
25
app/views/settings/profiles/show.html.erb
Normal file
25
app/views/settings/profiles/show.html.erb
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Account</h1>
|
||||
<%= form_with model: Current.user, url: settings_profile_path, html: { class: "space-y-4" } do |form| %>
|
||||
<%= form.fields_for :family_attributes do |family_fields| %>
|
||||
<%= family_fields.text_field :name, placeholder: "Family name", value: Current.family.name, label: "Family name" %>
|
||||
<%= family_fields.select :currency, options_for_select(Money::Currency.popular.map { |currency| ["#{currency.iso_code} (#{currency.name})", currency.iso_code] }, selected: Current.family.currency), { label: "Currency" } %>
|
||||
<% end %>
|
||||
<%= form.text_field :first_name, placeholder: "First name", value: Current.user.first_name, label: true %>
|
||||
<%= form.text_field :last_name, placeholder: "Last name", value: Current.user.last_name, label: true %>
|
||||
<%= form.email_field :email, placeholder: "Email", value: Current.user.email, label: true %>
|
||||
<%= form.password_field :password, label: true %>
|
||||
<%= form.password_field :password_confirmation, label: true %>
|
||||
<div class="fixed right-5 bottom-5">
|
||||
<button type="submit" class="flex items-center justify-center w-12 h-12 mb-2 bg-black rounded-full shrink-0 grow-0 hover:bg-gray-600">
|
||||
<%= inline_svg_tag("icn-check.svg", class: "text-white fill-current") %>
|
||||
</button>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="flex gap-4">
|
||||
<%= next_setting("Preferences", settings_preferences_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/settings/securities/show.html.erb
Normal file
15
app/views/settings/securities/show.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Security</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Security settings coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Notifications", settings_notifications_path) %>
|
||||
<%= next_setting("Billing", settings_billing_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/transactions/categories/index.html.erb
Normal file
15
app/views/transactions/categories/index.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Categories</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Transaction categories coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Accounts", accounts_path) %>
|
||||
<%= next_setting("Merchants", transactions_merchants_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/transactions/merchants/index.html.erb
Normal file
15
app/views/transactions/merchants/index.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Merchants</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Manage transaction merchants coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Categories", transactions_categories_path) %>
|
||||
<%= next_setting("Rules", transactions_rules_path) %>
|
||||
</div>
|
||||
</div>
|
||||
15
app/views/transactions/rules/index.html.erb
Normal file
15
app/views/transactions/rules/index.html.erb
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<% content_for :sidebar do %>
|
||||
<%= render "settings/nav" %>
|
||||
<% end %>
|
||||
<div class="space-y-4">
|
||||
<h1 class="text-gray-900 text-xl font-medium mb-4">Rules</h1>
|
||||
<div class="bg-white shadow-xs border border-alpha-black-25 rounded-xl p-4">
|
||||
<div class="flex justify-center items-center py-20">
|
||||
<p class="text-gray-500">Transaction rules coming soon...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between gap-4">
|
||||
<%= previous_setting("Merchants", transactions_merchants_path) %>
|
||||
<%= next_setting("What's New", changelog_path) %>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue