Fixed: cannot close some issues (#2868)

* Squashed commits

* Merged develop

* Aborted chanegs

* Added ability to scroll issues

* Aborted change

* Updated version

CHANGELOG.md

@@ -59,6 +59,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Updated the path to python for DL models inside automatic annotation documentation (<https://github.com/openvinotoolkit/cvat/pull/2847>)
 - Fixed of receiving function variable (<https://github.com/openvinotoolkit/cvat/pull/2860>)
 - Shortcuts with CAPSLOCK enabled and with non-US languages activated (<https://github.com/openvinotoolkit/cvat/pull/2872>)
+- Prevented creating several issues for the same object (<https://github.com/openvinotoolkit/cvat/pull/2868>)
 - Fixed label editor name field validator (<https://github.com/openvinotoolkit/cvat/pull/2879>)
 - An error about track shapes outside of the task frames during export (<https://github.com/openvinotoolkit/cvat/pull/2890>)
 

cvat-ui/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "cvat-ui",
-  "version": "1.15.1",
+  "version": "1.15.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

cvat-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cvat-ui",
-  "version": "1.15.1",
+  "version": "1.15.2",
   "description": "CVAT single-page application",
   "main": "src/index.tsx",
   "scripts": {

cvat-ui/src/components/annotation-page/review/hidden-issue-label.tsx

@@ -2,7 +2,7 @@
 //
 // SPDX-License-Identifier: MIT
 
-import React, { ReactPortal, useEffect } from 'react';
+import React, { ReactPortal, useEffect, useRef } from 'react';
 import ReactDOM from 'react-dom';
 import Tag from 'antd/lib/tag';
 import { CheckOutlined, CloseCircleOutlined } from '@ant-design/icons';
@@ -25,6 +25,8 @@ export default function HiddenIssueLabel(props: Props): ReactPortal {
         id, message, top, left, resolved, onClick, highlight, blur,
     } = props;
 
+    const ref = useRef<HTMLElement>(null);
+
     useEffect(() => {
         if (!resolved) {
             setTimeout(highlight);
@@ -37,10 +39,21 @@ export default function HiddenIssueLabel(props: Props): ReactPortal {
     return ReactDOM.createPortal(
         <CVATTooltip title={message}>
             <Tag
+                ref={ref}
                 id={elementID}
                 onClick={onClick}
                 onMouseEnter={highlight}
                 onMouseLeave={blur}
+                onWheel={(event: React.WheelEvent) => {
+                    if (ref.current !== null) {
+                        const selfElement = ref.current;
+                        if (event.deltaX > 0) {
+                            selfElement.parentElement?.appendChild(selfElement);
+                        } else {
+                            selfElement.parentElement?.prepend(selfElement);
+                        }
+                    }
+                }}
                 style={{ top, left }}
                 className='cvat-hidden-issue-label'
             >