From 59c76c8414f4311817dd595fbbc6db59fda2da6a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Krzysztof=20P=C5=82aczek?=
 <krzysztof.placzek@eobuwie.com.pl>
Date: Mon, 4 Aug 2025 12:17:18 +0200
Subject: [PATCH] Year input in simple search

---
 index.html  | 15 +++++++++++++--
 src/main.js |  8 ++++----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 0dc2b80..f18c109 100644
--- a/index.html
+++ b/index.html
@@ -17,17 +17,28 @@
         <form class="flex items-center m-2" x-show="!advancedSearch">
             <div class="relative w-full d-block max-w-md ">
                 <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-                    <svg class="w-4 h-4 text-gray-500" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 21 21">
+                    <svg class="w-4 h-4 text-gray-500" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 21">
                         <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/>
                     </svg>
                 </div>
                 <input type="text" class="peer bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:outline focus:outline-sky-500 block w-full ps-10 p-2.5 pr-8 dark:bg-stone-900 dark:border-stone-700 dark:text-gray-100" x-model="nameFilter" placeholder="wyszukiwarka"/>
                 <button x-show="nameFilter.length" @click="nameFilter=''" type="button" class="absolute inset-y-0 end-0 flex items-center pe-3 invisible peer-valid:visible">
-                    <svg class="w-4 h-4 text-gray-500 " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                    <svg class="w-4 h-4 text-gray-500 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
                     </svg>
                 </button>
             </div>
+            <div class="d-block max-w-xs mr-2">
+                <label for="basic-year-2025" class="p-2.5 inline-block" >
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="basic-year-2025" value="2025" /> 2025
+                </label>
+                <label for="year-2024" class="p-2.5 inline-block" >
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="basic-year-2024" value="2024" /> 2024
+                </label>
+                <label for="year-2023" class="p-2.5 inline-block" >
+                    <input @input.debounce="updateFilter" x-model="year" type="checkbox" id="basic-year-2023" value="2023" /> 2023
+                </label>
+            </div>
             <div class="relative inline-block m-4 text-blue-400 inline cursor-pointer">
                 <div @click="advancedSearch = true">zaawansowane filtrowanie</div>
             </div>
diff --git a/src/main.js b/src/main.js
index 6a0b38e..5a9054d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -21,10 +21,10 @@ Alpine.data('bookmeterList', function () {
         advancedSearch: this.$persist(0).as('advanced-search'),
         async init() {
             this.$watch('nameFilter', () => this.updateFilter());
-            // this.$watch('username', () => this.updateFilter());
-            // this.$watch('title', () => this.updateFilter());
-            // this.$watch('author', () => this.updateFilter());
-            // this.$watch('publisher', () => this.updateFilter());
+            this.$watch('username', () => this.updateFilter());
+            this.$watch('title', () => this.updateFilter());
+            this.$watch('author', () => this.updateFilter());
+            this.$watch('publisher', () => this.updateFilter());
             this.$watch('year', () => this.updateFilter());
 
             let qp = new URLSearchParams(window.location.search);