main
Last change
on this file was 0c6b92a, checked in by stefan toskovski <stefantoska84@…>, 7 months ago |
Pred finalna verzija
|
-
Property mode
set to
100644
|
File size:
1020 bytes
|
Line | |
---|
1 | import React, { useState, useEffect, useCallback } from "react";
|
---|
2 | import styles from "./FilterBar.module.css";
|
---|
3 |
|
---|
4 | export default function FilterBar({roomTypes,map}) {
|
---|
5 | const [selectedCategory, setSelectedCategory] = useState("all");
|
---|
6 |
|
---|
7 |
|
---|
8 |
|
---|
9 | const filterLocation = useCallback((category) => {
|
---|
10 | map.setFilter(category)
|
---|
11 | setSelectedCategory(category);
|
---|
12 | },[])
|
---|
13 |
|
---|
14 | return (
|
---|
15 | <div className={styles.wrapper}>
|
---|
16 | <div className={styles.scrollableContainer}>
|
---|
17 | <button
|
---|
18 | className={`${styles.buttonValue} ${selectedCategory === "all" ? styles.active : ""}`}
|
---|
19 | onClick={() => filterLocation("all")}
|
---|
20 | >
|
---|
21 | All
|
---|
22 | </button>
|
---|
23 |
|
---|
24 | {roomTypes?.map((roomType, index) => (
|
---|
25 | <button
|
---|
26 | key={index}
|
---|
27 | className={`${styles.buttonValue} ${selectedCategory === roomType.name ? styles.active : ""}`}
|
---|
28 | onClick={() => filterLocation(roomType.name)}
|
---|
29 | >
|
---|
30 | {roomType.name}
|
---|
31 | </button>
|
---|
32 | ))}
|
---|
33 | </div>
|
---|
34 | </div>
|
---|
35 | );
|
---|
36 | }
|
---|
37 |
|
---|
Note:
See
TracBrowser
for help on using the repository browser.