Root: ui|v2.5|src|components|Performers|PerformerDetails: PerformerImagesPanel.tsx

PerformerImagesPanel.tsx

This file defines a React functional component called PerformerImagesPanel, which is responsible for displaying images related to a performer.

Component Props:

• active: Boolean indicating whether the panel is active.
• performer: Data of the performer for whom images are displayed.

Component Structure and Functionality:

1. Imports:

   • The file imports necessary modules and components from React and custom utilities.

2. Props:

   • active: Indicates whether the panel is active or not.
   • performer: Contains data of the performer for whom images are displayed.

3. Filter Hook:

   • usePerformerFilterHook is called with the performer data to get a filter hook for images related to the performer.

4. Image Display:

   • The component renders an ImageList component.
   • It passes the filterHook obtained from the performer to filter the images.
   • The alterQuery prop is set based on the active prop to control whether the query for images should be altered.

Example Usage:

To use the PerformerImagesPanel component:

<PerformerImagesPanel active={true} performer={performerData} />

###Explanation: In this example, performerData is the data of the performer for whom images are to be displayed, and active is set to true to make the panel active.