Merge pull request 'add public join form' (#466) from feature/308-web-form into main

Reviewed-on: #466

lib/mv_web/components/layouts.ex

@@ -82,7 +82,25 @@ defmodule MvWeb.Layouts do
         </div>
       </div>
     <% else %>
-      <!-- Not logged in -->
+      <!-- Unauthenticated: simple header (logo, club name, language selector; same classes as sidebar header) -->
+      <header class="flex items-center gap-3 p-4 border-b border-base-300 bg-base-100">
+        <img src={~p"/images/mila.svg"} alt="Mila Logo" class="size-8 shrink-0" />
+        <span class="menu-label text-lg font-bold truncate flex-1">
+          {@club_name}
+        </span>
+        <form method="post" action={~p"/set_locale"} class="shrink-0">
+          <input type="hidden" name="_csrf_token" value={Plug.CSRFProtection.get_csrf_token()} />
+          <select
+            name="locale"
+            onchange="this.form.submit()"
+            class="select select-sm focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+            aria-label={gettext("Select language")}
+          >
+            <option value="de" selected={Gettext.get_locale() == "de"}>Deutsch</option>
+            <option value="en" selected={Gettext.get_locale() == "en"}>English</option>
+          </select>
+        </form>
+      </header>
       <main class="px-4 py-8 sm:px-6">
         <div class="mx-auto space-y-4 max-full">
           {render_slot(@inner_block)}

lib/mv_web/endpoint.ex

@@ -12,8 +12,8 @@ defmodule MvWeb.Endpoint do
   ]
 
   socket "/live", Phoenix.LiveView.Socket,
-    websocket: [connect_info: [session: @session_options]],
-    longpoll: [connect_info: [session: @session_options]]
+    websocket: [connect_info: [:peer_data, :x_headers, session: @session_options]],
+    longpoll: [connect_info: [:peer_data, :x_headers, session: @session_options]]
 
   # Serve at "/" the static files from "priv/static" directory.
   #

lib/mv_web/join_rate_limit.ex

@@ -0,0 +1,28 @@
+defmodule MvWeb.JoinRateLimit do
+  @moduledoc """
+  Rate limiting for the public join form (submit action).
+
+  Uses Hammer with ETS backend. Key is derived from client IP so each IP
+  is limited independently. Config from :mv :join_rate_limit (scale_ms, limit).
+  """
+  use Hammer, backend: :ets
+
+  @doc """
+  Checks if the given key (e.g. client IP) is within rate limit for join form submit.
+
+  Returns:
+  - `:allow` - submission allowed
+  - `{:deny, _retry_after_ms}` - rate limit exceeded
+  """
+  def check(key) when is_binary(key) do
+    # Read at runtime so config can be changed without restart (e.g. in tests).
+    config = Application.get_env(:mv, :join_rate_limit, [])
+    scale_ms = Keyword.get(config, :scale_ms, 60_000)
+    limit = Keyword.get(config, :limit, 10)
+
+    case hit(key, scale_ms, limit) do
+      {:allow, _count} -> :allow
+      {:deny, retry_after} -> {:deny, retry_after}
+    end
+  end
+end

lib/mv_web/live/join_live.ex

