Moving Custom Filter Label into Filter-Label Blade

rappasoft · Oct 6, 2023 · edab8cb · edab8cb
1 parent 609d261
commit edab8cb
Show file tree

Hide file tree

Showing 15 changed files with 99 additions and 56 deletions.
diff --git a/docs/filters/available-methods.md b/docs/filters/available-methods.md
@@ -352,6 +352,21 @@ Example blade:
 </label>
 ```
 
+### setFilterLabelAttributes
+Set custom attributes for a Filter Label.  At present it is recommended to only use this for "class" and "style" attributes to avoid conflicts.
+
+By default, this replaces the default classes on the Filter Label wrapper, if you would like to keep them, set the default flag to true.
+
+```php
+TextFilter::make('Name')
+    ->setFilterLabelAttributes(
+        [
+            'class' => 'text-xl', 
+            'default' => true,
+        ]
+    ),
+```
+
 ### Config
 
 If the filter takes any config options, you can set them with the `config` method:

diff --git a/resources/views/components/tools/filter-label.blade.php b/resources/views/components/tools/filter-label.blade.php
@@ -1,12 +1,26 @@
 @aware(['component', 'tableName'])
-@props(['filter', 'filterLayout' => 'popover', 'tableName' => 'table'])
-
-<label for="{{ $tableName }}-filter-{{ $filter->getKey() }}"
-    @class([
-        'block text-sm font-medium leading-5 text-gray-700 dark:text-white' => $component->isTailwind(),
-        'd-block' => $component->isBootstrap() && $filterLayout == 'slide-down',
-        'mb-2' => $component->isBootstrap() && $filterLayout == 'popover',
-    ])
->
-    {{ $filter->getName() }}
-</label>
+@props(['filter', 'filterLayout' => 'popover', 'tableName' => 'table', 'isTailwind' => false, 'isBootstrap' => false, 'isBootstrap4' => false, 'isBootstrap5' => false])
+
+@php
+    $customAttributes = $filter->getFilterLabelAttributes();
+@endphp
+
+@if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
+    @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName, 'isTailwind' => $isTailwind, 'isBootstrap' => $isBootstrap, 'isBootstrap4' => $isBootstrap4, 'isBootstrap5' => $isBootstrap5, 'customAttributes' => $customAttributes])
+@elseif(!$filter->hasCustomPosition())
+    <label for="{{ $tableName }}-filter-{{ $filter->getKey() }}"
+
+        {{
+            $attributes->merge($customAttributes)
+                ->class(['block text-sm font-medium leading-5 text-gray-700 dark:text-white' => $isTailwind && $customAttributes['default'] ?? true])
+                ->class(['d-block' => $isBootstrap && $filterLayout == 'slide-down' && $customAttributes['default'] ?? true])
+                ->class(['mb-2' => $isBootstrap && $filterLayout == 'popover' && $customAttributes['default'] ?? true])
+                ->except('default')
+        }}
+
+    >
+        {{ $filter->getName() }}
+    </label>
+
+@endif
+
diff --git a/resources/views/components/tools/filters/date-range.blade.php b/resources/views/components/tools/filters/date-range.blade.php
@@ -25,11 +25,8 @@
 
 
     <div>
-        @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-            @include($filter->getCustomFilterLabel(), ['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-        @elseif(!$filter->hasCustomPosition())
-            <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-        @endif
+        <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
             <div
                 @class([

diff --git a/resources/views/components/tools/filters/date.blade.php b/resources/views/components/tools/filters/date.blade.php
@@ -1,9 +1,6 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(), ['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
     <div @class([
         "rounded-md shadow-sm" => $isTailwind,

diff --git a/resources/views/components/tools/filters/datetime.blade.php b/resources/views/components/tools/filters/datetime.blade.php
@@ -1,9 +1,5 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(), ['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
 
     <div @class([
         "rounded-md shadow-sm" => $isTailwind,

diff --git a/resources/views/components/tools/filters/multi-select-dropdown.blade.php b/resources/views/components/tools/filters/multi-select-dropdown.blade.php
@@ -1,9 +1,6 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName"  />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
     @if ($isTailwind)
         <div class="rounded-md shadow-sm">

diff --git a/resources/views/components/tools/filters/multi-select.blade.php b/resources/views/components/tools/filters/multi-select.blade.php
@@ -1,9 +1,6 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
     @if ($isTailwind)
         <div class="rounded-md">

diff --git a/resources/views/components/tools/filters/number-range.blade.php b/resources/views/components/tools/filters/number-range.blade.php
@@ -4,11 +4,8 @@
     $currentMax = $maxRange = $filter->getConfig('maxRange');
 @endphp
 <div id="{{ $tableName }}-numberRange-{{ $filterKey }}" x-data="numberRangeFilter($wire,'{{ $filterKey }}', '{{ $tableName }}-numberRange-{{ $filterKey }}-wrapper', @js($filter->getConfigs()), '{{ $tableName }}-numberRange-{{ $filterKey }}')" x-on:mousedown.away.throttle.2000ms="updateWireable" x-on:touchstart.away.throttle.2000ms="updateWireable" x-on:mouseleave.throttle.2000ms="updateWireable">
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName  ])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
         <div @class([
             'mt-4 h-22 pt-8 pb-4 grid gap-10' => $isTailwind,

diff --git a/resources/views/components/tools/filters/number.blade.php b/resources/views/components/tools/filters/number.blade.php
@@ -1,9 +1,6 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName"  />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
+
 
     <div @class([
         "rounded-md shadow-sm" => $isTailwind,

diff --git a/resources/views/components/tools/filters/select.blade.php b/resources/views/components/tools/filters/select.blade.php
@@ -1,9 +1,5 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName"  />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
 
     <div @class([
         'rounded-md shadow-sm' => $isTailwind,

diff --git a/resources/views/components/tools/filters/text-field.blade.php b/resources/views/components/tools/filters/text-field.blade.php
@@ -1,9 +1,5 @@
 <div>
-    @if($filter->hasCustomFilterLabel() && !$filter->hasCustomPosition())
-        @include($filter->getCustomFilterLabel(),['filter' => $filter, 'filterLayout' => $filterLayout, 'tableName' => $tableName])
-    @elseif(!$filter->hasCustomPosition())
-        <x-livewire-tables::tools.filter-label :filter="$filter" :filterLayout="$filterLayout" :tableName="$tableName" />
-    @endif
+    <x-livewire-tables::tools.filter-label :$filter :$filterLayout :$tableName :$isTailwind :$isBootstrap4 :$isBootstrap5 :$isBootstrap />
 
     <div @class([
         "rounded-md shadow-sm" => $isTailwind,

diff --git a/src/Views/Filter.php b/src/Views/Filter.php
@@ -35,6 +35,8 @@ abstract class Filter
 
     protected ?string $filterCustomLabel = null;
 
+    protected array $filterLabelAttributes = [];
+
     protected ?int $filterSlidedownRow = null;
 
     protected ?int $filterSlidedownColspan = null;

diff --git a/src/Views/Traits/Configuration/FilterConfiguration.php b/src/Views/Traits/Configuration/FilterConfiguration.php
@@ -118,4 +118,12 @@ public function setFilterDefaultValue($value): self
 
         return $this;
     }
+
+    public function setFilterLabelAttributes(array $filterLabelAttributes): self
+    {
+        $this->filterLabelAttributes = [...['default' => false], ...$filterLabelAttributes];
+
+        return $this;
+
+    }
 }
diff --git a/src/Views/Traits/Helpers/FilterHelpers.php b/src/Views/Traits/Helpers/FilterHelpers.php
@@ -240,4 +240,16 @@ public function hasFilterDefaultValue(): bool
     {
         return ! is_null($this->filterDefaultValue);
     }
+
+
+    public function getFilterLabelAttributes(): array
+    {
+        return [...['default' => true], ...$this->filterLabelAttributes];
+    }
+
+    public function hasFilterLabelAttributes(): bool
+    {
+        return !($this->filterLabelAttributes != ['default' => true] && $this->filterLabelAttributes != ['default' => false]);
+    }
+
 }
diff --git a/tests/Views/Traits/Helpers/FilterHelpersTest.php b/tests/Views/Traits/Helpers/FilterHelpersTest.php
@@ -353,4 +353,26 @@ public function can_get_filter_custom_filter_pills_blade(): void
         $this->assertTrue($filter->hasCustomPillBlade());
         $this->assertSame('foo', $filter->getCustomPillBlade());
     }
+
+    /** @test */
+    public function can_get_filter_label_attributes(): void
+    {
+        $filter1 = TextFilter::make('Filter1');
+        $filter2 = TextFilter::make('Filter2')->setFilterLabelAttributes(
+            ['class' => 'text-xl', 'default' => true]
+        );
+        $filter3 = TextFilter::make('Filter3')->setFilterLabelAttributes(
+            ['class' => 'text-2xl', 'default' => false]
+        );
+
+        $this->assertFalse($filter1->hasFilterLabelAttributes());
+        $this->assertTrue($filter2->hasFilterLabelAttributes());
+        $this->assertTrue($filter3->hasFilterLabelAttributes());
+
+        $this->assertSame($filter1->getFilterLabelAttributes(), ['default' => true]);
+        $this->assertSame($filter2->getFilterLabelAttributes(), ['class' => 'text-xl', 'default' => true]);
+        $this->assertSame($filter3->getFilterLabelAttributes(), ['class' => 'text-2xl', 'default' => false]);
+
+
+    }
 }