Merge remote-tracking branch 'origin/main' into sidebar

lib/mv_web/components/layouts/navbar.ex

@@ -2,47 +2,82 @@ defmodule MvWeb.Layouts.Navbar do
   @moduledoc """
   Navbar that is used in the rootlayout shown on every page
   """
-  use Phoenix.Component
-  use Gettext, backend: MvWeb.Gettext
-  use MvWeb, :verified_routes
+  use MvWeb, :html
 
   attr :current_user, :map,
     required: true,
     doc: "The current user - navbar is only shown when user is present"
 
+  attr :club_name, :string,
+    default: nil,
+    doc: "Optional club name - if not provided, will be loaded from database"
+
   def navbar(assigns) do
+    club_name = assigns[:club_name] || get_club_name()
+    assigns = assign(assigns, :club_name, club_name)
+
     ~H"""
     <header class="shadow-sm navbar bg-base-100">
       <div class="flex-1">
-        <button
-          type="button"
-          onclick="document.getElementById('main-drawer').checked = !document.getElementById('main-drawer').checked"
-          aria-label={gettext("Toggle navigation menu")}
-          aria-expanded="false"
-          aria-controls="main-sidebar"
-          id="sidebar-toggle"
-          class="mr-2 btn btn-square btn-ghost focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-        >
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
-            stroke-linejoin="round"
-            stroke-linecap="round"
-            stroke-width="2"
-            fill="none"
-            stroke="currentColor"
-            class="my-1.5 inline-block size-4"
-            aria-hidden="true"
+        <a href="/members" class="btn btn-ghost text-xl">{@club_name}</a>
+        <ul class="menu menu-horizontal bg-base-200">
+          <li><.link navigate="/members">{gettext("Members")}</.link></li>
+          <li><.link navigate="/settings">{gettext("Settings")}</.link></li>
+          <li><.link navigate="/users">{gettext("Users")}</.link></li>
+          <li>
+            <details>
+              <summary>{gettext("Contributions")}</summary>
+              <ul class="bg-base-200 rounded-t-none p-2 z-10 w-48">
+                <li>
+                  <.link navigate="/membership_fee_types">{gettext("Membership Fee Types")}</.link>
+                </li>
+                <li>
+                  <.link navigate="/membership_fee_settings">
+                    {gettext("Membership Fee Settings")}
+                  </.link>
+                </li>
+              </ul>
+            </details>
+          </li>
+        </ul>
+      </div>
+      <div class="flex gap-2">
+        <form method="post" action="/set_locale" class="mr-4">
+          <input type="hidden" name="_csrf_token" value={Plug.CSRFProtection.get_csrf_token()} />
+          <label class="sr-only" for="locale-select">{gettext("Select language")}</label>
+          <select
+            id="locale-select"
+            name="locale"
+            onchange="this.form.submit()"
+            class="select select-sm"
+            aria-label={gettext("Select language")}
           >
-            <path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z">
-            </path>
-            <path d="M9 4v16"></path>
-            <path d="M14 10l2 2l-2 2"></path>
-          </svg>
-          <span class="sr-only">{gettext("Toggle navigation menu")}</span>
-        </button>
+            <option value="de" selected={Gettext.get_locale() == "de"}>Deutsch</option>
+            <option value="en" selected={Gettext.get_locale() == "en"}>English</option>
+          </select>
+        </form>
+        <!-- Daisy UI Theme Toggle for dark and light mode-->
+        <label class="flex cursor-pointer gap-2" aria-label={gettext("Toggle dark mode")}>
+          <input
+            type="checkbox"
+            value="dark"
+            class="toggle toggle-sm theme-controller"
+            aria-label={gettext("Toggle dark mode")}
+          />
+          <.icon name="hero-sun" class="size-5" aria-hidden="true" />
+          <.icon name="hero-moon" class="size-5" aria-hidden="true" />
+        </label>
       </div>
     </header>
     """
   end
+
+  # Helper function to get club name from settings
+  # Falls back to "Mitgliederverwaltung" if settings can't be loaded
+  defp get_club_name do
+    case Mv.Membership.get_settings() do
+      {:ok, settings} -> settings.club_name
+      _ -> "Mitgliederverwaltung"
+    end
+  end
 end