WIP Add notifications preferences page

app/components/form_elements/fieldset_component.html.erb

@@ -1,4 +1,5 @@
 <%= tag.public_send(@tag, class: "mb-6 last:mb-0") do %>
+  <% if @positioning == :vertical %>
   <label class="block">
     <p class="font-bold <%= @descripton.present? ? "mb-1" : "mb-2" %>">
       <%= @title %>
@@ -10,4 +11,19 @@
     <% end %>
     <%= content %>
   </label>
+  <% elsif @positioning == :horizontal %>
+  <label class="block flex items-center justify-between">
+    <div class="flex flex-col">
+      <label class="font-bold mb-1"><%= @title %></label>
+      <% if @descripton.present? %>
+      <p class="text-gray-500"><%= @descripton %></p>
+      <% end %>
+    </div>
+    <div class="relative ml-4 inline-flex flex-shrink-0">
+      <%= content %>
+    </div>
+  </label>
+  <% else %>
+  <p>Invalid <code>positioning<code> argument for <code>FieldsetComponent</code>.</p>
+  <% end %>
 <% end %>

app/components/form_elements/fieldset_component.rb

@@ -2,10 +2,11 @@
 
 module FormElements
   class FieldsetComponent < ViewComponent::Base
-    def initialize(tag: "li", title:, description: nil)
-      @tag = tag
-      @title = title
-      @descripton = description
+    def initialize(tag: "li", positioning: :vertical, title:, description: nil)
+      @tag         = tag
+      @positioning = positioning
+      @title       = title
+      @descripton  = description
     end
   end
 end

app/controllers/settings_controller.rb

@@ -29,8 +29,9 @@ class SettingsController < ApplicationController
 
   def set_settings_section
     @settings_section = params[:section]
+    allowed_sections  = [:profile, :account, :notifications]
 
-    unless [:profile, :account].include?(@settings_section.to_sym)
+    unless allowed_sections.include?(@settings_section.to_sym)
       redirect_to setting_path(:profile)
     end
   end

app/views/icons/_bell.html.erb

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell <%= custom_class %>"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>

app/views/settings/_notifications.html.erb

@@ -0,0 +1,16 @@
+<section>
+  <h3>Lightning Wallet</h3>
+
+  <ul role="list">
+    <%= render FormElements::FieldsetComponent.new(
+      positioning: :horizontal,
+      title: "Sats received",
+      description: "Notify when sats are sent to my Lightning Address"
+    ) do %>
+    <%= select_tag :sats_received, options_for_select([
+      ["off", "off"],
+      ["Chat (Jabber)", "xmpp"]
+    ]) %>
+    <% end %>
+  </ul>
+</section>

app/views/shared/_sidenav_settings.html.erb

@@ -7,5 +7,6 @@
   active: current_page?(setting_path(:account))
 ) %>
 <%= render SidenavLinkComponent.new(
-  name: "Security", path: "#", icon: "shield", disabled: true
+  name: "Notifications", path: setting_path(:notifications), icon: "bell",
+  active: current_page?(setting_path(:notifications))
 ) %>