Skip to content

Commit 773b27e

Browse files
committed
Fixes for Filter Pills - Ensure Invalid Options Are Removed
1 parent 4f09e07 commit 773b27e

File tree

8 files changed

+116
-90
lines changed

8 files changed

+116
-90
lines changed

resources/views/components/tools/filter-pills.blade.php

Lines changed: 7 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -15,84 +15,19 @@
1515

1616
@foreach($this->getAppliedFiltersWithValues() as $filterSelectName => $value)
1717
@php($filter = $this->getFilterByKey($filterSelectName))
18-
19-
@continue(is_null($filter))
20-
@continue($filter->isHiddenFromPills())
18+
@continue(is_null($filter) || $filter->isHiddenFromPills())
19+
@php( $filterPillTitle = $filter->getFilterPillTitle())
20+
@php( $filterPillValue = $filter->getFilterPillValue($value))
21+
@php( $separator = method_exists($filter, 'getPillsSeparator') ? $filter->getPillsSeparator() : ', ')
22+
@continue((is_array($filterPillValue) && empty($filterPillValue)))
2123

2224
@if ($filter->hasCustomPillBlade())
2325
@include($filter->getCustomPillBlade(), ['filter' => $filter])
2426
@else
25-
<span
26-
wire:key="{{ $tableName }}-filter-pill-{{ $filter->getKey() }}"
27-
@class([
28-
'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium leading-4 bg-indigo-100 text-indigo-800 capitalize dark:bg-indigo-200 dark:text-indigo-900' => $isTailwind,
29-
'badge badge-pill badge-info d-inline-flex align-items-center' => $isBootstrap4,
30-
'badge rounded-pill bg-info d-inline-flex align-items-center' => $isBootstrap5,
31-
])
32-
>
33-
{{ $filter->getFilterPillTitle() }}:
34-
@php( $filterPillValue = $filter->getFilterPillValue($value))
35-
@php( $separator = method_exists($filter, 'getPillsSeparator') ? $filter->getPillsSeparator() : ', ')
36-
37-
@if(is_array($filterPillValue) && !empty($filterPillValue))
38-
@foreach($filterPillValue as $filterPillArrayValue)
39-
{{ $filterPillArrayValue }}{!! $separator !!}
40-
@endforeach
41-
@else
42-
{{ $filterPillValue }}
43-
@endif
44-
45-
@if ($isTailwind)
46-
<button
47-
wire:click="resetFilter('{{ $filter->getKey() }}')"
48-
type="button"
49-
class="flex-shrink-0 ml-0.5 h-4 w-4 rounded-full inline-flex items-center justify-center text-indigo-400 hover:bg-indigo-200 hover:text-indigo-500 focus:outline-none focus:bg-indigo-500 focus:text-white"
50-
>
51-
<span class="sr-only">@lang('livewire-tables::Remove filter option')</span>
52-
<x-heroicon-m-x-mark class="h-full" />
53-
</button>
54-
@else
55-
<a
56-
href="#"
57-
wire:click="resetFilter('{{ $filter->getKey() }}')"
58-
@class([
59-
'text-white ml-2' => ($isBootstrap),
60-
])
61-
>
62-
<span @class([
63-
'sr-only' => $isBootstrap4,
64-
'visually-hidden' => $isBootstrap5,
65-
])>
66-
@lang('livewire-tables::Remove filter option')
67-
</span>
68-
<x-heroicon-m-x-mark class="laravel-livewire-tables-btn-tiny" />
69-
</a>
70-
@endif
71-
</span>
27+
<x-livewire-tables::tools.filter-pills.item :$filterPillTitle :$filterPillValue :$filterSelectName :$separator/>
7228
@endif
7329
@endforeach
74-
75-
@if ($isTailwind)
76-
<button
77-
wire:click.prevent="setFilterDefaults"
78-
class="focus:outline-none active:outline-none"
79-
>
80-
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800 dark:bg-gray-200 dark:text-gray-900">
81-
@lang('livewire-tables::Clear')
82-
</span>
83-
</button>
84-
@else
85-
<a
86-
href="#"
87-
wire:click.prevent="setFilterDefaults"
88-
@class([
89-
'badge badge-pill badge-light' => $isBootstrap4,
90-
'badge rounded-pill bg-light text-dark text-decoration-none' => $isBootstrap5,
91-
])
92-
>
93-
@lang('livewire-tables::Clear')
94-
</a>
95-
@endif
30+
<x-livewire-tables::tools.filter-pills.buttons.reset-all />
9631
</div>
9732
</div>
9833
@endif
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@aware(['isTailwind','isBootstrap','isBootstrap4','isBootstrap5'])
2+
@if ($isTailwind)
3+
<button
4+
wire:click.prevent="setFilterDefaults"
5+
@class([
6+
"focus:outline-none active:outline-none"
7+
])>
8+
<span @class([
9+
"inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium",
10+
"bg-gray-100 text-gray-800 dark:bg-gray-200 dark:text-gray-900"
11+
])>
12+
@lang('livewire-tables::Clear')
13+
</span>
14+
</button>
15+
@else
16+
<a
17+
href="#"
18+
wire:click.prevent="setFilterDefaults"
19+
@class([
20+
'badge badge-pill badge-light' => $isBootstrap4,
21+
'badge rounded-pill bg-light text-dark text-decoration-none' => $isBootstrap5,
22+
])>
23+
@lang('livewire-tables::Clear')
24+
</a>
25+
@endif
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
@aware(['tableName','isTailwind','isBootstrap','isBootstrap4','isBootstrap5'])
2+
@props(['filterKey'])
3+
@if ($isTailwind)
4+
<button
5+
wire:click="resetFilter('{{ $filterKey }}')"
6+
type="button"
7+
@class([
8+
"flex-shrink-0 ml-0.5 h-4 w-4 rounded-full inline-flex items-center justify-center focus:outline-none",
9+
"text-indigo-400 hover:bg-indigo-200 hover:text-indigo-500 focus:bg-indigo-500 focus:text-white",
10+
])
11+
>
12+
<span class="sr-only">@lang('livewire-tables::Remove filter option')</span>
13+
<x-heroicon-m-x-mark class="h-full" />
14+
</button>
15+
@else
16+
<a
17+
href="#"
18+
wire:click="resetFilter('{{ $filterKey }}')"
19+
@class([
20+
'text-white ml-2' => ($isBootstrap),
21+
])
22+
>
23+
<span @class([
24+
'sr-only' => $isBootstrap4,
25+
'visually-hidden' => $isBootstrap5,
26+
])>
27+
@lang('livewire-tables::Remove filter option')
28+
</span>
29+
<x-heroicon-m-x-mark class="laravel-livewire-tables-btn-tiny" />
30+
</a>
31+
@endif
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
@aware(['tableName','isTailwind','isBootstrap','isBootstrap4','isBootstrap5'])
2+
@props(['filterPillTitle', 'filterPillValue', 'filterSelectName', 'separator'])
3+
<span
4+
wire:key="{{ $tableName }}-filter-pill-{{ $filterSelectName }}"
5+
@class([
6+
'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium leading-4 bg-indigo-100 text-indigo-800 capitalize dark:bg-indigo-200 dark:text-indigo-900' => $isTailwind,
7+
'badge badge-pill badge-info d-inline-flex align-items-center' => $isBootstrap4,
8+
'badge rounded-pill bg-info d-inline-flex align-items-center' => $isBootstrap5,
9+
])
10+
>
11+
{{ $filterPillTitle }}:
12+
13+
@if(is_array($filterPillValue))
14+
@foreach($filterPillValue as $filterPillArrayValue)
15+
{{ $filterPillArrayValue }}{!! !$loop->last ? $separator : '' !!}
16+
@endforeach
17+
@else
18+
{{ $filterPillValue }}
19+
@endif
20+
21+
<x-livewire-tables::tools.filter-pills.buttons.reset-filter :filterKey="$filterSelectName" />
22+
23+
</span>

