From 3a5931e4b1b7a6753081ef9572730075b05aab44 Mon Sep 17 00:00:00 2001
From: shadowusr <nikhakerlab@gmail.com>
Date: Sat, 28 Sep 2024 23:14:02 +0300
Subject: [PATCH] chore(new-ui): fix image attempt picking logic and image
 status color

---
 .../new-ui/components/SuiteTitle/index.module.css     |  5 -----
 lib/static/new-ui/components/SuiteTitle/index.tsx     | 11 +----------
 .../components/VisualChecksPage/index.tsx             |  3 +--
 lib/static/new-ui/features/visual-checks/selectors.ts | 10 +++++++++-
 test/unit/lib/static/components/controls/menu-bar.jsx |  4 ++--
 test/unit/lib/static/utils.tsx                        |  4 +++-
 6 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/lib/static/new-ui/components/SuiteTitle/index.module.css b/lib/static/new-ui/components/SuiteTitle/index.module.css
index 405489445..4e9616654 100644
--- a/lib/static/new-ui/components/SuiteTitle/index.module.css
+++ b/lib/static/new-ui/components/SuiteTitle/index.module.css
@@ -52,11 +52,6 @@
     gap: 8px;
 }
 
-.label:global(.g-label_theme_danger) {
-    --_--text-color: var(--color-pink-600);
-    --_--bg-color: var(--color-pink-100);
-}
-
 .label :global(.g-label__content) {
     display: flex;
     align-items: center;
diff --git a/lib/static/new-ui/components/SuiteTitle/index.tsx b/lib/static/new-ui/components/SuiteTitle/index.tsx
index c143657d5..fafe3fb9a 100644
--- a/lib/static/new-ui/components/SuiteTitle/index.tsx
+++ b/lib/static/new-ui/components/SuiteTitle/index.tsx
@@ -3,7 +3,6 @@ import React, {ReactNode} from 'react';
 import {Button, Icon, Label} from '@gravity-ui/uikit';
 import {Camera, ChevronRight, PlanetEarth, ChevronUp, ChevronDown} from '@gravity-ui/icons';
 
-import {TestStatus} from '@/constants';
 import styles from './index.module.css';
 
 interface SuiteTitleProps {
@@ -14,7 +13,6 @@ interface SuiteTitlePropsInternal extends SuiteTitleProps {
     suitePath: string[];
     browserName: string;
     stateName?: string;
-    imageStatus?: TestStatus;
     index: number;
     totalItems: number;
     onPrevious: () => void;
@@ -25,13 +23,6 @@ export function SuiteTitle(props: SuiteTitlePropsInternal): ReactNode {
     const suiteName = props.suitePath[props.suitePath.length - 1];
     const suitePath = props.suitePath.slice(0, -1);
 
-    let stateNameLabelTheme: 'normal' | 'danger' | 'success' = 'normal';
-    if (props.imageStatus === TestStatus.FAIL || props.imageStatus === TestStatus.ERROR) {
-        stateNameLabelTheme = 'danger';
-    } else if (props.imageStatus === TestStatus.SUCCESS) {
-        stateNameLabelTheme = 'success';
-    }
-
     return <div className={classNames(styles.container, props.className)}>
         <div className={styles.content}>
             <div className={classNames(styles.breadcrumbs)}>
@@ -53,7 +44,7 @@ export function SuiteTitle(props: SuiteTitlePropsInternal): ReactNode {
                 <div className={styles.labelsContainer}>
                     <Label theme={'normal'} size={'xs'} className={styles.label}><PlanetEarth/>{props.browserName}
                     </Label>
-                    {props.stateName && <Label theme={stateNameLabelTheme} size={'xs'} className={classNames(styles.label)}><Camera/>{props.stateName}</Label>}
+                    {props.stateName && <Label theme='utility' size={'xs'} className={classNames(styles.label)}><Camera/>{props.stateName}</Label>}
                 </div>
             </div>
         </div>
diff --git a/lib/static/new-ui/features/visual-checks/components/VisualChecksPage/index.tsx b/lib/static/new-ui/features/visual-checks/components/VisualChecksPage/index.tsx
index 0d8f1f824..ef9c49ed4 100644
--- a/lib/static/new-ui/features/visual-checks/components/VisualChecksPage/index.tsx
+++ b/lib/static/new-ui/features/visual-checks/components/VisualChecksPage/index.tsx
@@ -43,8 +43,7 @@ export function VisualChecksPageInternal({currentNamedImage, currentImage, visib
                     totalItems={visibleNamedImageIds.length}
                     onPrevious={onPreviousImageHandler}
                     stateName={currentNamedImage.stateName}
-                    onNext={onNextImageHandler}
-                    imageStatus={currentNamedImage.status}/>}
+                    onNext={onNextImageHandler}/>}
             </div>
             {currentImage && <AssertViewResult result={currentImage}/>}
         </UiCard>
diff --git a/lib/static/new-ui/features/visual-checks/selectors.ts b/lib/static/new-ui/features/visual-checks/selectors.ts
index e779d493d..24fa07422 100644
--- a/lib/static/new-ui/features/visual-checks/selectors.ts
+++ b/lib/static/new-ui/features/visual-checks/selectors.ts
@@ -98,7 +98,15 @@ export const getCurrentImage = (state: State): ImageEntity | null => {
     }
 
     const retryIndex = state.tree.browsers.stateById[currentNamedImage.browserId].retryIndex;
-    const currentImageId = currentNamedImage.imageIds[retryIndex];
+    const currentImageId = currentNamedImage.imageIds.find(imageId => {
+        const resultId = state.tree.images.byId[imageId].parentId;
+
+        return state.tree.results.byId[resultId].attempt === retryIndex;
+    });
+
+    if (!currentImageId) {
+        return null;
+    }
 
     return getImages(state)[currentImageId];
 };
diff --git a/test/unit/lib/static/components/controls/menu-bar.jsx b/test/unit/lib/static/components/controls/menu-bar.jsx
index ad98ca7ed..25ff78c70 100644
--- a/test/unit/lib/static/components/controls/menu-bar.jsx
+++ b/test/unit/lib/static/components/controls/menu-bar.jsx
@@ -11,7 +11,7 @@ describe('<MenuBar />', () => {
             initialState: {apiValues: {extraItems: {some: 'link'}}}
         });
 
-        await user.click(component.getByRole('button'));
+        await user.click(component.getByTestId('menu-bar').querySelector('button'));
 
         expect(component.getByText('some')).to.exist;
         expect(component.getByText('some').href).to.equal('http://localhost/link');
@@ -22,6 +22,6 @@ describe('<MenuBar />', () => {
             initialState: {apiValues: {extraItems: {}}}
         });
 
-        expect(component.queryByRole('button')).to.not.exist;
+        expect(component.queryByTestId('menu-bar')).to.not.exist;
     });
 });
diff --git a/test/unit/lib/static/utils.tsx b/test/unit/lib/static/utils.tsx
index 721599ccd..d72ff0ae4 100644
--- a/test/unit/lib/static/utils.tsx
+++ b/test/unit/lib/static/utils.tsx
@@ -101,7 +101,9 @@ export const addResultToTree = ({tree, suiteName, browserName, attempt, metaInfo
         imageIds: [],
         metaInfo,
         status: TestStatus.IDLE,
-        timestamp: 0
+        timestamp: 0,
+        suitePath: [],
+        name: browserName
     };
     tree.results.stateById[fullId] = {
         matchedSelectedGroup: false