feat(overview): rework filter builder with editable chips and native date ranges
Editable filter chips, uniformly-sized value controls, working field-picker search, and native date-range inputs with relative presets in place of the vendored calendar — native inputs give year-jump, manual entry and keyboard accessibility for free.
This commit is contained in:
parent
c0d1550401
commit
8303a39041
23 changed files with 1905 additions and 565 deletions
74
test/mv_web/member_live/index_date_range_test.exs
Normal file
74
test/mv_web/member_live/index_date_range_test.exs
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
defmodule MvWeb.MemberLive.IndexDateRangeTest do
|
||||
@moduledoc """
|
||||
§1.25 / §3.12 (native-first) — the date-range value control combines the
|
||||
relative presets with a separate "Eigener Zeitraum" (custom range) paragraph
|
||||
holding two native `<input type="date">` fields (Von/Bis). cally is removed.
|
||||
|
||||
Picking a preset commits a concrete range; typing into the native Von/Bis
|
||||
inputs commits the custom range through the shared date-filter dispatch.
|
||||
"""
|
||||
use MvWeb.ConnCase, async: false
|
||||
|
||||
import Phoenix.LiveViewTest
|
||||
|
||||
setup %{conn: conn} do
|
||||
actor = Mv.Helpers.SystemActor.get_system_actor()
|
||||
|
||||
{:ok, _member} =
|
||||
Mv.Membership.create_member(
|
||||
%{first_name: "Range", last_name: "Member", email: "range@example.com"},
|
||||
actor: actor
|
||||
)
|
||||
|
||||
%{conn: conn_with_oidc_user(conn)}
|
||||
end
|
||||
|
||||
test "the join-date control shows presets and native Von/Bis date inputs", %{conn: conn} do
|
||||
{:ok, view, _html} = live(conn, ~p"/members")
|
||||
|
||||
pick_field(view, "join_date")
|
||||
|
||||
assert has_element?(view, "[data-testid='value-control-date-range']")
|
||||
assert has_element?(view, "[data-testid='date-presets']")
|
||||
# Separate "Eigener Zeitraum" paragraph with two native date inputs side by side.
|
||||
assert has_element?(view, "[data-testid='custom-range']")
|
||||
assert has_element?(view, "[data-testid='custom-range'] input[type='date'][name='jd_from']")
|
||||
assert has_element?(view, "[data-testid='custom-range'] input[type='date'][name='jd_to']")
|
||||
end
|
||||
|
||||
test "cally is fully removed from the date-range control", %{conn: conn} do
|
||||
{:ok, view, _html} = live(conn, ~p"/members")
|
||||
|
||||
pick_field(view, "join_date")
|
||||
|
||||
refute has_element?(view, "[data-testid='date-range-cally']")
|
||||
refute has_element?(view, "calendar-range")
|
||||
refute has_element?(view, "[phx-hook='DateRangeCally']")
|
||||
end
|
||||
|
||||
test "picking a preset commits a concrete range to the URL", %{conn: conn} do
|
||||
{:ok, view, _html} = live(conn, ~p"/members")
|
||||
|
||||
pick_field(view, "join_date")
|
||||
view |> element("[data-testid='date-preset-this_year']") |> render_click()
|
||||
|
||||
path = assert_patch(view)
|
||||
today = Date.utc_today()
|
||||
assert path =~ "jd_from=#{today.year}-01-01"
|
||||
assert path =~ "jd_to=#{Date.to_iso8601(today)}"
|
||||
end
|
||||
|
||||
test "typing a native custom range commits it to the URL", %{conn: conn} do
|
||||
{:ok, view, _html} = live(conn, ~p"/members")
|
||||
|
||||
pick_field(view, "join_date")
|
||||
|
||||
view
|
||||
|> element("[data-testid='value-control-date-range']")
|
||||
|> render_change(%{"jd_from" => "2024-03-01", "jd_to" => "2024-03-31"})
|
||||
|
||||
path = assert_patch(view)
|
||||
assert path =~ "jd_from=2024-03-01"
|
||||
assert path =~ "jd_to=2024-03-31"
|
||||
end
|
||||
end
|
||||
Loading…
Add table
Add a link
Reference in a new issue