seb/reactShop
1
0
Fork 0
Code Issues Pull Requests Activity

Implement availability filters in Content and ProductList components to enhance product filtering functionality. Active filters for "auf Lager", "Neu", and "Bald verfügbar" are now dynamically displayed based on product availability, improving user experience and filtering accuracy.

Browse Source
This commit is contained in:
seb
2025-07-05 13:57:29 +02:00
parent 11f5b2cbfd
commit fb3450aa23
2 changed files with 55 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/ProductList.js
View File

@@ -192,6 +192,34 @@ class ProductList extends Component {
order: { xs: 2, sm: 1 },
px: { xs: 1, sm: 0 }
}}>
{this.props.activeAvailabilityFilters && this.props.activeAvailabilityFilters.map((filter,index) => (
<Chip
size="medium"
key={`availability-${index}`}
label={filter.name}
onClick={() => {
if (filter.id === '1') {
// Add "auf Lager" filter by setting the sessionStorage item to '1'
sessionStorage.setItem('filter_availability', '1');
} else {
// Remove "Neu" or "Bald verfügbar" filters
removeSessionSetting(`filter_availability_${filter.id}`);
}
this.props.onFilterChange();
}}
onDelete={() => {
if (filter.id === '1') {
// Add "auf Lager" filter by setting the sessionStorage item to '1'
sessionStorage.setItem('filter_availability', '1');
} else {
// Remove "Neu" or "Bald verfügbar" filters
removeSessionSetting(`filter_availability_${filter.id}`);
}
this.props.onFilterChange();
}}
clickable
/>
))}
{this.props.activeAttributeFilters.map((filter,index) => (
<Chip
size="medium"
@@ -224,6 +252,7 @@ class ProductList extends Component {
clickable
/>
))}
</Box>
<Box sx={{