Follow-up: using empty operator with checkboxes, in an inverted way, with correct loading on mount

[linusdm]

Thanks for the suggestions in this issue: #297 (comment)! I hope it's ok I take the discussion here, to keep the issue clean.

Defining the checkboxes like that works, although it took a while to get it all right. The main problem I had to solve had to do with the default setting of the filter. The hidden input takes care of the case when you've submitted the form with the checkbox unchecked, but it doesn't help with the initial render/mount, when no data has yet been submitted. I used Flop.Filter.put_new/2 to add a default filter, when no filter was defined in the params. Manipulating the params directly felt very wrong, because it's an indexed map (%{"0" => ...}) where the order could be easily changed. This appears in a context module somewhere:

def list_entities(params) do
  case Flop.validate(params) do
    {:ok, %Flop{filters: filters} = flop} ->
      filters =
        Flop.Filter.put_new(filters, %Flop.Filter{field: :some_field, op: :empty, value: true})
      from(e in Entity)
      |> Flop.validate_and_run(%{flop | filters: filters}, for: Entity)

    {:error, meta} ->
      {:error, meta}
  end
end

I'm not sure if this can be simplified somehow. It's a bit unfortunate that the params are validated twice, like this. Maybe I'm missing something here, but this is as clean as I could get it.

The other issue had to do with how the actual value was bound to the checkbox input. Since it's somewhat inverted (when it's checked the value is "", while when it's unchecked the value should be true), I also had to jump through a hoop to forward the value attribute to the checkbox input:

<Flop.Phoenix.filter_fields
  :let={i}
  form={f}
  fields={[
    # other fields
    some_field: [label: "some field", op: :empty, type: "checkbox", invert_value: true]
  ]}
>
  <.input
    id={i.id}
    name={i.name}
    label={i.label}
    type={i.type}
    # hacky solution for binding the value (`i.value` can be `nil`)
    value={if(i.rest[:invert_value], do: !i.value, else: i.value)}
    # doing the trick with the checked and unchecked value
    unchecked_value="true"
    checked_value=""
    field={{i.form, i.field}}
    {i.rest}
  />
</Flop.Phoenix.filter_fields>

I've added the unchecked_value and checked_value attributes for the checkbox input, which works great.

Just wanted to share the issues I had. Might be interesting to think about how this can be improved, or to notice something missing in the library itself regarding setting defaults like I did (although I don't have any suggestions right now).

[woylie]

I used Flop.Filter.put_new/2 to add a default filter, when no filter was defined in the params. Manipulating the params directly felt very wrong, because it's an indexed map (%{"0" => ...}) where the order could be easily changed.

I'm not sure if this can be simplified somehow. It's a bit unfortunate that the params are validated twice, like this. Maybe I'm missing something here, but this is as clean as I could get it.

That's nearly correct. After calling validate, you can pass the Flop struct directly to Flop.run, so that the parameters are not validated again. Also, I'd use a with statement here, unless you need to run additional commands in the error case.

def list_entities(params) do
  with {:ok, %Flop{filters: filters} = flop} <- Flop.validate(params) do
      filters = Flop.Filter.put_new(filters, %Flop.Filter{field: :some_field, op: :empty, value: true})
      {:ok, Flop.run(Entity, %{flop | filters: filters}, for: Entity)}
  end
end

The Phoenix.HTML.FormData implementation for Flop.Meta also supports a default value, but that would only help you if you first render the filter form without making a query, and then query the data the first time when the filter form is submitted.

fields={[some_field: [label: "some field", op: :empty, type: "checkbox", default: true]]}

The other issue had to do with how the actual value was bound to the checkbox input. Since it's somewhat inverted (when it's checked the value is "", while when it's unchecked the value should be true), I also had to jump through a hoop to forward the value attribute to the checkbox input:

<Flop.Phoenix.filter_fields
  :let={i}
  form={f}
  fields={[
    # other fields
    some_field: [label: "some field", op: :empty, type: "checkbox", invert_value: true]
  ]}
>
  <.input
    id={i.id}
    name={i.name}
    label={i.label}
    type={i.type}
    # hacky solution for binding the value (`i.value` can be `nil`)
    value={if(i.rest[:invert_value], do: !i.value, else: i.value)}
    # doing the trick with the checked and unchecked value
    unchecked_value="true"
    checked_value=""
    field={{i.form, i.field}}
    {i.rest}
  />
</Flop.Phoenix.filter_fields>

That doesn't look too hacky to me. But be aware that value can be either a boolean or a string, so if you want to compare or negate the value, you should use Phoenix.HTML.Form.normalize_value("checkbox", i.value) to get the value as a boolean.

value={if(i.rest[:invert_value], do: !Phoenix.HTML.Form.normalize_value("checkbox", i.value), else: i.value)}

The filter_fields component was updated in 0.18 to pass the new Phoenix.HTML.FormField struct to the inner block. I'd probably write a helper function for the value inversion, or handle it directly in the input component.

[linusdm]

Thank you! Great suggestions.

Except from wrapping the result of Flop.run/3 in an {:ok, result} tuple, and passing in the type to Phoenix.HTML.Form.normalize_value/2, this works perfect. TIL about normalizing the values!