@@ -0,0 +1,261 @@
+defmodule MvWeb.JoinLive do
+  @moduledoc """
+  Public join page (unauthenticated). Renders form from allowlist, handles submit
+  with honeypot and rate limiting; shows success copy after submit.
+  """
+  use MvWeb, :live_view
+
+  alias Mv.Membership
+  alias MvWeb.JoinRateLimit
+  alias MvWeb.Translations.MemberFields
+
+  # Honeypot field name (legitimate-sounding to avoid bot detection)
+  @honeypot_field "website"
+
+  @impl true
+  def mount(_params, _session, socket) do
+    allowlist = Membership.get_join_form_allowlist()
+    join_fields = build_join_fields_with_labels(allowlist)
+    client_ip = client_ip_from_socket(socket)
+
+    socket =
+      socket
+      |> assign(:join_fields, join_fields)
+      |> assign(:submitted, false)
+      |> assign(:rate_limit_error, nil)
+      |> assign(:client_ip, client_ip)
+      |> assign(:honeypot_field, @honeypot_field)
+      |> assign(:form, to_form(initial_form_params(join_fields)))
+
+    {:ok, socket}
+  end
+
+  @impl true
+  def render(assigns) do
+    ~H"""
+    <Layouts.app flash={@flash} current_user={@current_user}>
+      <div class="max-w-xl mx-auto mt-8 space-y-6">
+        <.header>
+          {gettext("Become a member")}
+        </.header>
+
+        <p class="text-base-content/80">
+          {gettext("Please enter your details for the membership application here.")}
+        </p>
+
+        <%= if @submitted do %>
+          <div data-testid="join-success-message" class="alert alert-success">
+            <p class="font-medium">
+              {gettext(
+                "We have saved your details. To complete your request, please click the link we sent to your email."
+              )}
+            </p>
+          </div>
+        <% else %>
+          <.form
+            for={@form}
+            id="join-form"
+            phx-submit="submit"
+            class="space-y-4"
+          >
+            <%= if @rate_limit_error do %>
+              <div class="alert alert-error">
+                {@rate_limit_error}
+              </div>
+            <% end %>
+
+            <%= for field <- @join_fields do %>
+              <div>
+                <label for={"join-field-#{field.id}"} class="label">
+                  <span class="label-text">{field.label}{if field.required, do: " *"}</span>
+                </label>
+                <input
+                  type={input_type(field.id)}
+                  name={field.id}
+                  id={"join-field-#{field.id}"}
+                  value={@form.params[field.id]}
+                  required={field.required}
+                  class="input input-bordered w-full"
+                />
+              </div>
+            <% end %>
+
+            <%!--
+              Honeypot (best practice): legit field name "website", type="text", no inline CSS,
+              hidden via class in app.css (off-screen + 1px). tabindex=-1, autocomplete=off,
+              aria-hidden so screen readers skip. If filled → silent failure (same success UI).
+            --%>
+            <div class="join-form-helper" aria-hidden="true">
+              <label for="join-website" class="sr-only">{gettext("Website")}</label>
+              <input
+                type="text"
+                name={@honeypot_field}
+                id="join-website"
+                tabindex="-1"
+                autocomplete="off"
+                class="join-form-helper-input"
+              />
+            </div>
+
+            <p class="text-sm text-base-content/70">
+              {gettext(
+                "By submitting your application you will receive an email with a confirmation link. Once you have confirmed your email address, your application will be reviewed."
+              )}
+            </p>
+
+            <p class="text-xs text-base-content/60">
+              {gettext(
+                "Your details are only used to process your membership application and to contact you. To prevent abuse we also process technical data (e.g. IP address) only as necessary."
+              )}
+            </p>
+
+            <div>
+              <button type="submit" class="btn btn-primary">
+                {gettext("Submit request")}
+              </button>
+            </div>
+          </.form>
+        <% end %>
+      </div>
+    </Layouts.app>
+    """
+  end
+
+  @impl true
+  def handle_event("submit", params, socket) do
+    # Honeypot: if filled, treat as bot – show same success UI, do not create (silent failure)
+    honeypot_value = String.trim(params[@honeypot_field] || "")
+
+    if honeypot_value != "" do
+      {:noreply, assign(socket, :submitted, true)}
+    else
+      key = "join:#{socket.assigns.client_ip}"
+
+      case JoinRateLimit.check(key) do
+        :allow -> do_submit(socket, params)
+        {:deny, _retry_after} -> rate_limited_reply(socket, params)
+      end
+    end
+  end
+
+  defp do_submit(socket, params) do
+    case build_submit_attrs(params, socket.assigns.join_fields) do
+      {:ok, attrs} ->
+        case Membership.submit_join_request(attrs, actor: nil) do
+          {:ok, _} -> {:noreply, assign(socket, :submitted, true)}
+          {:error, _} -> validation_error_reply(socket, params)
+        end
+
+      {:error, message} ->
+        {:noreply,
+         socket
+         |> put_flash(:error, message)
+         |> assign(:form, to_form(params, as: "join"))}
+    end
+  end
+
+  defp validation_error_reply(socket, params) do
+    {:noreply,
+     socket
+     |> put_flash(:error, gettext("Please check your entries. Email is required."))
+     |> assign(:form, to_form(params, as: "join"))}
+  end
+
+  defp rate_limited_reply(socket, params) do
+    {:noreply,
+     socket
+     |> assign(:rate_limit_error, gettext("Too many requests. Please try again later."))
+     |> assign(:form, to_form(params, as: "join"))}
+  end
+
+  defp build_join_fields_with_labels(allowlist) do
+    member_field_strings = Mv.Constants.member_fields() |> Enum.map(&Atom.to_string/1)
+
+    Enum.map(allowlist, fn %{id: id, required: required} ->
+      label =
+        if id in member_field_strings do
+          MemberFields.label(String.to_existing_atom(id))
+        else
+          gettext("Field")
+        end
+
+      %{id: id, label: label, required: required}
+    end)
+  end
+
+  defp initial_form_params(join_fields) do
+    join_fields
+    |> Enum.map(fn f -> {f.id, ""} end)
+    |> Map.new()
+    |> Map.put(@honeypot_field, "")
+  end
+
+  defp input_type("email"), do: "email"
+  defp input_type(_), do: "text"
+
+  defp build_submit_attrs(params, join_fields) do
+    allowlist_ids = MapSet.new(Enum.map(join_fields, & &1.id))
+    typed = ["email", "first_name", "last_name"]
+
+    email = String.trim(params["email"] || "")
+
+    if email == "" do
+      {:error, gettext("Email is required.")}
+    else
+      attrs = %{
+        email: email,
+        first_name: optional_param(params, "first_name"),
+        last_name: optional_param(params, "last_name"),
+        form_data: %{},
+        schema_version: 1
+      }
+
+      form_data =
+        params
+        |> Enum.filter(fn {key, _} -> key in allowlist_ids and key not in typed end)
+        |> Map.new(fn {k, v} -> {k, String.trim(to_string(v))} end)
+
+      attrs = %{attrs | form_data: form_data}
+      {:ok, attrs}
+    end
+  end
+
+  defp optional_param(params, key) do
+    v = params[key]
+    if is_binary(v), do: String.trim(v), else: nil
+  end
+
+  # Prefer X-Forwarded-For / X-Real-IP when behind a reverse proxy; fall back to peer_data.
+  # Uses :inet.ntoa/1 for correct IPv4 and IPv6 string representation.
+  defp client_ip_from_socket(socket) do
+    with nil <- client_ip_from_headers(socket),
+         %{address: address} when is_tuple(address) <- get_connect_info(socket, :peer_data) do
+      address |> :inet.ntoa() |> to_string()
+    else
+      ip when is_binary(ip) -> ip
+      _ -> "unknown"
+    end
+  end
+
+  defp client_ip_from_headers(socket) do
+    headers = get_connect_info(socket, :x_headers) || []
+    real_ip = header_value(headers, "x-real-ip")
+    forwarded = header_value(headers, "x-forwarded-for")
+
+    cond do
+      real_ip != nil -> real_ip
+      forwarded != nil -> String.split(forwarded, ~r/,\s*/) |> List.first() |> String.trim()
+      true -> nil
+    end
+  end
+
+  defp header_value(headers, name) do
+    name_lower = String.downcase(name)
+
+    headers
+    |> Enum.find_value(fn
+      {h, v} when is_binary(h) -> if String.downcase(h) == name_lower, do: String.trim(v)
+      _ -> nil
+    end)
+  end
+end

