From 3c612bc8877a4a07f4d46c93401109c39e476661 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patrik=20Matias=CC=8Cko?= <patrik.matiasko@gmail.com>
Date: Mon, 5 Aug 2024 22:58:08 +0200
Subject: [PATCH] Table - testId update

---
 .../Atomic/SimpleStripTable/SimpleStripTable.tsx    |  4 ++--
 src/components/Atomic/TableNew/Table.tsx            | 13 +++++++------
 .../TableGlobalFilter/TableGlobalFilter.tsx         |  4 ++--
 3 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/components/Atomic/SimpleStripTable/SimpleStripTable.tsx b/src/components/Atomic/SimpleStripTable/SimpleStripTable.tsx
index 623663d0..9ff4f2ed 100644
--- a/src/components/Atomic/SimpleStripTable/SimpleStripTable.tsx
+++ b/src/components/Atomic/SimpleStripTable/SimpleStripTable.tsx
@@ -78,7 +78,7 @@ const SimpleStripTable: FC<Props> = (props) => {
                                     lastRowBorder === false && key === rows.length - 1 && styles.noLastRowBorder,
                                     noSidePadding && styles.noLeftPadding,
                                 ]}
-                                data-test-id={getDataTestId(r, 'attribute', key)}
+                                data-test-id={getDataTestId(r, '-attribute', key)}
                             >
                                 {r.attribute}
                                 {r.required && <span css={styles.required}> *</span>}
@@ -94,7 +94,7 @@ const SimpleStripTable: FC<Props> = (props) => {
                                     lastRowBorder === false && key === rows.length - 1 && styles.noLastRowBorder,
                                     noSidePadding && styles.noRightPadding,
                                 ]}
-                                data-test-id={getDataTestId(r, 'value', key)}
+                                data-test-id={getDataTestId(r, '-value', key)}
                             >
                                 {r.value}
                                 {r.copyValue && (
diff --git a/src/components/Atomic/TableNew/Table.tsx b/src/components/Atomic/TableNew/Table.tsx
index 80291093..8e75832f 100644
--- a/src/components/Atomic/TableNew/Table.tsx
+++ b/src/components/Atomic/TableNew/Table.tsx
@@ -1,21 +1,22 @@
 // @ts-nocheck
 import React, { ChangeEvent, FC, useEffect, useMemo, useState, useRef, useCallback } from 'react'
+import { createPortal } from 'react-dom'
+import { usePagination, useRowSelect, useSortBy, useTable, useGlobalFilter } from 'react-table'
+import get from 'lodash/get'
+import isEqual from 'lodash/isEqual'
+import isEmpty from 'lodash/isEmpty'
+import classNames from 'classnames'
+
 import { Props, defaultProps } from './Table.types'
 import * as styles from './Table.styles'
-import { usePagination, useRowSelect, useSortBy, useTable, useGlobalFilter } from 'react-table'
 import { compareIgnoreCase } from './Utils'
-import classNames from 'classnames'
 import { IconTableArrowDown, IconTableArrowUp, convertSize } from '../Icon'
 import Checkbox from '../Checkbox'
-import { createPortal } from 'react-dom'
 import Pagination from '../../Layout/Footer/Pagination/Pagination'
-import isEqual from 'lodash/isEqual'
-import isEmpty from 'lodash/isEmpty'
 import TableGlobalFilter from './TableGlobalFilter'
 import { GLOBAL_FILTER_HEIGHT, HEADER_HEIGHT } from './constants'
 import ConditionalWrapper from '../ConditionalWrapper'
 import IconLoader from '../Loader/IconLoader'
-import get from 'lodash/get'
 
 const Table: FC<Props> = (props) => {
     const {
diff --git a/src/components/Atomic/TableNew/TableGlobalFilter/TableGlobalFilter.tsx b/src/components/Atomic/TableNew/TableGlobalFilter/TableGlobalFilter.tsx
index e92ef45e..bc5ddcc8 100644
--- a/src/components/Atomic/TableNew/TableGlobalFilter/TableGlobalFilter.tsx
+++ b/src/components/Atomic/TableNew/TableGlobalFilter/TableGlobalFilter.tsx
@@ -14,7 +14,7 @@ const TableGlobalFilter: FC<Props> = (props) => {
     }, 200)
 
     return (
-        <div css={styles.globalFilter}>
+        <div css={styles.globalFilter} data-test-id={dataTestId}>
             <div css={styles.left}>
                 <IconSearch css={styles.icon} />
                 <input
@@ -30,7 +30,7 @@ const TableGlobalFilter: FC<Props> = (props) => {
             </div>
             {showFilterButton && (
                 <div>
-                    <Button onClick={() => onChange(value)} size='small' variant='filter'>
+                    <Button data-test-id={dataTestId?.concat('-button')} onClick={() => onChange(value)} size='small' variant='filter'>
                         {i18n.search}
                     </Button>
                 </div>