diff --git a/CHANGELOG.md b/CHANGELOG.md index ad5bde7512516e72ca8bbd615454bfbf32c33cee..836a26f923f9aa8e5784ca1f7557b56b8ddbc49c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -32,6 +32,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Incorrect attribute import in tracks () - Issue "is not a constructor" when create object, save, undo, save, redo save () - Fix CLI create an infinite loop if git repository responds with failure () +- Bug with sidebar & fullscreen () ### Security diff --git a/cvat-ui/package-lock.json b/cvat-ui/package-lock.json index 5d50c5410e53074014165fcd9276173dccd82f34..e7741951972c6500c0d695a01cce32c4c06d765c 100644 --- a/cvat-ui/package-lock.json +++ b/cvat-ui/package-lock.json @@ -1,6 +1,6 @@ { "name": "cvat-ui", - "version": "1.20.2", + "version": "1.20.3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/cvat-ui/package.json b/cvat-ui/package.json index 4e2c15b192071dfc2c047580f91bdb2da3987055..578538b8b8a0f8f5c565415f1faab73d16488c5e 100644 --- a/cvat-ui/package.json +++ b/cvat-ui/package.json @@ -1,6 +1,6 @@ { "name": "cvat-ui", - "version": "1.20.2", + "version": "1.20.3", "description": "CVAT single-page application", "main": "src/index.tsx", "scripts": { diff --git a/cvat-ui/src/actions/annotation-actions.ts b/cvat-ui/src/actions/annotation-actions.ts index 4e346c13e5aac336fd6ab4218e8782a2bec4e05d..1e03fee8c0b8822b95f5824cd67bc6a0093e3cbc 100644 --- a/cvat-ui/src/actions/annotation-actions.ts +++ b/cvat-ui/src/actions/annotation-actions.ts @@ -146,7 +146,6 @@ export enum AnnotationActionTypes { GROUP_ANNOTATIONS_FAILED = 'GROUP_ANNOTATIONS_FAILED', SPLIT_ANNOTATIONS_SUCCESS = 'SPLIT_ANNOTATIONS_SUCCESS', SPLIT_ANNOTATIONS_FAILED = 'SPLIT_ANNOTATIONS_FAILED', - UPDATE_TAB_CONTENT_HEIGHT = 'UPDATE_TAB_CONTENT_HEIGHT', COLLAPSE_SIDEBAR = 'COLLAPSE_SIDEBAR', COLLAPSE_APPEARANCE = 'COLLAPSE_APPEARANCE', COLLAPSE_OBJECT_ITEMS = 'COLLAPSE_OBJECT_ITEMS', @@ -576,15 +575,6 @@ export function activateObject(activatedStateID: number | null, activatedAttribu }; } -export function updateTabContentHeight(tabContentHeight: number): AnyAction { - return { - type: AnnotationActionTypes.UPDATE_TAB_CONTENT_HEIGHT, - payload: { - tabContentHeight, - }, - }; -} - export function collapseSidebar(): AnyAction { return { type: AnnotationActionTypes.COLLAPSE_SIDEBAR, diff --git a/cvat-ui/src/components/annotation-page/appearance-block.tsx b/cvat-ui/src/components/annotation-page/appearance-block.tsx index a2adabab298bdf40df2846c5ec6936c6101a6793..e3edd85d9c30a93e7105b3ffd432ff44d09d1a5a 100644 --- a/cvat-ui/src/components/annotation-page/appearance-block.tsx +++ b/cvat-ui/src/components/annotation-page/appearance-block.tsx @@ -15,10 +15,7 @@ import Button from 'antd/lib/button'; import ColorPicker from 'components/annotation-page/standard-workspace/objects-side-bar/color-picker'; import { ColorizeIcon } from 'icons'; import { ColorBy, CombinedState, DimensionType } from 'reducers/interfaces'; -import { - collapseAppearance as collapseAppearanceAction, - updateTabContentHeight as updateTabContentHeightAction, -} from 'actions/annotation-actions'; +import { collapseAppearance as collapseAppearanceAction } from 'actions/annotation-actions'; import { changeShapesColorBy as changeShapesColorByAction, changeShapesOpacity as changeShapesOpacityAction, @@ -50,21 +47,6 @@ interface DispatchToProps { changeShowProjections(event: CheckboxChangeEvent): void; } -export function computeHeight(): number { - const [sidebar] = window.document.getElementsByClassName('cvat-objects-sidebar'); - const [appearance] = window.document.getElementsByClassName('cvat-objects-appearance-collapse'); - const [tabs] = Array.from(window.document.querySelectorAll('.cvat-objects-sidebar-tabs > .ant-tabs-nav')); - - if (sidebar && appearance && tabs) { - const maxHeight = sidebar ? sidebar.clientHeight : 0; - const appearanceHeight = appearance ? appearance.clientHeight : 0; - const tabsHeight = tabs ? tabs.clientHeight : 0; - return maxHeight - appearanceHeight - tabsHeight; - } - - return 0; -} - function mapStateToProps(state: CombinedState): StateToProps { const { annotation: { @@ -95,19 +77,6 @@ function mapDispatchToProps(dispatch: Dispatch): DispatchToProps { return { collapseAppearance(): void { dispatch(collapseAppearanceAction()); - const [collapser] = window.document.getElementsByClassName('cvat-objects-appearance-collapse'); - - if (collapser) { - const listener = (event: Event): void => { - if ((event as TransitionEvent).propertyName === 'height') { - const height = computeHeight(); - dispatch(updateTabContentHeightAction(height)); - collapser.removeEventListener('transitionend', listener); - } - }; - - collapser.addEventListener('transitionend', listener); - } }, changeShapesColorBy(event: RadioChangeEvent): void { dispatch(changeShapesColorByAction(event.target.value)); diff --git a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-annotation-sidebar.tsx b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-annotation-sidebar.tsx index 155eeeebbf6ab37e95c64b6a0d75069383ec9667..4b70c1a1f1508923ef329ac9c277f3e3590802b6 100644 --- a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-annotation-sidebar.tsx +++ b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-annotation-sidebar.tsx @@ -10,6 +10,7 @@ import Layout, { SiderProps } from 'antd/lib/layout'; import Text from 'antd/lib/typography/Text'; import { Canvas } from 'cvat-canvas-wrapper'; +import { Canvas3d } from 'cvat-canvas3d-wrapper'; import { LogType } from 'cvat-logger'; import { activateObject as activateObjectAction, @@ -20,6 +21,7 @@ import GlobalHotKeys, { KeyMap } from 'utils/mousetrap-react'; import { ThunkDispatch } from 'utils/redux'; import AppearanceBlock from 'components/annotation-page/appearance-block'; import ObjectButtonsContainer from 'containers/annotation-page/standard-workspace/objects-side-bar/object-buttons'; +import { adjustContextImagePosition } from 'components/annotation-page/standard-workspace/context-image/context-image'; import { CombinedState, ObjectType } from 'reducers/interfaces'; import AttributeEditor from './attribute-editor'; import AttributeSwitcher from './attribute-switcher'; @@ -34,7 +36,7 @@ interface StateToProps { jobInstance: any; keyMap: KeyMap; normalizedKeyMap: Record; - canvasInstance: Canvas; + canvasInstance: Canvas | Canvas3d; canvasIsReady: boolean; curZLayer: number; } @@ -134,6 +136,7 @@ function AttributeAnnotationSidebar(props: StateToProps & DispatchToProps): JSX. (collapser as HTMLElement).addEventListener('transitionend', listener as any); } + adjustContextImagePosition(!sidebarCollapsed); setSidebarCollapsed(!sidebarCollapsed); }; diff --git a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx index 82bc9407a5dc5058681da95f9b5c0dd8889f7a3b..aba08979230f570f90670c31fad52d17c3dfb33a 100644 --- a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx +++ b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/attribute-annotation-sidebar/attribute-editor.tsx @@ -255,7 +255,7 @@ function AttributeEditor(props: Props): JSX.Element { const { inputType, values, id: attrID } = attribute; return ( -
+
{renderList({ values, inputType, onChange })}
{renderInputElement({ diff --git a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss index 99ce043d00799c3ad4ecc2b4cce41503bafcdedc..e9daa708d76955b2ccf0cb47d225e40a19c6eead 100644 --- a/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss +++ b/cvat-ui/src/components/annotation-page/attribute-annotation-workspace/styles.scss @@ -8,9 +8,14 @@ height: 100%; } -.attribute-annotation-sidebar { +.attribute-annotation-sidebar:not(.ant-layout-sider-collapsed) { background: $background-color-2; padding: 5px; + + > .ant-layout-sider-children { + display: flex; + flex-direction: column; + } } .cvat-attribute-annotation-sidebar-object-switcher, @@ -43,6 +48,11 @@ .attribute-annotations-sidebar-not-found-wrapper { margin-top: 20px; text-align: center; + flex-grow: 10; +} + +.attribute-annotations-sidebar-attribute-editor { + flex-grow: 10; } .attribute-annotation-sidebar-attr-list-wrapper { diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/context-image/context-image.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/context-image/context-image.tsx index f2dbfccd5064870e9d554ed58a0b0a9519a3c65d..803674af50e7a50ba2d6976ecc646263c8d2ed6e 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/context-image/context-image.tsx +++ b/cvat-ui/src/components/annotation-page/standard-workspace/context-image/context-image.tsx @@ -13,6 +13,19 @@ import { CombinedState } from 'reducers/interfaces'; import { hideShowContextImage, getContextImage } from 'actions/annotation-actions'; import CVATTooltip from 'components/common/cvat-tooltip'; +export function adjustContextImagePosition(sidebarCollapsed: boolean): void { + const element = window.document.getElementsByClassName('cvat-context-image-wrapper')[0] as + | HTMLDivElement + | undefined; + if (element) { + if (sidebarCollapsed) { + element.style.right = '40px'; + } else { + element.style.right = ''; + } + } +} + export default function ContextImage(): JSX.Element | null { const dispatch = useDispatch(); const { number: frame, hasRelatedContext } = useSelector((state: CombinedState) => state.annotation.player.frame); diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/issues-list.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/issues-list.tsx index ffd78023c50092807cdcfb5b03c9a4ac81dd14eb..1504cd6302982e120052cd707da3123bb13ea230 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/issues-list.tsx +++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/issues-list.tsx @@ -17,7 +17,6 @@ import { CombinedState } from 'reducers/interfaces'; export default function LabelsListComponent(): JSX.Element { const dispatch = useDispatch(); - const tabContentHeight = useSelector((state: CombinedState) => state.annotation.tabContentHeight); const frame = useSelector((state: CombinedState): number => state.annotation.player.frame.number); const frameIssues = useSelector((state: CombinedState): any[] => state.review.frameIssues); const issues = useSelector((state: CombinedState): any[] => state.review.issues); @@ -50,7 +49,7 @@ export default function LabelsListComponent(): JSX.Element { }; return ( -
+ <>
@@ -122,6 +121,6 @@ export default function LabelsListComponent(): JSX.Element { ), )}
-
+ ); } diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/labels-list.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/labels-list.tsx index 99ee07ea267f8db35bc90c0673317e42c05305ff..f6d3a132fbe3fd573c2ffdbca4c52e5d14761ba6 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/labels-list.tsx +++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/labels-list.tsx @@ -14,7 +14,6 @@ import GlobalHotKeys from 'utils/mousetrap-react'; function LabelsListComponent(): JSX.Element { const dispatch = useDispatch(); const labels = useSelector((state: CombinedState) => state.annotation.job.labels); - const listHeight = useSelector((state: CombinedState) => state.annotation.tabContentHeight); const activatedStateID = useSelector((state: CombinedState) => state.annotation.annotations.activatedStateID); const states = useSelector((state: CombinedState) => state.annotation.annotations.states); const keyMap = useSelector((state: CombinedState) => state.shortcuts.keyMap); @@ -87,7 +86,7 @@ function LabelsListComponent(): JSX.Element { }; return ( -
+
{labelIDs.map( (labelID: number): JSX.Element => ( diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx index abacb02e93872485a3330f83e11b4b4cc7162d75..2036673e4731a23edae90545756fe120d7d666cd 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx +++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx @@ -1,4 +1,4 @@ -// Copyright (C) 2020 Intel Corporation +// Copyright (C) 2020-2021 Intel Corporation // // SPDX-License-Identifier: MIT @@ -10,7 +10,6 @@ import ObjectListHeader from './objects-list-header'; interface Props { readonly: boolean; - listHeight: number; statesHidden: boolean; statesLocked: boolean; statesCollapsedAll: boolean; @@ -31,7 +30,6 @@ interface Props { function ObjectListComponent(props: Props): JSX.Element { const { readonly, - listHeight, statesHidden, statesLocked, statesCollapsedAll, @@ -50,7 +48,7 @@ function ObjectListComponent(props: Props): JSX.Element { } = props; return ( -
+ <> -
+ ); } diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-side-bar.tsx b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-side-bar.tsx index 6d15c3ce8bf744847802875b71605e458a0de6c8..d28d294d09ad8d27340843708e246a2dae454a33 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-side-bar.tsx +++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/objects-side-bar.tsx @@ -3,7 +3,7 @@ // SPDX-License-Identifier: MIT import './styles.scss'; -import React, { Dispatch, useEffect, TransitionEvent } from 'react'; +import React, { Dispatch, TransitionEvent } from 'react'; import { AnyAction } from 'redux'; import { connect } from 'react-redux'; import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons'; @@ -12,13 +12,12 @@ import Tabs from 'antd/lib/tabs'; import Layout from 'antd/lib/layout'; import { Canvas } from 'cvat-canvas-wrapper'; +import { Canvas3d } from 'cvat-canvas3d-wrapper'; import { CombinedState } from 'reducers/interfaces'; import LabelsList from 'components/annotation-page/standard-workspace/objects-side-bar/labels-list'; -import { - collapseSidebar as collapseSidebarAction, - updateTabContentHeight as updateTabContentHeightAction, -} from 'actions/annotation-actions'; -import AppearanceBlock, { computeHeight } from 'components/annotation-page/appearance-block'; +import { adjustContextImagePosition } from 'components/annotation-page/standard-workspace/context-image/context-image'; +import { collapseSidebar as collapseSidebarAction } from 'actions/annotation-actions'; +import AppearanceBlock from 'components/annotation-page/appearance-block'; import IssuesListComponent from 'components/annotation-page/standard-workspace/objects-side-bar/issues-list'; interface OwnProps { @@ -27,12 +26,11 @@ interface OwnProps { interface StateToProps { sidebarCollapsed: boolean; - canvasInstance: Canvas; + canvasInstance: Canvas | Canvas3d; } interface DispatchToProps { collapseSidebar(): void; - updateTabContentHeight(): void; } function mapStateToProps(state: CombinedState): StateToProps { @@ -54,33 +52,14 @@ function mapDispatchToProps(dispatch: Dispatch): DispatchToProps { collapseSidebar(): void { dispatch(collapseSidebarAction()); }, - updateTabContentHeight(): void { - const height = computeHeight(); - dispatch(updateTabContentHeightAction(height)); - }, }; } function ObjectsSideBar(props: StateToProps & DispatchToProps & OwnProps): JSX.Element { const { - sidebarCollapsed, canvasInstance, collapseSidebar, updateTabContentHeight, objectsList, + sidebarCollapsed, canvasInstance, collapseSidebar, objectsList, } = props; - useEffect(() => { - const alignTabHeight = (): void => { - if (!sidebarCollapsed) { - updateTabContentHeight(); - } - }; - - window.addEventListener('resize', alignTabHeight); - alignTabHeight(); - - return () => { - window.removeEventListener('resize', alignTabHeight); - }; - }, []); - const collapse = (): void => { const [collapser] = window.document.getElementsByClassName('cvat-objects-sidebar'); const listener = (event: TransitionEvent): void => { @@ -95,6 +74,7 @@ function ObjectsSideBar(props: StateToProps & DispatchToProps & OwnProps): JSX.E (collapser as HTMLElement).addEventListener('transitionend', listener as any); } + adjustContextImagePosition(!sidebarCollapsed); collapseSidebar(); }; diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/styles.scss b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/styles.scss index 32baf4ab145410c67246d5f249afe5338c0c860a..667278fd02ad49b92b56150b68ab0956c21c8abd 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/styles.scss +++ b/cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/styles.scss @@ -6,8 +6,6 @@ .cvat-objects-appearance-collapse.ant-collapse { width: 100%; - bottom: 0; - position: absolute; border-radius: 0; > .ant-collapse-item { diff --git a/cvat-ui/src/components/annotation-page/standard-workspace/styles.scss b/cvat-ui/src/components/annotation-page/standard-workspace/styles.scss index 86e819ffa4f34ab7d0a78725af9abb971a166776..ccc6962f836bd70c0556ac08856c91bea75d5d96 100644 --- a/cvat-ui/src/components/annotation-page/standard-workspace/styles.scss +++ b/cvat-ui/src/components/annotation-page/standard-workspace/styles.scss @@ -73,6 +73,23 @@ overflow-y: auto; overflow-x: hidden; + > .ant-layout-sider-children { + display: flex; + flex-direction: column; + + > .cvat-objects-sidebar-tabs { + flex-grow: 10; + + > div { + display: flex; + + div[role='tabpanel'] { + height: 100%; + } + } + } + } + &.ant-layout-sider-collapsed { overflow: initial; } diff --git a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss index ce04f7048cae5ddac6087598f660fc4ddc223d74..a7c1855013a4363b993d62b69947cdcbe2b5060c 100644 --- a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss +++ b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss @@ -8,7 +8,7 @@ height: 100%; } -.cvat-tag-annotation-sidebar { +.cvat-tag-annotation-sidebar:not(.ant-layout-sider-collapsed) { background: $background-color-2; padding: 5px; diff --git a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx index 2292c48ee42dc0573f6b3e8fe2e644b25db8415b..c55e49f16ecdedfbccb817a7305b355818e46778 100644 --- a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx +++ b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx @@ -21,7 +21,9 @@ import { rememberObject, } from 'actions/annotation-actions'; import { Canvas } from 'cvat-canvas-wrapper'; +import { Canvas3d } from 'cvat-canvas3d-wrapper'; import { CombinedState, ObjectType } from 'reducers/interfaces'; +import { adjustContextImagePosition } from 'components/annotation-page/standard-workspace/context-image/context-image'; import LabelSelector from 'components/label-selector/label-selector'; import getCore from 'cvat-core-wrapper'; import GlobalHotKeys, { KeyMap } from 'utils/mousetrap-react'; @@ -33,7 +35,7 @@ interface StateToProps { states: any[]; labels: any[]; jobInstance: any; - canvasInstance: Canvas; + canvasInstance: Canvas | Canvas3d; frameNumber: number; keyMap: KeyMap; normalizedKeyMap: Record; @@ -203,7 +205,10 @@ function TagAnnotationSidebar(props: StateToProps & DispatchToProps): JSX.Elemen className={`cvat-objects-sidebar-sider ant-layout-sider-zero-width-trigger ant-layout-sider-zero-width-trigger-left`} - onClick={() => setSidebarCollapsed(!sidebarCollapsed)} + onClick={() => { + adjustContextImagePosition(!sidebarCollapsed); + setSidebarCollapsed(!sidebarCollapsed); + }} > {sidebarCollapsed ? : } @@ -222,7 +227,10 @@ function TagAnnotationSidebar(props: StateToProps & DispatchToProps): JSX.Elemen className={`cvat-objects-sidebar-sider ant-layout-sider-zero-width-trigger ant-layout-sider-zero-width-trigger-left`} - onClick={() => setSidebarCollapsed(!sidebarCollapsed)} + onClick={() => { + adjustContextImagePosition(!sidebarCollapsed); + setSidebarCollapsed(!sidebarCollapsed); + }} > {sidebarCollapsed ? : } diff --git a/cvat-ui/src/containers/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx b/cvat-ui/src/containers/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx index cb1881323d50adef2248a6a3a17b4bee40c18a3d..b0d8acb78710179b679cb915ceeef03ff0493b45 100644 --- a/cvat-ui/src/containers/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx +++ b/cvat-ui/src/containers/annotation-page/standard-workspace/objects-side-bar/objects-list.tsx @@ -17,6 +17,7 @@ import { propagateObject as propagateObjectAction, } from 'actions/annotation-actions'; import { Canvas } from 'cvat-canvas-wrapper'; +import { Canvas3d } from 'cvat-canvas3d-wrapper'; import { CombinedState, StatesOrdering, ObjectType, ColorBy, } from 'reducers/interfaces'; @@ -28,7 +29,6 @@ interface OwnProps { interface StateToProps { jobInstance: any; frameNumber: any; - listHeight: number; statesHidden: boolean; statesLocked: boolean; statesCollapsedAll: boolean; @@ -42,7 +42,7 @@ interface StateToProps { maxZLayer: number; keyMap: KeyMap; normalizedKeyMap: Record; - canvasInstance: Canvas; + canvasInstance: Canvas | Canvas3d; } interface DispatchToProps { @@ -71,7 +71,6 @@ function mapStateToProps(state: CombinedState): StateToProps { frame: { number: frameNumber }, }, canvas: { instance: canvasInstance }, - tabContentHeight: listHeight, colors, }, settings: { @@ -94,7 +93,6 @@ function mapStateToProps(state: CombinedState): StateToProps { }); return { - listHeight, statesHidden, statesLocked, statesCollapsedAll: collapsedAll, @@ -263,7 +261,6 @@ class ObjectsListContainer extends React.PureComponent { colors, colorBy, readonly, - listHeight, statesCollapsedAll, updateAnnotations, changeGroupColor, @@ -441,7 +438,6 @@ class ObjectsListContainer extends React.PureComponent { <> { appearanceCollapsed: !state.appearanceCollapsed, }; } - case AnnotationActionTypes.UPDATE_TAB_CONTENT_HEIGHT: { - const { tabContentHeight } = action.payload; - return { - ...state, - tabContentHeight, - }; - } case AnnotationActionTypes.COLLAPSE_OBJECT_ITEMS: { const { states, collapsed } = action.payload; diff --git a/cvat-ui/src/reducers/interfaces.ts b/cvat-ui/src/reducers/interfaces.ts index fc8a40340d903fab54129251e67117bccd8a9084..9faf068b46d6ce179ccad61e77493a6425fdf47d 100644 --- a/cvat-ui/src/reducers/interfaces.ts +++ b/cvat-ui/src/reducers/interfaces.ts @@ -489,7 +489,6 @@ export interface AnnotationState { submitReviewDialogVisible: boolean; sidebarCollapsed: boolean; appearanceCollapsed: boolean; - tabContentHeight: number; workspace: Workspace; predictor: PredictorState; aiToolsRef: MutableRefObject; diff --git a/cvat-ui/src/reducers/shortcuts-reducer.ts b/cvat-ui/src/reducers/shortcuts-reducer.ts index 1ae0e10ac92a9b903db9bd5e13e523bae4df5c57..5460080bf09a94350ffb2c7515265efe4f2fd509 100644 --- a/cvat-ui/src/reducers/shortcuts-reducer.ts +++ b/cvat-ui/src/reducers/shortcuts-reducer.ts @@ -9,7 +9,7 @@ import { KeyMap, KeyMapItem } from 'utils/mousetrap-react'; import { ShortcutsState } from './interfaces'; function formatShortcuts(shortcuts: KeyMapItem): string { - const list: string[] = shortcuts.sequences as string[]; + const list: string[] = shortcuts.displayedSequences || (shortcuts.sequences as string[]); return `[${list .map((shortcut: string): string => { let keys = shortcut.split('+'); @@ -270,7 +270,8 @@ const defaultKeyMap = ({ FOCUS_INPUT_FRAME: { name: 'Focus input frame', description: 'Focus on the element to change the current frame', - sequences: ['~'], + sequences: ['`'], + displayedSequences: ['~'], action: 'keydown', }, SWITCH_AUTOMATIC_BORDERING: { diff --git a/cvat-ui/src/utils/mousetrap-react.tsx b/cvat-ui/src/utils/mousetrap-react.tsx index e8452e3d5562ded80d3a8a06ea2656295d849cb1..e140105cbb2ec77ec693351f917f377d14e570f8 100644 --- a/cvat-ui/src/utils/mousetrap-react.tsx +++ b/cvat-ui/src/utils/mousetrap-react.tsx @@ -9,6 +9,7 @@ export interface KeyMapItem { name: string; description: string; sequences: string[]; + displayedSequences?: string[]; action: 'keydown' | 'keyup' | 'keypress'; }