feat #142: Rename connection shortcut (#143)

* bind "f2" to "rename" for default keybinds

* implement rename keydown event

---------

Co-authored-by: hendra-sadewa <hendra@stockbit.com>

Author: Hendra Sadewa

src/renderer/contexts/KeyBindingProvider.tsx

@@ -5,6 +5,7 @@ const defaultKeybinding = {
   'run-query': new KeyMatcher({ key: 'F9' }),
   'run-current-query': new KeyMatcher({ key: 'F9', ctrl: true }),
   'save-query': new KeyMatcher({ key: 's', ctrl: true }),
+  rename: new KeyMatcher({ key: 'F2' }),
 };
 
 const KeyBindingContext = createContext({ binding: defaultKeybinding });

src/renderer/screens/HomeScreen/index.tsx

@@ -19,6 +19,7 @@ import useConnectionContextMenu from './useConnectionContextMenu';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faCircleDot } from '@fortawesome/free-solid-svg-icons';
 import ListViewEmptyState from 'renderer/components/ListView/ListViewEmptyState';
+import { useKeybinding } from 'renderer/contexts/KeyBindingProvider';
 
 const WELCOME_SCREEN_ID = '00000000000000000000';
 
@@ -57,6 +58,9 @@ export default function HomeScreen() {
     initialCollapsed
   );
 
+  const { binding } = useKeybinding();
+  const keyRenaming = binding['rename'];
+
   useEffect(() => {
     setSelectedItemChanged(selectedItem?.data?.config);
   }, [selectedItem, setSelectedItemChanged]);
@@ -201,7 +205,15 @@ export default function HomeScreen() {
         secondaryInitialSize={300}
         primaryMinSize={500}
       >
-        <div className={styles.connectionList}>
+        <div
+          className={styles.connectionList}
+          onKeyDown={e => {
+            if (keyRenaming.match(e)) {
+              setRenameSelectedItem(true);
+            }
+          }}
+          tabIndex={0}
+        >
           {/* <Layout>
             <Layout.Grow> */}
           <TreeView