I have a table component that can apply custom sorting. Each <th> element has a patch link that leads to a new URL, E.G, http://localhost:4000/runs?order=desc&order_by=miles or http://localhost:4000/runs?order=asc&order_by=miles
I accomplished this by passing the table component an anonymous function that generates a route given a map of params, which is then passed to an internal lib function that generates the filter map. Here’s an example of how I use the component in a LiveView:
<.table
rows={@runs}
get_route={fn filter -> ~p"/runs?#{filter}" end} # anonymous function that makes next order
filter={@filter} # map of URL params - <.th> uses this to render the current order
>
<:col :let={run} label="Miles" order_col="miles">
<.link navigate={~p"/runs/#{run.id}"}>
<%= run.miles %>
</.link>
</:col>
....
</.table>
Is there a better way to do this? Does it make any difference if I instead declare a named get_route function in the module? Here’s an abbreviated version of my component:
defp get_next_sort_link(get_route, filter, order_col) do
filter
|> Filter.apply_sort(order_col) # returns a map
|> get_route.() # applies the anonymous function
end
attr :filter, :map, default: %{}
attr :rows, :list, required: true
attr :get_route, :any, default: nil # is there a better type than 'any' ?
slot :col do
attr :label, :string, required: true
attr :order_col, :string
end
def table(assigns) do
<table>
<thead>
<tr>
<%= for col <- @col do %>
<.th
order={Filter.current_order(@filter, Map.get(col, :order_col, nil))}
next_sort_link={
get_next_sort_link(
@get_route,
@filter,
Map.get(col, :order_col, nil)
)
}
>
<%= col.label %>
</.th>
<% end %>
...
end
This all works and doesn’t cause any problems as far as I can tell, but I’m wondering if there is a better way. Thx!
