Root: ui|v2.5|src|components|List|Filters: HierarchicalLabelValueFilter.tsx

HierarchicalLabelValueFilter.tsx

The HierarchicalLabelValueFilter component is a React functional component responsible for rendering a filter interface for hierarchical label-value criteria. It provides options for selecting items and specifying the depth of hierarchy to include in the filtering.

Purpose:

The purpose of the HierarchicalLabelValueFilter component is to allow users to filter data based on hierarchical label-value criteria, such as studios, tags, scene tags, and performer tags. It enables users to select specific items and adjust the depth of the hierarchy to include in the filtering process.

Props:

1. criterion: A Criterion<IHierarchicalLabelValue> object representing the hierarchical label-value criterion used for filtering.
2. onValueChanged: A callback function invoked when the value of the criterion changes.

Functionality:

• Renders a filter interface with options for selecting items and adjusting the depth of hierarchy to include.
• Utilizes the FilterSelect component from src/components/Shared/Select to render the selection interface for items.
• Provides checkboxes to toggle the inclusion of sub-studios or sub-tags based on the inputType and type properties of the criterionOption.
• Renders a number input field to specify the depth of hierarchy to include, allowing users to customize the filtering based on their requirements.
• Invokes the onValueChanged callback function when the value of the criterion changes, passing the updated value.

Example Usage:

import { HierarchicalLabelValueFilter } from "./HierarchicalLabelValueFilter";

// Inside a React component
<HierarchicalLabelValueFilter
  criterion={hierarchicalCriterion}
  onValueChanged={handleCriterionValueChange}
/>

Explanation:

The HierarchicalLabelValueFilter component enhances user experience by providing a flexible and customizable interface for filtering hierarchical label-value data.