diff --git a/package-lock.json b/package-lock.json
index 3dedaa6b034e9..b7151ee2bbf9f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -132,7 +132,8 @@
         "react-web-config": "^1.0.0",
         "react-webcam": "^7.1.1",
         "react-window": "^1.8.9",
-        "semver": "^7.5.2"
+        "semver": "^7.5.2",
+        "shim-keyboard-event-key": "^1.0.3"
       },
       "devDependencies": {
         "@actions/core": "1.10.0",
@@ -39642,6 +39643,10 @@
         "shellcheck": "shellcheck-stable/shellcheck"
       }
     },
+    "node_modules/shim-keyboard-event-key": {
+      "version": "1.0.3",
+      "license": "MIT"
+    },
     "node_modules/side-channel": {
       "version": "1.0.4",
       "license": "MIT",
diff --git a/package.json b/package.json
index 14bc9d32373c6..9c4edeaa66953 100644
--- a/package.json
+++ b/package.json
@@ -185,7 +185,8 @@
     "react-web-config": "^1.0.0",
     "react-webcam": "^7.1.1",
     "react-window": "^1.8.9",
-    "semver": "^7.5.2"
+    "semver": "^7.5.2",
+    "shim-keyboard-event-key": "^1.0.3"
   },
   "devDependencies": {
     "@actions/core": "1.10.0",
diff --git a/src/components/TextInput/TextInputClearButton/index.tsx b/src/components/TextInput/TextInputClearButton/index.tsx
index 106ae4439b8d1..4bd18be0c79b4 100644
--- a/src/components/TextInput/TextInputClearButton/index.tsx
+++ b/src/components/TextInput/TextInputClearButton/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {forwardRef} from 'react';
 import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import {PressableWithoutFeedback} from '@components/Pressable';
@@ -40,4 +40,4 @@ function TextInputClearButton({onPressButton}: TextInputClearButtonProps) {
 
 TextInputClearButton.displayName = 'TextInputClearButton';
 
-export default TextInputClearButton;
+export default forwardRef(TextInputClearButton);
diff --git a/src/libs/Navigation/AppNavigator/ReportScreenIDSetter.ts b/src/libs/Navigation/AppNavigator/ReportScreenIDSetter.ts
index 5306f6b550547..5407a451682a0 100644
--- a/src/libs/Navigation/AppNavigator/ReportScreenIDSetter.ts
+++ b/src/libs/Navigation/AppNavigator/ReportScreenIDSetter.ts
@@ -1,15 +1,35 @@
 import {useEffect} from 'react';
 import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
-import {useOnyx} from 'react-native-onyx';
+import {withOnyx} from 'react-native-onyx';
 import useActiveWorkspace from '@hooks/useActiveWorkspace';
 import usePermissions from '@hooks/usePermissions';
 import {getPolicyEmployeeListByIdWithoutCurrentUser} from '@libs/PolicyUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type {Policy, Report, ReportMetadata} from '@src/types/onyx';
+import type {PersonalDetailsList, Policy, Report, ReportMetadata} from '@src/types/onyx';
 import type {ReportScreenWrapperProps} from './ReportScreenWrapper';
 
-type ReportScreenIDSetterProps = ReportScreenWrapperProps;
+type ReportScreenIDSetterComponentProps = {
+    /** Available reports that would be displayed in this navigator */
+    reports: OnyxCollection<Report>;
+
+    /** The policies which the user has access to */
+    policies: OnyxCollection<Policy>;
+
+    /** The personal details of the person who is logged in */
+    personalDetails: OnyxEntry<PersonalDetailsList>;
+
+    /** Whether user is a new user */
+    isFirstTimeNewExpensifyUser: OnyxEntry<boolean>;
+
+    /** The report metadata */
+    reportMetadata: OnyxCollection<ReportMetadata>;
+
+    /** The accountID of the current user */
+    accountID?: number;
+};
+
+type ReportScreenIDSetterProps = ReportScreenIDSetterComponentProps & ReportScreenWrapperProps;
 
 /**
  * Get the most recently accessed report for the user
@@ -37,18 +57,11 @@ const getLastAccessedReportID = (
     return lastReport?.reportID;
 };
 
-// This wrapper is responsible for opening the last accessed report if there is no reportID specified in the route params
-function ReportScreenIDSetter({route, navigation}: ReportScreenIDSetterProps) {
+// This wrapper is reponsible for opening the last accessed report if there is no reportID specified in the route params
+function ReportScreenIDSetter({route, reports, policies, navigation, isFirstTimeNewExpensifyUser = false, reportMetadata, accountID, personalDetails}: ReportScreenIDSetterProps) {
     const {canUseDefaultRooms} = usePermissions();
     const {activeWorkspaceID} = useActiveWorkspace();
 
-    const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {allowStaleData: true});
-    const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {allowStaleData: true});
-    const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST);
-    const [isFirstTimeNewExpensifyUser] = useOnyx(ONYXKEYS.NVP_IS_FIRST_TIME_NEW_EXPENSIFY_USER, {initialValue: false});
-    const [reportMetadata] = useOnyx(ONYXKEYS.COLLECTION.REPORT_METADATA, {allowStaleData: true});
-    const [accountID] = useOnyx(ONYXKEYS.SESSION, {selector: (session) => session?.accountID});
-
     useEffect(() => {
         // Don't update if there is a reportID in the params already
         if (route?.params?.reportID) {
@@ -88,4 +101,28 @@ function ReportScreenIDSetter({route, navigation}: ReportScreenIDSetterProps) {
 
 ReportScreenIDSetter.displayName = 'ReportScreenIDSetter';
 
-export default ReportScreenIDSetter;
+export default withOnyx<ReportScreenIDSetterProps, ReportScreenIDSetterComponentProps>({
+    reports: {
+        key: ONYXKEYS.COLLECTION.REPORT,
+        allowStaleData: true,
+    },
+    policies: {
+        key: ONYXKEYS.COLLECTION.POLICY,
+        allowStaleData: true,
+    },
+    isFirstTimeNewExpensifyUser: {
+        key: ONYXKEYS.NVP_IS_FIRST_TIME_NEW_EXPENSIFY_USER,
+        initialValue: false,
+    },
+    reportMetadata: {
+        key: ONYXKEYS.COLLECTION.REPORT_METADATA,
+        allowStaleData: true,
+    },
+    accountID: {
+        key: ONYXKEYS.SESSION,
+        selector: (session) => session?.accountID,
+    },
+    personalDetails: {
+        key: ONYXKEYS.PERSONAL_DETAILS_LIST,
+    },
+})(ReportScreenIDSetter);
diff --git a/src/setup/platformSetup/index.website.ts b/src/setup/platformSetup/index.website.ts
index 07917e0e6f650..d6be20e2cf581 100644
--- a/src/setup/platformSetup/index.website.ts
+++ b/src/setup/platformSetup/index.website.ts
@@ -1,4 +1,6 @@
 import {AppRegistry} from 'react-native';
+// This is a polyfill for InternetExplorer to support the modern KeyboardEvent.key and KeyboardEvent.code instead of KeyboardEvent.keyCode
+import 'shim-keyboard-event-key';
 import checkForUpdates from '@libs/checkForUpdates';
 import DateUtils from '@libs/DateUtils';
 import Visibility from '@libs/Visibility';