src/Traits/Helpers/FilterHelpers.php

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -226,11 +226,24 @@ public function hasAppliedVisibleFiltersForPills(): bool
226226
/**
227227
* @return array<mixed>
228228
*/
229-
public function getAppliedFiltersWithValues(): array
229+
/*public function getAppliedFiltersWithValuesOld(): array
230230
{
231231
return $this->appliedFilters = array_filter($this->getAppliedFilters(), function ($item, $key) {
232232
return ! $this->getFilterByKey($key)->isEmpty($item) && (is_array($item) ? count($item) : $item !== null);
233233
}, ARRAY_FILTER_USE_BOTH);
234+
}*/
235+
236+
/**
237+
* @return array<mixed>
238+
*/
239+
public function getAppliedFiltersWithValues(): array
240+
{
241+
return $this->appliedFilters = array_filter($this->getAppliedFilters(), function ($item, $key) {
242+
$filter = $this->getFilterByKey($key);
243+
$item = (!is_null($item) && !$filter->isEmpty($item)) ? $filter->validate($item) : $item;
244+
245+
return ! $filter->isEmpty($item) && (is_array($item) ? count($item) : $item !== null);
246+
}, ARRAY_FILTER_USE_BOTH);
234247
}
235248

236249
/**

tests/Traits/Helpers/FilterHelpersTest.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ public function test_can_set_filter_value(): void
104104

105105
$this->assertSame(['1'], $this->basicTable->getAppliedFilterWithValue('breed'));
106106

107-
$this->basicTable->setFilter('breed_id_filter', '2');
107+
$this->basicTable->setFilter('breed_id_filter', 2);
108108

109109
$this->assertSame('2', $this->basicTable->getAppliedFilterWithValue('breed_id_filter'));
110110

tests/Traits/Helpers/SessionStorageHelpersTest.php

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -36,36 +36,36 @@ public function test_can_store_for_fikers(): void
3636
$this->assertSame(['breed' => ['1']], $this->basicTable->appliedFilters);
3737
$this->assertSame(['breed' => ['1']], $this->basicTable->getStoredFilterValues());
3838

39-
$this->basicTable->setFilter('breed', ['22']);
40-
$this->assertSame(['breed' => ['22']], $this->basicTable->appliedFilters);
41-
$this->assertSame(['22'], $this->basicTable->getAppliedFilterWithValue('breed'));
42-
$this->assertSame(['breed' => ['22']], $this->basicTable->getStoredFilterValues());
39+
$this->basicTable->setFilter('breed', ['2']);
40+
$this->assertSame(['breed' => ['2']], $this->basicTable->appliedFilters);
41+
$this->assertSame(['2'], $this->basicTable->getAppliedFilterWithValue('breed'));
42+
$this->assertSame(['breed' => ['2']], $this->basicTable->getStoredFilterValues());
4343

4444
$this->basicTable->restoreFilterValues();
45-
$this->assertSame(['22'], $this->basicTable->getAppliedFilterWithValue('breed'));
46-
$this->assertSame(['breed' => ['22']], $this->basicTable->getStoredFilterValues());
45+
$this->assertSame(['2'], $this->basicTable->getAppliedFilterWithValue('breed'));
46+
$this->assertSame(['breed' => ['2']], $this->basicTable->getStoredFilterValues());
4747

4848
$this->basicTable->clearStoredFilterValues();
4949
$this->assertSame([], $this->basicTable->getStoredFilterValues());
50-
$this->assertSame(['22'], $this->basicTable->getAppliedFilterWithValue('breed'));
50+
$this->assertSame(['2'], $this->basicTable->getAppliedFilterWithValue('breed'));
5151

52-
$this->basicTable->setFilter('breed', ['33']);
53-
$this->assertSame(['breed' => ['33']], $this->basicTable->getStoredFilterValues());
54-
$this->assertSame(['33'], $this->basicTable->getAppliedFilterWithValue('breed'));
52+
$this->basicTable->setFilter('breed', ['3']);
53+
$this->assertSame(['breed' => ['3']], $this->basicTable->getStoredFilterValues());
54+
$this->assertSame(['3'], $this->basicTable->getAppliedFilterWithValue('breed'));
5555

56-
$this->basicTable->appliedFilters = $this->basicTable->filterComponents = ['breed' => ['44']];
56+
$this->basicTable->appliedFilters = $this->basicTable->filterComponents = ['breed' => ['4']];
5757
$this->basicTable->storeFilterValues();
58-
$this->assertSame(['44'], $this->basicTable->getAppliedFilterWithValue('breed'));
58+
$this->assertSame(['4'], $this->basicTable->getAppliedFilterWithValue('breed'));
5959

6060
$this->basicTable->appliedFilters = $this->basicTable->filterComponents = [];
6161
$this->assertNull($this->basicTable->getAppliedFilterWithValue('breed'));
6262
$this->assertSame([], $this->basicTable->appliedFilters);
6363
$this->assertSame([], $this->basicTable->filterComponents);
6464

6565
$this->basicTable->restoreFilterValues();
66-
$this->assertSame(['breed' => ['44']], $this->basicTable->appliedFilters);
67-
$this->assertSame(['44'], $this->basicTable->getAppliedFilterWithValue('breed'));
68-
$this->assertSame(['breed' => ['44']], $this->basicTable->getStoredFilterValues());
66+
$this->assertSame(['breed' => ['4']], $this->basicTable->appliedFilters);
67+
$this->assertSame(['4'], $this->basicTable->getAppliedFilterWithValue('breed'));
68+
$this->assertSame(['breed' => ['4']], $this->basicTable->getStoredFilterValues());
6969

7070
}
7171

tests/Traits/Visuals/FilterVisualsTest.php

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -152,7 +152,6 @@ public function filters(): array
152152
'Cat',
153153
'<br />',
154154
'Dog',
155-
'<br />',
156155
])
157156
->set('filterComponents.breed', [1, 2])
158157
->assertSeeHtmlInOrder([

0 commit comments

Comments
 (0)