fix date reset

src/components/item/ItemPage.jsx

@@ -68,9 +68,13 @@ export const ItemPage = () => {
         (filterPriceMin === "" || item.price >= parseFloat(filterPriceMin)) &&
         (filterPriceMax === "" || item.price <= parseFloat(filterPriceMax));
       const matchesDate =
+        !filterDateRange ||
         filterDateRange.length === 0 ||
-        (new Date(item.purchaseDate) >= filterDateRange[0] &&
+        (filterDateRange[0] &&
+          filterDateRange[1] &&
+          new Date(item.purchaseDate) >= filterDateRange[0] &&
           new Date(item.purchaseDate) <= filterDateRange[1]);
+
       return matchesRoom && matchesName && matchesPrice && matchesDate;
     });
     setFilteredItems(filtered);
@@ -106,7 +110,55 @@ export const ItemPage = () => {
 
   return (
     <div className="item-container">
-      <div className="filters">{/* Filters here */}</div>
+      <div className="filters">
+        <div className="filter-group">
+          <label htmlFor="roomSelect">Room:</label>
+          <Select
+            id="roomSelect"
+            defaultValue="all"
+            style={{ width: 120 }}
+            onChange={handleRoomChange}
+          >
+            <Option value="all">All</Option>
+            {rooms.map((room) => (
+              <Option key={room._id} value={room._id}>
+                {room.name}
+              </Option>
+            ))}
+          </Select>
+        </div>
+        <div className="filter-group">
+          <label htmlFor="nameInput">Search by name:</label>
+          <Input
+            id="nameInput"
+            placeholder="Search by name"
+            value={filterName}
+            onChange={(e) => setFilterName(e.target.value)}
+          />
+        </div>
+        <div className="filter-group">
+          <label>Price:</label>
+          <InputNumber
+            placeholder="Min price"
+            value={filterPriceMin}
+            onChange={(value) => setFilterPriceMin(value)}
+          />
+          <span> - </span>
+          <InputNumber
+            placeholder="Max price"
+            value={filterPriceMax}
+            onChange={(value) => setFilterPriceMax(value)}
+          />
+        </div>
+        <div className="filter-group">
+          <label>Purchase Date:</label>
+          <RangePicker
+            format="YYYY-MM-DD"
+            onChange={(dates) => setFilterDateRange(dates)}
+            value={filterDateRange}
+          />
+        </div>
+      </div>
 
       {/* Button to open create item modal */}
       <button onClick={() => setIsCreateItemModalOpen(true)}>