import {
FlatList,
Text,
ActivityIndicator,
RefreshControl,
Dimensions,
} from "react-native";
import { useState, useEffect } from "react";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { useNoticesStore } from "@/store/noticesStore";
import { NoticeCard } from "@/components/NoticeCard";
import { useLocalSearchParams, useRouter } from "expo-router";
import { Box } from "@/components/ui/box";
import { Button, ButtonText } from "@/components/ui/button";
import { ChevronDownIcon } from "@/components/ui/icon";
import { listCategories } from "@/api/categories";
import { FormControl, FormControlLabel } from "@/components/ui/form-control";
import { Input, InputField } from "@/components/ui/input";
import { HStack } from "@/components/ui/hstack";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
import { KeyboardAvoidingView, Platform } from "react-native";
import {
Actionsheet,
ActionsheetContent,
ActionsheetItem,
ActionsheetItemText,
ActionsheetDragIndicator,
ActionsheetDragIndicatorWrapper,
ActionsheetBackdrop,
} from "@/components/ui/actionsheet";
import {
Select,
SelectTrigger,
SelectInput,
SelectIcon,
SelectPortal,
SelectBackdrop,
SelectContent,
SelectDragIndicator,
SelectDragIndicatorWrapper,
SelectItem,
SelectScrollView,
} from "@/components/ui/select";
import { attributes } from "@/data/attributesData";
export default function Notices() {
const { notices, fetchNotices } = useNoticesStore();
const [refreshing, setRefreshing] = useState(false);
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState(null);
const [showActionsheet, setShowActionsheet] = useState(false);
const [showSortSheet, setShowSortSheet] = useState(false);
const [categories, setCategories] = useState([]);
const [filteredNotices, setFilteredNotices] = useState([]);
const [selectedAttributes, setSelectedAttributes] = useState({});
const params = useLocalSearchParams();
const router = useRouter();
useEffect(() => {
const fetchSelectItems = async () => {
try {
const data = await listCategories();
if (Array.isArray(data)) {
setCategories(data);
} else {
console.error("listCategories did not return an array:", data);
setError(new Error("Invalid categories data"));
}
} catch (error) {
console.error("Error fetching select items:", error);
setError(error);
}
};
fetchSelectItems();
}, []);
useEffect(() => {
loadData();
}, []);
useEffect(() => {
let result = notices.filter((notice) => notice.status === "ACTIVE");
if (params.category) {
result = result.filter((notice) => notice.category === params.category);
}
if (params.sort) {
if (params.sort == "latest") {
result = [...result].sort(
(a, b) => new Date(b.publishDate) - new Date(a.publishDate)
);
} else if (params.sort == "oldest") {
result = [...result].sort(
(a, b) => new Date(a.publishDate) - new Date(b.publishDate)
);
} else if (params.sort == "cheapest") {
result = [...result].sort((a, b) => {
const priceA = parseFloat(a.price);
const priceB = parseFloat(b.price);
return isNaN(priceA) || isNaN(priceB) ? 0 : priceA - priceB;
});
} else if (params.sort == "expensive") {
result = [...result].sort((a, b) => {
const priceA = parseFloat(a.price);
const priceB = parseFloat(b.price);
return isNaN(priceA) || isNaN(priceB) ? 0 : priceB - priceA;
});
}
}
if (params.priceFrom) {
result = result.filter((notice) => {
const price = parseFloat(notice.price);
const priceFrom = parseFloat(params.priceFrom);
return !isNaN(price) && price >= priceFrom;
});
}
if (params.priceTo) {
result = result.filter((notice) => {
const price = parseFloat(notice.price);
const priceTo = parseFloat(params.priceTo);
return !isNaN(price) && price <= priceTo;
});
}
if (params.search) {
const searchTerm = params.search.toLowerCase();
result = result.filter((notice) => {
return notice.title.toLowerCase().includes(searchTerm);
});
}
Object.keys(params).forEach((key) => {
if (key.startsWith("attribute_")) {
// console.log("Filtering by attribute:", key);
const attributeName = key.replace("attribute_", "");
const attributeValue = params[key];
result = result.filter((notice) =>
notice.attributes?.some(
(attr) =>
attr.name === attributeName && attr.value === attributeValue
)
);
}
});
setFilteredNotices(result);
}, [
notices,
params.category,
params.sort,
params.priceFrom,
params.priceTo,
params.search,
params.attribute_Kolor,
params.attribute_Materiał,
]);
let filterActive =
!!params.category ||
!!params.sort ||
!!params.priceFrom ||
!!params.priceTo ||
!!params.search ||
Object.keys(params).some((key) => key.startsWith("attribute_"));
const loadData = async () => {
setIsLoading(true);
try {
await fetchNotices();
setError(null);
} catch (err) {
setError(err);
} finally {
setIsLoading(false);
}
};
const handleCategorySelect = (value) => {
router.replace({
pathname: "/notices",
params: { ...params, category: value },
});
};
const handlePriceFrom = (value) => {
router.replace({
pathname: "/notices",
params: { ...params, priceFrom: value },
});
};
const handlePriceTo = (value) => {
router.replace({
pathname: "/notices",
params: { ...params, priceTo: value },
});
};
const handleAttributeSelect = (attributeName, value) => {
const newParams = { ...params };
if (value) {
newParams[`attribute_${attributeName}`] = value;
}
// console.log("New Params:", newParams);
router.replace({
pathname: "/notices",
params: newParams,
});
};
const handleClose = () => setShowActionsheet(false);
const handleSort = (value) => {
router.replace({
pathname: "/notices",
params: { ...params, sort: value },
});
setShowSortSheet(false);
};
const onRefresh = async () => {
setRefreshing(true);
try {
await fetchNotices();
} catch (err) {
setError(err);
} finally {
setRefreshing(false);
}
};
if (isLoading && !refreshing) {
return ;
}
if (error) {
return Nie udało się pobrać listy. {error.message};
}
const SCREEN_HEIGHT = Dimensions.get("window").height;
const selectedCategory =
(params.category &&
categories?.find((cat) => cat.value === params.category)) ||
null;
// console.log("Filtered Notices:", filteredNotices);
return (
<>
{filterActive && (
)}
{Object.entries(attributes).map(([label, options]) => (
{/* {label} */}
))}
setShowSortSheet(false)}
>
handleSort()}
>
Trafność
handleSort("latest")}
>
Najnowsze
handleSort("oldest")}
>
Najstarsze
handleSort("cheapest")}
>
Najtańsze
handleSort("expensive")}
>
Najdroższe
}
refreshControl={
}
/>
);
}