← กลับไปยัง Dev Center

ทดสอบ Property Filters

เปรียบเทียบตัวกรองเดิม (PropertyFilters) และตัวกรองใหม่ (PropertyFiltersAccordion)

สถานะตัวกรองปัจจุบัน

มีการใช้งานตัวกรอง 0 รายการ

PropertyFilters (Legacy)

ตัวกรองแบบเดิมที่ใช้งานอยู่ปัจจุบัน

ตัวกรองข้อมูล

PropertyFiltersAccordion (New)

ตัวกรองแบบใหม่ที่มี UI แบบ Accordion และฟีเจอร์ที่ครบถ้วนกว่า

ตัวกรองข้อมูล

URL Navigation Strategy

Hash Fragments สำหรับ View Mode:

  • ใช้ hash fragments (#grid, #split, #maps) สำหรับ view mode
  • ไม่เกิด page reload เมื่อเปลี่ยน view mode
  • รูปแบบ: /properties#grid, /properties#split, /properties#maps

Query Parameters สำหรับ Filters และ Pagination:

  • Filters: search, zoneCode, statusCode, page, pageSize, etc.
  • Shareable URLs: สามารถ copy/paste URL เพื่อแชร์ state
  • History Management: ใช้ replaceState เพื่อไม่ pollute history

Debouncing Strategy:

  • Filter changes: 300ms debounce
  • Pagination changes: 500ms debounce
  • View mode: ไม่ต้อง debounce (hash change)

หมายเหตุ

  • ตัวกรองทั้งสองใช้ state เดียวกันเพื่อให้เห็นผลการเปลี่ยนแปลงได้ชัดเจน
  • PropertyFiltersAccordion เป็น component ใหม่ที่แนะนำให้ใช้งานแทน PropertyFilters
  • PropertyFiltersAccordion รองรับตัวกรองขั้นสูงมากกว่าและมี UI ที่ดีกว่า
  • Next Steps: Implementation จะทำตาม Option 1 (Custom Hooks + Utilities) ตามเอกสาร property-search-url-navigation.md
  • ดูเอกสารเพิ่มเติมที่: documents/requirements/ui/components/PropertyFiltersAccordion.md