>(
diff --git a/cvat-ui/src/components/annotation-page/top-bar/filters-modal.tsx b/cvat-ui/src/components/annotation-page/top-bar/filters-modal.tsx
index dbc43d525e5d..e1a76101f5c5 100644
--- a/cvat-ui/src/components/annotation-page/top-bar/filters-modal.tsx
+++ b/cvat-ui/src/components/annotation-page/top-bar/filters-modal.tsx
@@ -23,19 +23,15 @@ const { FieldDropdown } = AntdWidgets;
const FILTERS_HISTORY = 'annotationFiltersHistory';
-interface Props {
- visible: boolean;
-}
-
interface StoredFilter {
id: string;
logic: JsonLogicTree;
}
-export default function FiltersModalComponent(props: Props): JSX.Element {
- const { visible } = props;
- const { labels } = useSelector((state: CombinedState) => state.annotation.job);
- const { filters: activeFilters } = useSelector((state: CombinedState) => state.annotation.annotations);
+function FiltersModalComponent(): JSX.Element {
+ const labels = useSelector((state: CombinedState) => state.annotation.job.labels);
+ const activeFilters = useSelector((state: CombinedState) => state.annotation.annotations.filters);
+ const visible = useSelector((state: CombinedState) => state.annotation.filtersPanelVisible);
const getConvertedInputType = (inputType: string): string => {
switch (inputType) {
@@ -234,18 +230,23 @@ export default function FiltersModalComponent(props: Props): JSX.Element {
const menu = (
);
@@ -286,3 +287,5 @@ export default function FiltersModalComponent(props: Props): JSX.Element {
);
}
+
+export default React.memo(FiltersModalComponent);
diff --git a/cvat-ui/src/components/annotation-page/top-bar/right-group.tsx b/cvat-ui/src/components/annotation-page/top-bar/right-group.tsx
index b91e575fd905..c4727e6a43de 100644
--- a/cvat-ui/src/components/annotation-page/top-bar/right-group.tsx
+++ b/cvat-ui/src/components/annotation-page/top-bar/right-group.tsx
@@ -47,8 +47,8 @@ function RightGroup(props: Props): JSX.Element {
isTrainingActive,
showFilters,
} = props;
- predictor.annotationAmount = predictor.annotationAmount ? predictor.annotationAmount : 0;
- predictor.mediaAmount = predictor.mediaAmount ? predictor.mediaAmount : 0;
+ const annotationAmount = predictor.annotationAmount || 0;
+ const mediaAmount = predictor.mediaAmount || 0;
const formattedScore = `${(predictor.projectScore * 100).toFixed(0)}%`;
const predictorTooltip = (
@@ -65,15 +65,15 @@ function RightGroup(props: Props): JSX.Element {
Annotations amount:
- {predictor.annotationAmount}
+ {annotationAmount}
Media amount:
- {predictor.mediaAmount}
+ {mediaAmount}
- {predictor.annotationAmount > 0 ? (
+ {annotationAmount > 0 ? (
Model mAP is
{' '}
@@ -139,7 +139,7 @@ function RightGroup(props: Props): JSX.Element {
- {predictor.annotationAmount ? `mAP ${formattedScore}` : 'not trained'}
+ {annotationAmount ? `mAP ${formattedScore}` : 'not trained'}
)}