resolve-lint-issue

RocketChat · Feb 19, 2024 · 0ce12ad · 0ce12ad
1 parent 4e725f5
commit 0ce12ad
Showing 1 changed file with 6 additions and 23 deletions.
diff --git a/packages/react/src/components/Mentions/MembersList.js b/packages/react/src/components/Mentions/MembersList.js
@@ -35,6 +35,7 @@ function MembersList({ mentionIndex, filteredMembers = [], onMemberClick }) {
     align-items: center;
     padding-left: 0;
     padding-right: 2px;
+    background-color: ${mentionIndex === filteredMembers.length && '#dddddd'};
 
     &:hover {
       background-color: #e8e8e8;
@@ -79,29 +80,19 @@ function MembersList({ mentionIndex, filteredMembers = [], onMemberClick }) {
   }, [mentionIndex, filteredMembers, handleMemberClick]);
 
   return (
-    <Box
-      css={listStyle}
-      onKeyDown={(e) => {
-        if (e.key === 'Enter') {
-          e.preventDefault();
-        }
-      }}
-    >
+    <Box css={listStyle}>
       <ul style={{ listStyle: 'none' }}>
-        {filteredMembers.map((member, index) => (
+        {filteredMembers.map((member) => (
           <li
             key={member._id}
+            role="presentation"
             css={listItemStyle}
             onClick={() => handleMemberClick(member)}
             onKeyDown={(e) => {
               if (e.key === 'Enter') {
                 handleMemberClick(member);
               }
             }}
-            tabIndex={0}
-            style={{
-              backgroundColor: index === mentionIndex && '#dddddd',
-            }}
           >
             <span style={{ justifyContent: 'space-evenly' }}>
               <span css={listTextStyle}>{member.name}</span>
@@ -112,35 +103,27 @@ function MembersList({ mentionIndex, filteredMembers = [], onMemberClick }) {
         ))}
         <li
           key="all"
+          role="presentation"
           css={listItemStyle}
           onClick={() => handleMemberClick('all')}
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               handleMemberClick('all');
             }
           }}
-          tabIndex={0}
-          style={{
-            backgroundColor:
-              mentionIndex === filteredMembers.length && '#dddddd',
-          }}
         >
           <span css={listTextStyle}>all</span>
         </li>
         <li
           key="here"
+          role="presentation"
           css={listItemStyle}
           onClick={() => handleMemberClick('here')}
           onKeyDown={(e) => {
             if (e.key === 'Enter') {
               handleMemberClick('here');
             }
           }}
-          tabIndex={0}
-          style={{
-            backgroundColor:
-              mentionIndex === filteredMembers.length + 1 && '#dddddd',
-          }}
         >
           <span css={listTextStyle}>here</span>
         </li>