   import PanWeb.Router.Helpers
 
   def mount(_params, _session, socket) do
-    socket = assign(socket, sort_by: :inserted_at, sort_order: :desc, page: 1, per_page: 10)
+    socket = assign(socket, sort_by: :inserted_at, sort_order: :desc, page: 1, per_page: 10, filter_by: nil)
 
     {:ok, socket |> fetch() |> paginate()}
   end

    assign(socket, opmls: sorted_opmls)
  end

  def handle_event("paginate", %{"page" => page}, socket) do
    {:noreply, assign(socket, page: String.to_integer(page)) |> paginate()}
  end

     |> paginate()}
  end

  def handle_event("filter", %{"value" => value}, socket) do
    {:noreply,
     assign(socket, page: 1, filter_by: value)
     |> fetch()
     |> filter()
     |> sort()
     |> paginate()}
  end

  def render(assigns) do
    ~F"""
    <div class="flex justify-between max-w-7xl">
      <h2 class="text-2xl">Listing opmls</h2>
      <input type="text"  placeholder="Filter" phx-keyup="filter" value={@filter_by} />
    </div>

    <table cellpadding="4" class="my-4">
      <thead>
