add changeset_errors/1 helper to form components
This commit is contained in:
		| @@ -23,12 +23,7 @@ defmodule CanneryWeb.AmmoGroupLive.FormComponent do | ||||
|   @impl true | ||||
|   def handle_event("validate", %{"ammo_group" => ammo_group_params}, socket) do | ||||
|     ammo_group_params = ammo_group_params |> Map.put("user_id", socket.assigns.current_user.id) | ||||
|  | ||||
|     changeset = | ||||
|       socket.assigns.ammo_group | ||||
|       |> Ammo.change_ammo_group(ammo_group_params) | ||||
|       |> Map.put(:action, :validate) | ||||
|  | ||||
|     changeset = socket.assigns.ammo_group |> Ammo.change_ammo_group(ammo_group_params) | ||||
|     {:noreply, socket |> assign(:changeset, changeset)} | ||||
|   end | ||||
|  | ||||
| @@ -53,48 +48,44 @@ defmodule CanneryWeb.AmmoGroupLive.FormComponent do | ||||
|         phx-submit="save" | ||||
|         class="grid grid-cols-3 justify-center items-center space-y-4" | ||||
|       > | ||||
|         <%= if @changeset.action do %> | ||||
|           <div class="invalid-feedback col-span-3 text-center"> | ||||
|             <%= changeset_errors(@changeset) %> | ||||
|           </div> | ||||
|         <% end %> | ||||
|  | ||||
|         <%= label(f, :count, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= number_input(f, :count, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           min: 1 | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :count) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :count, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :price_paid, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= number_input(f, :price_paid, | ||||
|           step: "0.01", | ||||
|           class: "text-center col-span-2 input input-primary" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :price_paid) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :price_paid, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :notes, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= textarea(f, :notes, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           phx_hook: "MaintainAttrs" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :notes) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :notes, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :ammo_type_id, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= select(f, :ammo_type_id, ammo_type_options(@ammo_types), | ||||
|           class: "text-center col-span-2 input input-primary" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :ammo_type_id) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :ammo_type_id, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :container, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= select(f, :container_id, container_options(@containers), | ||||
|           class: "text-center col-span-2 input input-primary" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :container_id) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :container_id, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= submit("Save", | ||||
|           phx_disable_with: "Saving...", | ||||
|   | ||||
| @@ -20,11 +20,7 @@ defmodule CanneryWeb.AmmoTypeLive.FormComponent do | ||||
|  | ||||
|   @impl true | ||||
|   def handle_event("validate", %{"ammo_type" => ammo_type_params}, socket) do | ||||
|     changeset = | ||||
|       socket.assigns.ammo_type | ||||
|       |> Ammo.change_ammo_type(ammo_type_params) | ||||
|       |> Map.put(:action, :validate) | ||||
|  | ||||
|     changeset = socket.assigns.ammo_type |> Ammo.change_ammo_type(ammo_type_params) | ||||
|     {:noreply, socket |> assign(:changeset, changeset)} | ||||
|   end | ||||
|  | ||||
| @@ -48,20 +44,22 @@ defmodule CanneryWeb.AmmoTypeLive.FormComponent do | ||||
|         phx-submit="save" | ||||
|         class="grid grid-cols-3 justify-center items-center space-y-4" | ||||
|       > | ||||
|         <%= if @changeset.action do %> | ||||
|           <div class="invalid-feedback col-span-3 text-center"> | ||||
|             <%= changeset_errors(@changeset) %> | ||||
|           </div> | ||||
|         <% end %> | ||||
|  | ||||
|         <%= label(f, :name, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :name, class: "text-center col-span-2 input input-primary") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :name) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :name, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :desc, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= textarea(f, :desc, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           phx_hook: "MaintainAttrs" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :desc) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :desc, "col-span-3 text-center") %> | ||||
|  | ||||
|         <a | ||||
|           href="https://en.wikipedia.org/wiki/Bullet#Abbreviations" | ||||
| @@ -74,45 +72,35 @@ defmodule CanneryWeb.AmmoTypeLive.FormComponent do | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: "FMJ" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :bullet_type) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :bullet_type, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :bullet_core, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :bullet_core, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: "Steel" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :bullet_core) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :bullet_core, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :cartridge, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :cartridge, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: "5.56x46mm NATO" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :cartridge) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :cartridge, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :caliber, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :caliber, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: ".223" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :caliber) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :caliber, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :case_material, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :case_material, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: "Brass" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :case_material) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :case_material, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :grains, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= number_input(f, :grains, | ||||
| @@ -120,60 +108,42 @@ defmodule CanneryWeb.AmmoTypeLive.FormComponent do | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           min: 1 | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :grains) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :grains, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :pressure, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :pressure, | ||||
|           class: "text-center col-span-2 input input-primary", | ||||
|           placeholder: "+P" | ||||
|         ) %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :pressure) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :pressure, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :rimfire, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= checkbox(f, :rimfire, class: "text-center col-span-2 checkbox") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :rimfire) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :rimfire, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :tracer, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= checkbox(f, :tracer, class: "text-center col-span-2 checkbox") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :tracer) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :tracer, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :incendiary, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= checkbox(f, :incendiary, class: "text-center col-span-2 checkbox") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :incendiary) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :incendiary, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :blank, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= checkbox(f, :blank, class: "text-center col-span-2 checkbox") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :blank) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :blank, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :corrosive, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= checkbox(f, :corrosive, class: "text-center col-span-2 checkbox") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :corrosive) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :corrosive, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :manufacturer, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :manufacturer, class: "text-center col-span-2 input input-primary") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :manufacturer) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :manufacturer, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :sku, class: "mr-4 title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :sku, class: "text-center col-span-2 input input-primary") %> | ||||
|         <div class="col-span-3 text-center"> | ||||
|           <%= error_tag(f, :sku) %> | ||||
|         </div> | ||||
|         <%= error_tag(f, :sku, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= submit("Save", | ||||
|           phx_disable_with: "Saving...", | ||||
|   | ||||
| @@ -17,12 +17,7 @@ defmodule CanneryWeb.ContainerLive.FormComponent do | ||||
|   @impl true | ||||
|   def handle_event("validate", %{"container" => container_params}, socket) do | ||||
|     container_params = container_params |> Map.put("user_id", socket.assigns.current_user.id) | ||||
|  | ||||
|     changeset = | ||||
|       socket.assigns.container | ||||
|       |> Containers.change_container(container_params) | ||||
|       |> Map.put(:action, :validate) | ||||
|  | ||||
|     changeset = socket.assigns.container |> Containers.change_container(container_params) | ||||
|     {:noreply, socket |> assign(:changeset, changeset)} | ||||
|   end | ||||
|  | ||||
| @@ -47,40 +42,42 @@ defmodule CanneryWeb.ContainerLive.FormComponent do | ||||
|         phx-change="validate" | ||||
|         phx-submit="save" | ||||
|       > | ||||
|         <%= if @changeset.action do %> | ||||
|           <div class="invalid-feedback col-span-3 text-center"> | ||||
|             <%= changeset_errors(@changeset) %> | ||||
|           </div> | ||||
|         <% end %> | ||||
|  | ||||
|         <%= label(f, :name, class: "title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :name, | ||||
|           class: "input input-primary col-span-2", | ||||
|           placeholder: "My cool ammo can" | ||||
|         ) %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :name) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :name, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :desc, class: "title text-lg text-primary-500") %> | ||||
|         <%= textarea(f, :desc, | ||||
|           class: "input input-primary col-span-2", | ||||
|           phx_hook: "MaintainAttrs", | ||||
|           placeholder: "Metal ammo can with the anime girl sticker" | ||||
|         ) %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :desc) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :desc, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :type, class: "title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :type, | ||||
|           class: "input input-primary col-span-2", | ||||
|           placeholder: "Magazine, Clip, Ammo Box, etc" | ||||
|         ) %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :type) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :type, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= label(f, :location, class: "title text-lg text-primary-500") %> | ||||
|         <%= textarea(f, :location, | ||||
|           class: "input input-primary col-span-2", | ||||
|           phx_hook: "MaintainAttrs", | ||||
|           placeholder: "On the bookshelf" | ||||
|         ) %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :location) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :location, "col-span-3 text-center") %> | ||||
|  | ||||
|         <%= submit("Save", | ||||
|           class: "mx-auto btn btn-primary col-span-3", | ||||
|           phx_disable_with: "Saving..." | ||||
|   | ||||
| @@ -20,11 +20,7 @@ defmodule CanneryWeb.InviteLive.FormComponent do | ||||
|  | ||||
|   @impl true | ||||
|   def handle_event("validate", %{"invite" => invite_params}, socket) do | ||||
|     changeset = | ||||
|       socket.assigns.invite | ||||
|       |> Invites.change_invite(invite_params) | ||||
|       |> Map.put(:action, :validate) | ||||
|  | ||||
|     changeset = socket.assigns.invite |> Invites.change_invite(invite_params) | ||||
|     {:noreply, assign(socket, :changeset, changeset)} | ||||
|   end | ||||
|  | ||||
| @@ -48,16 +44,20 @@ defmodule CanneryWeb.InviteLive.FormComponent do | ||||
|         phx-change="validate" | ||||
|         phx-submit="save" | ||||
|       > | ||||
|         <%= if @changeset.action do %> | ||||
|           <div class="invalid-feedback col-span-3 text-center"> | ||||
|             <%= changeset_errors(@changeset) %> | ||||
|           </div> | ||||
|         <% end %> | ||||
|  | ||||
|         <%= label(f, :name, class: "title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :name, class: "input input-primary col-span-2") %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :name) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :name, "col-span-3") %> | ||||
|  | ||||
|         <%= label(f, :uses_left, class: "title text-lg text-primary-500") %> | ||||
|         <%= number_input(f, :uses_left, min: 0, class: "input input-primary col-span-2") %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :uses_left) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :uses_left, "col-span-3") %> | ||||
|  | ||||
|         <%= submit("Save", | ||||
|           class: "mx-auto btn btn-primary col-span-3", | ||||
|           phx_disable_with: "Saving..." | ||||
|   | ||||
| @@ -22,10 +22,7 @@ defmodule CanneryWeb.TagLive.FormComponent do | ||||
|   def handle_event("validate", %{"tag" => tag_params}, socket) do | ||||
|     tag_params = tag_params |> Map.put("user_id", socket.assigns.current_user.id) | ||||
|  | ||||
|     changeset = | ||||
|       socket.assigns.tag | ||||
|       |> Tags.change_tag(tag_params) | ||||
|       |> Map.put(:action, :validate) | ||||
|     changeset = socket.assigns.tag |> Tags.change_tag(tag_params) | ||||
|  | ||||
|     {:noreply, socket |> assign(:changeset, changeset)} | ||||
|   end | ||||
| @@ -51,25 +48,28 @@ defmodule CanneryWeb.TagLive.FormComponent do | ||||
|         phx-change="validate" | ||||
|         phx-submit="save" | ||||
|       > | ||||
|         <%= if @changeset.action do %> | ||||
|           <div class="invalid-feedback col-span-3 text-center"> | ||||
|             <%= changeset_errors(@changeset) %> | ||||
|           </div> | ||||
|         <% end %> | ||||
|  | ||||
|         <%= label(f, :name, class: "title text-lg text-primary-500") %> | ||||
|         <%= text_input(f, :name, class: "input input-primary col-span-2") %> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :name) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :name, "col-span-3") %> | ||||
|  | ||||
|         <%= label(f, :bg_color, class: "title text-lg text-primary-500") %> | ||||
|         <span class="mx-auto col-span-2" phx-update="ignore"> | ||||
|           <%= color_input(f, :bg_color) %> | ||||
|         </span> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :bg_color) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :bg_color, "col-span-3") %> | ||||
|  | ||||
|         <%= label(f, :text_color, class: "title text-lg text-primary-500") %> | ||||
|         <span class="mx-auto col-span-2" phx-update="ignore"> | ||||
|           <%= color_input(f, :text_color) %> | ||||
|         </span> | ||||
|         <span class="col-span-3"> | ||||
|           <%= error_tag(f, :text_color) %> | ||||
|         </span> | ||||
|         <%= error_tag(f, :text_color, "col-span-3") %> | ||||
|  | ||||
|         <%= submit("Save", | ||||
|           class: "mx-auto btn btn-primary col-span-3", | ||||
|           phx_disable_with: "Saving..." | ||||
|   | ||||
| @@ -4,22 +4,32 @@ defmodule CanneryWeb.ErrorHelpers do | ||||
|   """ | ||||
|  | ||||
|   use Phoenix.HTML | ||||
|   import Phoenix.LiveView.Helpers | ||||
|   alias Phoenix.{HTML.Form, LiveView.Rendered} | ||||
|   alias Ecto.Changeset | ||||
|  | ||||
|   @doc """ | ||||
|   Generates tag for inlined form input errors. | ||||
|   """ | ||||
|   def error_tag(form, field) do | ||||
|     Enum.map(Keyword.get_values(form.errors, field), fn error -> | ||||
|       content_tag(:span, translate_error(error), | ||||
|         class: "invalid-feedback", | ||||
|         phx_feedback_for: input_name(form, field) | ||||
|       ) | ||||
|     end) | ||||
|   @spec error_tag(Form.t(), Form.field()) :: Rendered.t() | ||||
|   @spec error_tag(Form.t(), Form.field(), String.t()) :: Rendered.t() | ||||
|   def error_tag(form, field, extra_class \\ "") do | ||||
|     assigns = %{extra_class: extra_class, form: form, field: field} | ||||
|  | ||||
|     ~H""" | ||||
|       <%= for error <- Keyword.get_values(@form.errors, @field) do %> | ||||
|         <span class={"invalid-feedback #{@extra_class}"} | ||||
|           phx-feedback-for={input_name(@form, @field)}> | ||||
|           <%= translate_error(error) %> | ||||
|         </span> | ||||
|       <% end %> | ||||
|     """ | ||||
|   end | ||||
|  | ||||
|   @doc """ | ||||
|   Translates an error message using gettext. | ||||
|   """ | ||||
|   @spec translate_error({String.t(), keyword() | map()}) :: String.t() | ||||
|   def translate_error({msg, opts}) do | ||||
|     # When using gettext, we typically pass the strings we want | ||||
|     # to translate as a static argument: | ||||
| @@ -44,4 +54,16 @@ defmodule CanneryWeb.ErrorHelpers do | ||||
|       Gettext.dgettext(CanneryWeb.Gettext, "errors", msg, opts) | ||||
|     end | ||||
|   end | ||||
|  | ||||
|   @doc """ | ||||
|   Displays all errors from a changeset | ||||
|   """ | ||||
|   @spec changeset_errors(Changeset.t()) :: String.t() | ||||
|   def changeset_errors(changeset) do | ||||
|     changeset | ||||
|     |> Changeset.traverse_errors(fn error -> error |> translate_error() end) | ||||
|     |> Enum.map_join(". ", fn {key, errors} -> | ||||
|       "#{key |> humanize()}: #{errors |> Enum.join(", ")}" | ||||
|     end) | ||||
|   end | ||||
| end | ||||
|   | ||||
		Reference in New Issue
	
	Block a user