From fb4466337db1d476b48e01d24f92f545062b7442 Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Wed, 10 Jan 2024 16:32:15 +0530
Subject: [PATCH 1/5] migrate KeyboardShortcutsPage to TS

---
 ...tcutsPage.js => KeyboardShortcutsPage.tsx} | 25 +++++++++++--------
 1 file changed, 14 insertions(+), 11 deletions(-)
 rename src/pages/{KeyboardShortcutsPage.js => KeyboardShortcutsPage.tsx} (71%)

diff --git a/src/pages/KeyboardShortcutsPage.js b/src/pages/KeyboardShortcutsPage.tsx
similarity index 71%
rename from src/pages/KeyboardShortcutsPage.js
rename to src/pages/KeyboardShortcutsPage.tsx
index 809d2ce6dc07..b2a3df69bc18 100644
--- a/src/pages/KeyboardShortcutsPage.js
+++ b/src/pages/KeyboardShortcutsPage.tsx
@@ -1,11 +1,12 @@
 import React from 'react';
 import {ScrollView, View} from 'react-native';
-import _ from 'underscore';
+import {isEmpty, chain} from 'lodash';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import MenuItem from '@components/MenuItem';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import type {TranslationPaths} from '@src/languages/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import KeyboardShortcut from '@libs/KeyboardShortcut';
 import CONST from '@src/CONST';
