From 756c4bcc0457eb2991b4b8ae9d431319fa1e52dc Mon Sep 17 00:00:00 2001
From: Gustav Hansen <gustav.hansen@strapi.io>
Date: Fri, 21 Oct 2022 14:46:30 +0200
Subject: [PATCH] SettingsPage: Fix prop-types

---
 .../pages/Roles/ListPage/components/RoleRow/index.js         | 4 +++-
 .../src/pages/SettingsPage/pages/Roles/ListPage/index.js     | 3 ++-
 .../admin/pages/SettingsPage/pages/Roles/ListPage/index.js   | 5 +++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/components/RoleRow/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/components/RoleRow/index.js
index 8cc9a9fe3d..81e365fa9b 100644
--- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/components/RoleRow/index.js
+++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/components/RoleRow/index.js
@@ -8,7 +8,7 @@ import { IconButton } from '@strapi/design-system/IconButton';
 import { stopPropagation, onRowClick, pxToRem } from '@strapi/helper-plugin';
 import { useIntl } from 'react-intl';
 
-const RoleRow = ({ id, name, description, usersCount, icons }) => {
+const RoleRow = ({ id, name, description, usersCount, icons, rowIndex }) => {
   const { formatMessage } = useIntl();
 
   const usersCountText = formatMessage(
@@ -21,6 +21,7 @@ const RoleRow = ({ id, name, description, usersCount, icons }) => {
 
   return (
     <Tr
+      aria-rowindex={rowIndex}
       key={id}
       {...onRowClick({
         fn: icons[1].onClick,
@@ -60,6 +61,7 @@ RoleRow.propTypes = {
   description: PropTypes.string.isRequired,
   usersCount: PropTypes.number.isRequired,
   icons: PropTypes.array.isRequired,
+  rowIndex: PropTypes.number.isRequired,
 };
 
 export default RoleRow;
diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/index.js b/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/index.js
index 3f23623e89..47d0b2c0c0 100644
--- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/index.js
+++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/ListPage/index.js
@@ -168,7 +168,7 @@ const RoleListPage = () => {
             </Tr>
           </Thead>
           <Tbody>
-            {sortedRoles?.map((role) => (
+            {sortedRoles?.map((role, rowIndex) => (
               <RoleRow
                 key={role.id}
                 id={role.id}
@@ -176,6 +176,7 @@ const RoleListPage = () => {
                 description={role.description}
                 usersCount={role.usersCount}
                 icons={getIcons(role)}
+                rowIndex={rowIndex + 2}
               />
             ))}
           </Tbody>
diff --git a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/ListPage/index.js b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/ListPage/index.js
index 5ff424649f..c80404f07d 100644
--- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/ListPage/index.js
+++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/ListPage/index.js
@@ -303,7 +303,7 @@ const RoleListPage = () => {
             }
           >
             <Thead>
-              <Tr>
+              <Tr aria-rowindex={1}>
                 <Th>
                   <Typography variant="sigma" textColor="neutral600">
                     {formatMessage({
@@ -339,7 +339,7 @@ const RoleListPage = () => {
               </Tr>
             </Thead>
             <Tbody>
-              {sortedRoles?.map((role) => (
+              {sortedRoles?.map((role, index) => (
                 <BaseRoleRow
                   key={role.id}
                   id={role.id}
@@ -347,6 +347,7 @@ const RoleListPage = () => {
                   description={role.description}
                   usersCount={role.usersCount}
                   icons={getIcons(role)}
+                  rowIndex={index + 2}
                 />
               ))}
             </Tbody>