Don't reverse icons that don't have directional functionality

Author: imnasnainaec

src/components/AppBar/SpeakerMenu.tsx

@@ -22,7 +22,6 @@ import { useSelector } from "react-redux";
 import { type Speaker } from "api/models";
 import { getAllSpeakers } from "backend";
 import { buttonMinHeight } from "components/AppBar/AppBarTypes";
-import BidiIcon from "components/BidiIcon";
 import { setCurrentSpeaker } from "components/Project/ProjectActions";
 import { useAppDispatch } from "rootRedux/hooks";
 import { type StoreState } from "rootRedux/types";
@@ -63,7 +62,7 @@ export default function SpeakerMenu(): ReactElement {
           minWidth: 0,
         }}
       >
-        <BidiIcon icon={RecordVoiceOver} />
+        <RecordVoiceOver />
       </Button>
       <Menu
         anchorEl={anchorElement}

src/components/AppBar/UserMenu.tsx

@@ -31,7 +31,6 @@ import {
   shortenName,
   tabColor,
 } from "components/AppBar/AppBarTypes";
-import BidiIcon from "components/BidiIcon";
 import { clearCurrentProject } from "components/Project/ProjectActions";
 import { useAppDispatch } from "rootRedux/hooks";
 import { Path } from "types/path";
@@ -172,7 +171,7 @@ export function UserMenuList(props: UserMenuListProps): ReactElement {
           props.onSelect();
         }}
       >
-        <BidiIcon icon={ExitToApp} iconProps={{ style: iconStyle }} />
+        <ExitToApp style={iconStyle} />
         {t("userMenu.logout")}
       </MenuItem>
 

src/components/BidiIcon/index.tsx

@@ -5,7 +5,6 @@ import { useTranslation } from "react-i18next";
 import { Key } from "ts-key-enum";
 
 import { SemanticDomainFull } from "api/models";
-import BidiIcon from "components/BidiIcon";
 import theme from "types/theme";
 
 interface DataEntryHeaderProps {
@@ -23,10 +22,6 @@ export default function DataEntryHeader(
   const domain = props.domain;
   const { t } = useTranslation();
 
-  const switchIcon = (
-    <BidiIcon icon={Help} iconProps={{ style: { fontSize: 21 } }} />
-  );
-
   return (
     <Typography
       variant="h4"
@@ -40,8 +35,8 @@ export default function DataEntryHeader(
       <Switch
         id="questionVisibilitySwitch"
         onChange={() => props.setQuestionVisibility(!props.questionsVisible)}
-        icon={switchIcon}
-        checkedIcon={switchIcon}
+        icon={<Help style={{ fontSize: 21 }} />}
+        checkedIcon={<Help style={{ fontSize: 21 }} />}
         checked={props.questionsVisible}
         color="primary"
         style={{ paddingTop: "8px" }}

src/components/DataEntry/DataEntryHeader.tsx

@@ -27,7 +27,6 @@ import {
 } from "api/models";
 import * as backend from "backend";
 import { getCurrentUser, getUserId } from "backend/localStorage";
-import BidiIcon from "components/BidiIcon";
 import NewEntry from "components/DataEntry/DataEntryTable/NewEntry";
 import RecentEntry from "components/DataEntry/DataEntryTable/RecentEntry";
 import { filterWordsWithSenses } from "components/DataEntry/utilities";
@@ -1128,7 +1127,7 @@ export default function DataEntryTable(
             variant="contained"
             color={highlightExitButton ? "primary" : "secondary"}
             style={{ marginTop: theme.spacing(2) }}
-            endIcon={<BidiIcon icon={ExitToApp} />}
+            endIcon={<ExitToApp />}
             tabIndex={-1}
             onClick={handleExit}
           >

src/components/DataEntry/DataEntryTable/index.tsx

@@ -1,4 +1,4 @@
-import { ExitToApp } from "@mui/icons-material";
+import ExitToAppIcon from "@mui/icons-material/ExitToApp";
 import { Button, Card, Grid, TextField, Typography } from "@mui/material";
 import {
   type FormEvent,
@@ -11,7 +11,6 @@ import { useTranslation } from "react-i18next";
 import { useNavigate, useParams } from "react-router-dom";
 
 import { resetPassword, validateResetToken } from "backend";
-import BidiIcon from "components/BidiIcon";
 import InvalidLink from "components/InvalidLink";
 import { Path } from "types/path";
 import { meetsPasswordRequirements } from "utilities/utilities";
@@ -169,7 +168,7 @@ export default function PasswordReset(): ReactElement {
                   >
                     {t("passwordReset.backToLogin")}
                      
-                    <BidiIcon icon={ExitToApp} />
+                    <ExitToAppIcon />
                   </Button>
                 </>
               ) : (

src/components/PasswordReset/ResetPage.tsx

@@ -39,7 +39,6 @@ import { toast } from "react-toastify";
 
 import { Permission, type Project } from "api/models";
 import { canUploadLift, getCurrentPermissions } from "backend";
-import BidiIcon from "components/BidiIcon";
 import {
   asyncRefreshProjectUsers,
   asyncSetNewCurrentProject,
@@ -158,12 +157,7 @@ export default function ProjectSettingsComponent(): ReactElement {
           {/* Project name */}
           {permissions.includes(Permission.DeleteEditSettingsAndUsers) && (
             <BaseSettings
-              icon={
-                <BidiIcon
-                  icon={Edit}
-                  iconProps={{ "data-testid": Setting.Name }}
-                />
-              }
+              icon={<Edit data-testid={Setting.Name} />}
               title={t("projectSettings.name")}
               body={
                 <ProjectName project={project} setProject={updateProject} />
@@ -174,12 +168,7 @@ export default function ProjectSettingsComponent(): ReactElement {
           {/* Autocomplete toggle */}
           {permissions.includes(Permission.DeleteEditSettingsAndUsers) && (
             <BaseSettings
-              icon={
-                <BidiIcon
-                  icon={Sms}
-                  iconProps={{ "data-testid": Setting.Autocomplete }}
-                />
-              }
+              icon={<Sms data-testid={Setting.Autocomplete} />}
               title={t("projectSettings.autocomplete.label")}
               body={
                 <ProjectAutocomplete
@@ -255,12 +244,7 @@ export default function ProjectSettingsComponent(): ReactElement {
           {/* Add users to project */}
           {permissions.includes(Permission.DeleteEditSettingsAndUsers) && (
             <BaseSettings
-              icon={
-                <BidiIcon
-                  icon={PersonAdd}
-                  iconProps={{ "data-testid": Setting.UserAdd }}
-                />
-              }
+              icon={<PersonAdd data-testid={Setting.UserAdd} />}
               title={t("projectSettings.user.addUser")}
               body={<AddProjectUsers projectId={project.id} />}
             />
@@ -269,12 +253,7 @@ export default function ProjectSettingsComponent(): ReactElement {
           {/* Manage project speakers */}
           {permissions.includes(Permission.DeleteEditSettingsAndUsers) && (
             <BaseSettings
-              icon={
-                <BidiIcon
-                  icon={RecordVoiceOver}
-                  iconProps={{ "data-testid": Setting.Speakers }}
-                />
-              }
+              icon={<RecordVoiceOver data-testid={Setting.Speakers} />}
               title={t("projectSettings.speaker.label")}
               body={<ProjectSpeakersList projectId={project.id} />}
             />