lib/mv_web/live/member_live/index.ex

@@ -107,6 +107,9 @@ defmodule MvWeb.MemberLive.Index do
         {:error, _} -> %{member_field_visibility: %{}}
       end
 
+    # Ensure nested module is loaded (can be missing after code reload in dev if load order changes)
+    Code.ensure_loaded!(FieldSelection)
+
     # Load user field selection from session
     session_selection = FieldSelection.get_from_session(session)
 

lib/mv_web/plugs/check_page_permission.ex

@@ -80,7 +80,7 @@ defmodule MvWeb.Plugs.CheckPagePermission do
   Used by LiveView hook to skip redirect on sign-in etc.
   """
   def public_path?(path) when is_binary(path) do
-    path in ["/register", "/reset", "/set_locale", "/sign-in", "/sign-out"] or
+    path in ["/register", "/reset", "/set_locale", "/sign-in", "/sign-out", "/join"] or
       String.starts_with?(path, "/auth") or
       String.starts_with?(path, "/confirm") or
       String.starts_with?(path, "/password-reset")

lib/mv_web/plugs/join_form_enabled.ex

@@ -0,0 +1,34 @@
+defmodule MvWeb.Plugs.JoinFormEnabled do
+  @moduledoc """
+  For GET /join: returns 404 when the join form is disabled in settings.
+  No-op for other paths.
+  """
+  import Plug.Conn
+
+  alias Mv.Membership
+
+  def init(opts), do: opts
+
+  def call(conn, _opts) do
+    if join_path?(conn), do: maybe_404(conn), else: conn
+  end
+
+  defp join_path?(conn) do
+    conn.request_path == "/join" and conn.method == "GET"
+  end
+
+  defp maybe_404(conn) do
+    case Membership.get_settings() do
+      {:ok, %{join_form_enabled: true}} -> conn
+      _ -> send_404(conn)
+    end
+  end
+
+  # Same body as default ErrorHTML 404 (no custom error templates in this app).
+  defp send_404(conn) do
+    conn
+    |> put_resp_content_type("text/html")
+    |> send_resp(404, "Not Found")
+    |> halt()
+  end
+end

lib/mv_web/router.ex

@@ -15,6 +15,7 @@ defmodule MvWeb.Router do
     plug :load_from_session
     plug :set_locale
     plug MvWeb.Plugs.CheckPagePermission
+    plug MvWeb.Plugs.JoinFormEnabled
   end
 
   pipeline :api do
@@ -126,6 +127,12 @@ defmodule MvWeb.Router do
       overrides: [MvWeb.AuthOverrides, AshAuthentication.Phoenix.Overrides.DaisyUI],
       gettext_backend: {MvWeb.Gettext, "auth"}
 
+    # Public join page (no auth required)
+    live_session :public_join,
+      on_mount: [{MvWeb.LiveUserAuth, :live_user_optional}] do
+      live "/join", JoinLive, :index
+    end
+
     # Public join confirmation (double opt-in); /confirm* is already public in CheckPagePermission
     get "/confirm_join/:token", JoinConfirmController, :confirm