mirror of
				https://github.com/livebook-dev/livebook.git
				synced 2025-10-31 07:46:18 +08:00 
			
		
		
		
	Update app form to use checkboxes (#1732)
Co-authored-by: José Valim <jose.valim@dashbit.co>
This commit is contained in:
		
							parent
							
								
									bfcf82f06b
								
							
						
					
					
						commit
						fbf52a9bd8
					
				
					 2 changed files with 52 additions and 11 deletions
				
			
		|  | @ -216,6 +216,45 @@ defmodule LivebookWeb.FormComponents do | |||
|     """ | ||||
|   end | ||||
| 
 | ||||
|   @doc """ | ||||
|   Renders checkbox input with label and error messages. | ||||
|   """ | ||||
|   attr :id, :any, default: nil | ||||
|   attr :name, :any | ||||
|   attr :label, :string, default: nil | ||||
|   attr :value, :any | ||||
|   attr :errors, :list, default: [] | ||||
|   attr :field, Phoenix.HTML.FormField, doc: "a form field struct retrieved from the form" | ||||
| 
 | ||||
|   attr :disabled, :boolean, default: false | ||||
|   attr :checked_value, :string, default: "true" | ||||
|   attr :unchecked_value, :string, default: "false" | ||||
| 
 | ||||
|   attr :rest, :global | ||||
| 
 | ||||
|   def checkbox_field(assigns) do | ||||
|     assigns = assigns_from_field(assigns) | ||||
| 
 | ||||
|     ~H""" | ||||
|     <div phx-feedback-for={@name} class={[@errors != [] && "show-errors"]}> | ||||
|       <label class="flex items-center gap-2 cursor-pointer"> | ||||
|         <input type="hidden" value={@unchecked_value} name={@name} /> | ||||
|         <input | ||||
|           type="checkbox" | ||||
|           class="checkbox" | ||||
|           value={@checked_value} | ||||
|           name={@name} | ||||
|           id={@id || @name} | ||||
|           checked={to_string(@value) == @checked_value} | ||||
|           {@rest} | ||||
|         /> | ||||
|         <span :if={@label}><%= @label %></span> | ||||
|       </label> | ||||
|       <.error :for={msg <- @errors}><%= msg %></.error> | ||||
|     </div> | ||||
|     """ | ||||
|   end | ||||
| 
 | ||||
|   @doc """ | ||||
|   Renders radio inputs with label and error messages. | ||||
|   """ | ||||
|  |  | |||
|  | @ -71,18 +71,20 @@ defmodule LivebookWeb.SessionLive.AppInfoComponent do | |||
|             > | ||||
|               <div class="flex flex-col space-y-4"> | ||||
|                 <.text_field field={f[:slug]} label="Slug" spellcheck="false" phx-debounce="blur" /> | ||||
|                 <.switch_field | ||||
|                   field={f[:access_type]} | ||||
|                   label="Password-protected" | ||||
|                   checked_value="protected" | ||||
|                   unchecked_value="public" | ||||
|                 /> | ||||
|                 <%= if Ecto.Changeset.get_field(@changeset, :access_type) == :protected do %> | ||||
|                   <.password_field field={f[:password]} spellcheck="false" phx-debounce="blur" /> | ||||
|                 <% end %> | ||||
|                 <.switch_field field={f[:show_source]} label="Show source" /> | ||||
|                 <div class="flex flex-col space-y-1"> | ||||
|                   <.checkbox_field | ||||
|                     field={f[:access_type]} | ||||
|                     label="Password-protected" | ||||
|                     checked_value="protected" | ||||
|                     unchecked_value="public" | ||||
|                   /> | ||||
|                   <%= if Ecto.Changeset.get_field(@changeset, :access_type) == :protected do %> | ||||
|                     <.password_field field={f[:password]} spellcheck="false" phx-debounce="blur" /> | ||||
|                   <% end %> | ||||
|                 </div> | ||||
|                 <.checkbox_field field={f[:show_source]} label="Show source" /> | ||||
|               </div> | ||||
|               <div class="mt-5 flex space-x-2"> | ||||
|               <div class="mt-6 flex space-x-2"> | ||||
|                 <button class="button-base button-blue" type="submit" disabled={not @changeset.valid?}> | ||||
|                   Deploy | ||||
|                 </button> | ||||
|  |  | |||
		Loading…
	
	Add table
		
		Reference in a new issue