filters

components/Cards.tsx

@@ -41,6 +41,10 @@ export const Card = ({onPress} :Props) => {
                 <Text className={'text-sm ml-1'}>5.0</Text>
             </View>
             <Image  source={images.car2} className={'w-full h-40 rounded-lg'}/>
+            <View className={'flex flex-col mt-2'}>
+                <Text className={'text-base text-gray-600'}>xyz</Text>
+                <Text className={'text-sm'}>Skopje</Text>
+            </View>
         </TouchableOpacity>
     )
 }

components/Filters.tsx

@@ -0,0 +1,35 @@
+import {View, Text, ScrollView, TouchableOpacity} from 'react-native'
+import React, {useState} from 'react'
+import {router, useLocalSearchParams} from "expo-router";
+import {categories} from "@/constants/data";
+
+const Filters = () => {
+    const params  = useLocalSearchParams<{filter?: string}>();
+    const [selectedCategory, setSelectedCategory] = useState(params.filter || 'All');
+
+    const handleCategoryChange = (category: string) => {
+        // setSelectedCategory(category);
+        // router.setParams({ filter: category });
+        if(selectedCategory === category) {
+            setSelectedCategory('All');
+            router.setParams({ filter: "All" });
+            return;
+        }
+        setSelectedCategory(category);
+        router.setParams({ filter: category });
+        console.log(category)
+    }
+    return (
+        <ScrollView horizontal={true} showsHorizontalScrollIndicator={false} className={'mt-3 mb-2'}>
+            {categories.map((item, index) => {
+                return (
+                    <TouchableOpacity onPress={() => handleCategoryChange(item.category)} className={`flex flex-col items-start mr-4 px-4 py-2 rounded-full ${selectedCategory === item.category ? 'bg-blue-300' : 'border border-blue-200'}`}>
+                        <Text>{item.title}</Text>
+                        {/*mozam da gi napravam ikonki ili slikicki*/}
+                    </TouchableOpacity>
+                )
+            })}
+        </ScrollView>
+    )
+}
+export default Filters