mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-05 13:35:21 +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
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>
|
||||
Loading…
Add table
Add a link
Reference in a new issue