From c58c0523ab9cb41ff9a6544f243d0b984b04f39c Mon Sep 17 00:00:00 2001
From: Vadzim Hvazdovich <vadzim_hvazdovich@epam.com>
Date: Tue, 6 Feb 2024 16:21:50 +0300
Subject: [PATCH] EPMRPP-80259 || code review fixes - 1

---
 .github/workflows/release.yml                 |  2 +-
 app/Readme.md                                 |  2 +-
 .../autocompleteMenu/autocompleteMenu.jsx     |  4 +--
 .../autocompleteMenu/autocompleteMenu.jsx     |  4 +--
 .../rolesRow/rolesRow.jsx                     |  2 +-
 .../filterGrid/filterName/filterName.jsx      | 27 ++++++++++++-------
 readme.md                                     |  4 +--
 7 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index e3a63e237e..de6dd342fa 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -33,7 +33,7 @@ jobs:
           NODE_OPTIONS: '--max_old_space_size=2048'
 
         run: |
-          npm --prefix ${{ env.UI_BUILD_REACT }} ci
+          npm --prefix ${{ env.UI_BUILD_REACT }} ci --legacy-peer-deps
           npm --prefix ${{ env.UI_BUILD_REACT }} run lint
           npm --prefix ${{ env.UI_BUILD_REACT }} run test:coverage
           npm --prefix ${{ env.UI_BUILD_REACT }} run build
diff --git a/app/Readme.md b/app/Readme.md
index 44baf12974..ccc8d5cbd6 100644
--- a/app/Readme.md
+++ b/app/Readme.md
@@ -10,7 +10,7 @@ To launch the development environment, follow these steps:
 
 1.  open console from the project root
 2.  run the command `cd app`
-3.  run the command `npm install`
+3.  run the command `npm install --legacy-peer-deps`
 4.  to proxy requests to the server, create `.env` file in `app` folder
 
     ```
diff --git a/app/src/componentLibrary/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx b/app/src/componentLibrary/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
index d5dffecaa7..30c61d5183 100644
--- a/app/src/componentLibrary/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
+++ b/app/src/componentLibrary/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
@@ -14,8 +14,6 @@
  * limitations under the License.
  */
 
-/* eslint-disable react/no-unknown-property */
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames/bind';
@@ -39,6 +37,8 @@ export const AutocompleteMenu = React.forwardRef(
           { opened: isOpen && isReadyForSearch(minLength, inputValue) },
           className,
         )}
+        // placement used by Popper
+        /* eslint-disable-next-line react/no-unknown-property */
         placement={placement}
         style={style}
       >
diff --git a/app/src/components/inputs/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx b/app/src/components/inputs/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
index 4dfd3a30ab..d6c5a9baca 100644
--- a/app/src/components/inputs/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
+++ b/app/src/components/inputs/autocompletes/common/autocompleteMenu/autocompleteMenu.jsx
@@ -14,8 +14,6 @@
  * limitations under the License.
  */
 
-/* eslint-disable react/no-unknown-property */
-
 import React from 'react';
 import { ScrollWrapper } from 'components/main/scrollWrapper';
 import PropTypes from 'prop-types';
@@ -79,6 +77,8 @@ export const AutocompleteMenu = React.forwardRef(
       <ul
         ref={ref}
         className={cx('menu', { opened: isOpen && menuContent })}
+        // placement used by Popper
+        /* eslint-disable-next-line react/no-unknown-property */
         placement={placement}
         style={style}
       >
diff --git a/app/src/pages/admin/allUsersPage/allUsersGrid/projectsAndRolesColumn/rolesRow/rolesRow.jsx b/app/src/pages/admin/allUsersPage/allUsersGrid/projectsAndRolesColumn/rolesRow/rolesRow.jsx
index 2cabdbce58..40290e6c84 100644
--- a/app/src/pages/admin/allUsersPage/allUsersGrid/projectsAndRolesColumn/rolesRow/rolesRow.jsx
+++ b/app/src/pages/admin/allUsersPage/allUsersGrid/projectsAndRolesColumn/rolesRow/rolesRow.jsx
@@ -164,7 +164,7 @@ export class RolesRow extends Component {
         : intl.formatMessage(messages.unAssignFromProject);
       const Tooltip = () => <TextTooltip tooltipContent={tooltipMessage} />;
       const disable = this.isPersonalProject();
-      const componentClickHandler = !this.isPersonalProject() ? clickHandler : null;
+      const componentClickHandler = !disable ? clickHandler : null;
       const WrappedComponent = () => (
         <IconComponent
           different={different}
diff --git a/app/src/pages/inside/filtersPage/filterGrid/filterName/filterName.jsx b/app/src/pages/inside/filtersPage/filterGrid/filterName/filterName.jsx
index e66420006a..eb198c1983 100644
--- a/app/src/pages/inside/filtersPage/filterGrid/filterName/filterName.jsx
+++ b/app/src/pages/inside/filtersPage/filterGrid/filterName/filterName.jsx
@@ -26,6 +26,23 @@ import styles from './filterName.scss';
 
 const cx = classNames.bind(styles);
 
+const NameLink = ({ link, children }) =>
+  link ? (
+    <Link className={cx('name-link')} to={link}>
+      {children}
+    </Link>
+  ) : (
+    children
+  );
+NameLink.propTypes = {
+  link: PropTypes.string,
+  children: PropTypes.node,
+};
+NameLink.defaultProps = {
+  link: '',
+  children: null,
+};
+
 export class FilterName extends Component {
   static propTypes = {
     userFilters: PropTypes.array,
@@ -82,16 +99,6 @@ export class FilterName extends Component {
       nameLink,
     } = this.props;
 
-    // eslint-disable-next-line react/prop-types
-    const NameLink = ({ link, children }) =>
-      link ? (
-        <Link className={cx('name-link')} to={link}>
-          {children}
-        </Link>
-      ) : (
-        children
-      );
-
     return (
       <Fragment>
         <span className={cx('name-wrapper')}>
diff --git a/readme.md b/readme.md
index 31c24e73b1..ede0b57590 100644
--- a/readme.md
+++ b/readme.md
@@ -8,13 +8,13 @@
 [![GitHub release (latest SemVer)](https://img.shields.io/github/v/release/reportportal/service-ui?sort=semver)](https://github.com/reportportal/service-ui/releases/latest)
 [![Docker Pulls](https://img.shields.io/docker/pulls/reportportal/service-ui.svg?maxAge=159200)](https://hub.docker.com/r/reportportal/service-ui/)
 
-1. Install nodejs (minimum required version 12, recommended - 20)
+1. Install nodejs (version 20 is recommended)
 
 2. Open console from the project root
 
 3. Run the command `cd app`
 
-4. Run the command `npm install` or `npm ci`
+4. Run the command `npm install --legacy-peer-deps` or `npm ci --legacy-peer-deps`
 
 5. Create file `.env` in `app` folder