diff --git a/cvat-ui/src/components/task-page/styles.scss b/cvat-ui/src/components/task-page/styles.scss index cb205585..dfdf229a 100644 --- a/cvat-ui/src/components/task-page/styles.scss +++ b/cvat-ui/src/components/task-page/styles.scss @@ -93,11 +93,6 @@ background-color: $background-color-2; } -.cvat-user-selector { - margin-left: 10px; - width: 150px; -} - .cvat-open-bug-tracker-button { margin-left: 15px; } diff --git a/cvat-ui/src/components/task-page/user-selector.tsx b/cvat-ui/src/components/task-page/user-selector.tsx index 382fffa0..0cc42db9 100644 --- a/cvat-ui/src/components/task-page/user-selector.tsx +++ b/cvat-ui/src/components/task-page/user-selector.tsx @@ -2,8 +2,9 @@ // // SPDX-License-Identifier: MIT -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useRef } from 'react'; import Autocomplete from 'antd/lib/auto-complete'; +import Input from 'antd/lib/input'; import getCore from 'cvat-core-wrapper'; import { SelectValue } from 'antd/lib/select'; @@ -46,6 +47,7 @@ export default function UserSelector(props: Props): JSX.Element { const [searchPhrase, setSearchPhrase] = useState(''); const [users, setUsers] = useState([]); + const autocompleteRef = useRef(null); const handleSearch = (searchValue: string): void => { if (searchValue) { @@ -95,8 +97,9 @@ export default function UserSelector(props: Props): JSX.Element { return ( + > + autocompleteRef.current?.blur()} /> + ); }