diff --git a/lib/static/new-ui/components/IconButton/index.tsx b/lib/static/new-ui/components/IconButton/index.tsx index 723bc9574..7063db91f 100644 --- a/lib/static/new-ui/components/IconButton/index.tsx +++ b/lib/static/new-ui/components/IconButton/index.tsx @@ -7,10 +7,11 @@ interface IconButtonProps { onClick?: () => void; view?: ButtonView; disabled?: boolean; + className?: string; } export function IconButton(props: IconButtonProps): ReactNode { return - + ; } diff --git a/lib/static/new-ui/components/ImageWithMagnifier/index.tsx b/lib/static/new-ui/components/ImageWithMagnifier/index.tsx index c8fece914..25f17df17 100644 --- a/lib/static/new-ui/components/ImageWithMagnifier/index.tsx +++ b/lib/static/new-ui/components/ImageWithMagnifier/index.tsx @@ -104,7 +104,7 @@ export function ImageWithMagnifier({ return
mouseEnter(e)} onMouseLeave={(e): void => mouseLeave(e)} diff --git a/lib/static/new-ui/features/suites/components/SuitesTreeView/index.tsx b/lib/static/new-ui/features/suites/components/SuitesTreeView/index.tsx index 14676e0fc..4fade97aa 100644 --- a/lib/static/new-ui/features/suites/components/SuitesTreeView/index.tsx +++ b/lib/static/new-ui/features/suites/components/SuitesTreeView/index.tsx @@ -68,7 +68,7 @@ export const SuitesTreeView = forwardRef ({ scrollToId: (id: string): void => { - virtualizer.scrollToIndex(list.structure.visibleFlattenIds.indexOf(id), {align: 'center'}); + virtualizer.scrollToIndex(list.structure.visibleFlattenIds.indexOf(id), {align: 'start'}); } })); diff --git a/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.module.css b/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.module.css index b36906ae1..b07deb50d 100644 --- a/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.module.css +++ b/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.module.css @@ -53,3 +53,7 @@ background-color: var(--divider-color); margin: 0 4px; } + +.icon-button[disabled] { + opacity: 0.5; +} diff --git a/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.tsx b/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.tsx index e8a10e26d..bf8315f31 100644 --- a/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.tsx +++ b/lib/static/new-ui/features/suites/components/TreeActionsToolbar/index.tsx @@ -33,7 +33,12 @@ import { getVisibleBrowserIds, getVisibleImages } from '@/static/modules/selectors/tree'; -import {getIsGui, getIsInitialized, getIsStaticImageAccepterEnabled} from '@/static/new-ui/store/selectors'; +import { + getAreCheckboxesNeeded, + getIsGui, + getIsInitialized, + getIsStaticImageAccepterEnabled +} from '@/static/new-ui/store/selectors'; import {isAcceptable, isScreenRevertable} from '@/static/modules/utils'; import {EditScreensFeature, RunTestsFeature} from '@/constants'; @@ -74,6 +79,7 @@ export function TreeActionsToolbar(props: TreeActionsToolbarProps): ReactNode { const isStaticImageAccepterEnabled = useSelector(getIsStaticImageAccepterEnabled); const isGuiMode = useSelector(getIsGui); + const areCheckboxesNeeded = useSelector(getAreCheckboxesNeeded); const visibleImages: ImageEntity[] = useSelector(getVisibleImages); const selectedImages: ImageEntity[] = useSelector(getSelectedImages); const activeImages = isSelectedAtLeastOne ? selectedImages : visibleImages; @@ -144,19 +150,19 @@ export function TreeActionsToolbar(props: TreeActionsToolbarProps): ReactNode { const areActionsDisabled = isRunning || !isInitialized; const viewButtons = <> - {isRunTestsAvailable && } + {isRunTestsAvailable && } tooltip={`Run ${selectedOrVisible}`} view={'flat'} onClick={handleRun} disabled={isRunning || !isInitialized}>} {isEditScreensAvailable && ( isUndoButtonVisible ? - } tooltip={`Undo accepting ${selectedOrVisible} screenshots`} view={'flat'} onClick={handleUndo} disabled={areActionsDisabled}> : - } tooltip={`Accept ${selectedOrVisible} screenshots`} view={'flat'} onClick={handleAccept} disabled={areActionsDisabled}> + } tooltip={`Undo accepting ${selectedOrVisible} screenshots`} view={'flat'} onClick={handleUndo} disabled={areActionsDisabled}> : + } tooltip={`Accept ${selectedOrVisible} screenshots`} view={'flat'} onClick={handleAccept} disabled={areActionsDisabled || !isAtLeastOneAcceptable}> )} -
+ {(isRunTestsAvailable || isEditScreensAvailable) &&
} } tooltip={'Focus on active test'} view={'flat'} onClick={props.onHighlightCurrentTest} disabled={!isInitialized}/> } tooltip={'Expand all'} view={'flat'} onClick={handleExpandAll} disabled={!isInitialized}/> } tooltip={'Collapse all'} view={'flat'} onClick={handleCollapseAll} disabled={!isInitialized}/> - } tooltip={isSelectedAll ? 'Deselect all' : 'Select all'} view={'flat'} onClick={handleToggleAll} disabled={!isInitialized}/> + {areCheckboxesNeeded && } tooltip={isSelectedAll ? 'Deselect all' : 'Select all'} view={'flat'} onClick={handleToggleAll} disabled={!isInitialized}/>} ; return
diff --git a/lib/static/new-ui/features/suites/components/TreeViewItemTitle/index.tsx b/lib/static/new-ui/features/suites/components/TreeViewItemTitle/index.tsx index e248e2ab2..ad22addbc 100644 --- a/lib/static/new-ui/features/suites/components/TreeViewItemTitle/index.tsx +++ b/lib/static/new-ui/features/suites/components/TreeViewItemTitle/index.tsx @@ -6,6 +6,7 @@ import {Checkbox} from '@gravity-ui/uikit'; import {useDispatch, useSelector} from 'react-redux'; import {toggleBrowserCheckbox, toggleSuiteCheckbox} from '@/static/modules/actions'; import {getToggledCheckboxState, isCheckboxChecked, isCheckboxIndeterminate} from '@/common-utils'; +import {getAreCheckboxesNeeded} from '@/static/new-ui/store/selectors'; interface TreeViewItemTitleProps { className?: string; @@ -14,6 +15,7 @@ interface TreeViewItemTitleProps { export function TreeViewItemTitle({item, className}: TreeViewItemTitleProps): React.JSX.Element { const dispatch = useDispatch(); + const areCheckboxesNeeded = useSelector(getAreCheckboxesNeeded); const checkStatus = useSelector(state => item.type === TreeViewItemType.Suite ? state.tree.suites.stateById[item.id].checkStatus : state.tree.browsers.stateById[item.id].checkStatus); const ref = useRef(null); @@ -45,6 +47,6 @@ export function TreeViewItemTitle({item, className}: TreeViewItemTitleProps): Re item.errorTitle && {item.errorTitle} } - + {areCheckboxesNeeded && }
; } diff --git a/lib/static/new-ui/store/selectors.ts b/lib/static/new-ui/store/selectors.ts index 5b025a212..af049e88a 100644 --- a/lib/static/new-ui/store/selectors.ts +++ b/lib/static/new-ui/store/selectors.ts @@ -7,6 +7,7 @@ import { SuiteState, BrowserState } from '@/static/new-ui/types/store'; +import {EditScreensFeature, RunTestsFeature} from '@/constants'; export const getAllRootSuiteIds = (state: State): string[] => state.tree.suites.allRootIds; export const getSuites = (state: State): Record => state.tree.suites.byId; @@ -20,3 +21,5 @@ export const getImages = (state: State): Record => state.tr export const getIsInitialized = (state: State): boolean => state.app.isInitialized; export const getIsStaticImageAccepterEnabled = (state: State): boolean => state.staticImageAccepter.enabled; export const getIsGui = (state: State): boolean => state.gui; + +export const getAreCheckboxesNeeded = (state: State): boolean => state.app.availableFeatures.includes(RunTestsFeature) || state.app.availableFeatures.includes(EditScreensFeature);