@@ -13,8 +14,8 @@ import CONST from '@src/CONST';
 function KeyboardShortcutsPage() {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
-    const shortcuts = _.chain(CONST.KEYBOARD_SHORTCUTS)
-        .filter((shortcut) => !_.isEmpty(shortcut.descriptionKey))
+    const shortcuts = chain(CONST.KEYBOARD_SHORTCUTS)
+        .filter((shortcut) => !isEmpty(shortcut.descriptionKey))
         .map((shortcut) => {
             const platformAdjustedModifiers = KeyboardShortcut.getPlatformEquivalentForKeys(shortcut.modifiers);
             return {
@@ -24,18 +25,20 @@ function KeyboardShortcutsPage() {
         })
         .value();
 
+    type Shortcut = {
+        displayName: string;
+        descriptionKey: string | null; // Update the type to allow for null values
+    };
     /**
      * Render the information of a single shortcut
-     * @param {Object} shortcut
-     * @param {String} shortcut.displayName
-     * @param {String} shortcut.descriptionKey
-     * @returns {React.Component}
+     * @param shortcut - The shortcut to render
+     * @returns
      */
-    const renderShortcut = (shortcut) => (
+    const renderShortcut = (shortcut: Shortcut) => (
         <MenuItem
             key={shortcut.displayName}
             title={shortcut.displayName}
-            description={translate(`keyboardShortcutsPage.shortcuts.${shortcut.descriptionKey}`)}
+            description={translate(`keyboardShortcutsPage.shortcuts.${shortcut.descriptionKey}` as TranslationPaths)}
             wrapperStyle={[styles.ph0, styles.cursorAuto]}
             interactive={false}
         />
@@ -49,8 +52,8 @@ function KeyboardShortcutsPage() {
             <HeaderWithBackButton title={translate('keyboardShortcutsPage.title')} />
             <ScrollView contentContainerStyle={styles.flexGrow1}>
                 <View style={[styles.ph5, styles.pv3]}>
-                    <Text style={[styles.mb3, styles.baseFontStyle]}>{translate('keyboardShortcutsPage.subtitle')}</Text>
-                    {_.map(shortcuts, renderShortcut)}
+                    <Text style={[styles.mb3, styles.webViewStyles.baseFontStyle]}>{translate('keyboardShortcutsPage.subtitle')}</Text>
+                    {shortcuts.map(renderShortcut)}
                 </View>
             </ScrollView>
         </ScreenWrapper>

From dead59f19d113cd6a1615ea0dcc250062ebd0445 Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Wed, 10 Jan 2024 16:41:23 +0530
Subject: [PATCH 2/5] fix for js docs return type

---
 src/pages/KeyboardShortcutsPage.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/KeyboardShortcutsPage.tsx b/src/pages/KeyboardShortcutsPage.tsx
index b2a3df69bc18..7449edb9f92e 100644
--- a/src/pages/KeyboardShortcutsPage.tsx
+++ b/src/pages/KeyboardShortcutsPage.tsx
@@ -32,7 +32,6 @@ function KeyboardShortcutsPage() {
     /**
      * Render the information of a single shortcut
      * @param shortcut - The shortcut to render
-     * @returns
      */
     const renderShortcut = (shortcut: Shortcut) => (
         <MenuItem

From 5041ea0f6ab3de3c2af686ba3b270573ff8a1ab4 Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Wed, 10 Jan 2024 17:01:32 +0530
Subject: [PATCH 3/5] prettier

---
 src/pages/KeyboardShortcutsPage.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/KeyboardShortcutsPage.tsx b/src/pages/KeyboardShortcutsPage.tsx
index 7449edb9f92e..4432ba63c845 100644
--- a/src/pages/KeyboardShortcutsPage.tsx
+++ b/src/pages/KeyboardShortcutsPage.tsx
@@ -1,15 +1,15 @@
+import {chain, isEmpty} from 'lodash';
 import React from 'react';
 import {ScrollView, View} from 'react-native';
-import {isEmpty, chain} from 'lodash';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import MenuItem from '@components/MenuItem';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
-import type {TranslationPaths} from '@src/languages/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import KeyboardShortcut from '@libs/KeyboardShortcut';
 import CONST from '@src/CONST';
+import type {TranslationPaths} from '@src/languages/types';
 
 function KeyboardShortcutsPage() {
     const styles = useThemeStyles();

From 325073d24eff929ff5d6795f89f0b3e450fdaa91 Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Wed, 10 Jan 2024 18:55:42 +0530
Subject: [PATCH 4/5] added requested changes

---
 src/pages/KeyboardShortcutsPage.tsx | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/pages/KeyboardShortcutsPage.tsx b/src/pages/KeyboardShortcutsPage.tsx
index 4432ba63c845..d48508e2bf62 100644
--- a/src/pages/KeyboardShortcutsPage.tsx
+++ b/src/pages/KeyboardShortcutsPage.tsx
@@ -1,4 +1,3 @@
-import {chain, isEmpty} from 'lodash';
 import React from 'react';
 import {ScrollView, View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -14,20 +13,19 @@ import type {TranslationPaths} from '@src/languages/types';
 function KeyboardShortcutsPage() {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
-    const shortcuts = chain(CONST.KEYBOARD_SHORTCUTS)
-        .filter((shortcut) => !isEmpty(shortcut.descriptionKey))
+    const shortcuts = Object.values(CONST.KEYBOARD_SHORTCUTS)
+        .filter((shortcut) => shortcut.descriptionKey !== undefined && shortcut.descriptionKey !== null)
         .map((shortcut) => {
             const platformAdjustedModifiers = KeyboardShortcut.getPlatformEquivalentForKeys(shortcut.modifiers);
             return {
                 displayName: KeyboardShortcut.getDisplayName(shortcut.shortcutKey, platformAdjustedModifiers),
                 descriptionKey: shortcut.descriptionKey,
             };
-        })
-        .value();
+        });
 
     type Shortcut = {
         displayName: string;
-        descriptionKey: string | null; // Update the type to allow for null values
+        descriptionKey: string | null;
     };
     /**
      * Render the information of a single shortcut

From 1b22ed27b8fcc37acb3827bfe2e09293320a98ae Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Wed, 10 Jan 2024 19:33:52 +0530
Subject: [PATCH 5/5] added requested changes

---
 src/pages/KeyboardShortcutsPage.tsx | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/pages/KeyboardShortcutsPage.tsx b/src/pages/KeyboardShortcutsPage.tsx
index d48508e2bf62..9b70defbf8af 100644
--- a/src/pages/KeyboardShortcutsPage.tsx
+++ b/src/pages/KeyboardShortcutsPage.tsx
@@ -8,25 +8,24 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import KeyboardShortcut from '@libs/KeyboardShortcut';
 import CONST from '@src/CONST';
-import type {TranslationPaths} from '@src/languages/types';
+
+type Shortcut = {
+    displayName: string;
+    descriptionKey: 'search' | 'newChat' | 'openShortcutDialog' | 'escape' | 'copy';
+};
 
 function KeyboardShortcutsPage() {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
     const shortcuts = Object.values(CONST.KEYBOARD_SHORTCUTS)
-        .filter((shortcut) => shortcut.descriptionKey !== undefined && shortcut.descriptionKey !== null)
         .map((shortcut) => {
             const platformAdjustedModifiers = KeyboardShortcut.getPlatformEquivalentForKeys(shortcut.modifiers);
             return {
                 displayName: KeyboardShortcut.getDisplayName(shortcut.shortcutKey, platformAdjustedModifiers),
                 descriptionKey: shortcut.descriptionKey,
             };
-        });
-
-    type Shortcut = {
-        displayName: string;
-        descriptionKey: string | null;
-    };
+        })
+        .filter((shortcut): shortcut is Shortcut => !!shortcut.descriptionKey);
     /**
      * Render the information of a single shortcut
      * @param shortcut - The shortcut to render
@@ -35,7 +34,7 @@ function KeyboardShortcutsPage() {
         <MenuItem
             key={shortcut.displayName}
             title={shortcut.displayName}
-            description={translate(`keyboardShortcutsPage.shortcuts.${shortcut.descriptionKey}` as TranslationPaths)}
+            description={translate(`keyboardShortcutsPage.shortcuts.${shortcut.descriptionKey}`)}
             wrapperStyle={[styles.ph0, styles.cursorAuto]}
             interactive={false}
         />