TCB Filters Component

The CmsFiltersComponent is providing dynamic and responsive filtering functionality for Angular applications. It integrates with the CmsService and utilizes a GenericFiltersComponent to dynamically apply and reset filters for querying data.

How to use the component in your app :

1. import the component :

import {CmsFiltersComponent} from '@tradinos/cms-frontend-entity';

1. The selector for component , like it :

<lib-cms-filters></lib-cms-filters>

Features

1. Dynamic Filtering:

   • Leverages the GenericFiltersComponent to dynamically apply filters based on user input.

2. Responsive Design:

   • Automatically adjusts to device screen size (e.g., tablet view) using Angular's BreakpointObserver.

3. Filter Management:

   • Supports both applying filters and resetting filters, with seamless integration into the CmsService pipeline.

4. Observable Integration:

   • Listens to applyFilters$ and resetFilters$ observables from the CmsService for filter events.

Inputs

This component does not declare explicit inputs via @Input(). Instead, it dynamically interacts with the CmsService and GenericFiltersComponent. However, the following dependencies are essential for its functionality:

1. cmsService(required):The service that manages query parameters, filter application, and reset logic.

2. GenericFiltersComponent(required):The dynamic component responsible for rendering and managing filter fields and user interactions.

Methods

1. ngOnInit(): void

• Description:

  • Lifecycle hook that initializes the component.

  • Subscribes to screen size changes to determine if the device is a tablet.

• Behavior:

  • Sets isTablet to true if the screen width is below 1200px.

2. applyFilters(): void

• Description:

  • Retrieves the current filter values from the GenericFiltersComponent and pushes them to the queryParams$ observable in CmsService.

• Use Case:

  • Triggered when the user applies filters to update the data query.

3. resetFilters(value: boolean): void

• Description:

  • Resets the filters in the GenericFiltersComponent and optionally clears the query parameters in the CmsService.

• Parameters:

  • value: If true, clears all query parameters.