[Web Console] fix deprecated keyboard event method "keyCode" with "key" (#11947)

* 11946 fix keyboard event keyCode method

* fix with key and respective cases

* e.which method required since it's anyway deprecated too.

* updated as per feedback

web-console/src/bootstrap/react-table-custom-pagination.tsx

@@ -123,7 +123,7 @@ export class ReactTableCustomPagination extends React.PureComponent<
                   value={tempPage || String(page + 1)}
                   onBlur={this.applyTempPage}
                   onKeyPress={e => {
-                    if (e.which === 13 || e.keyCode === 13) {
+                    if (e.key === 'Enter') {
                       this.applyTempPage(e);
                     }
                   }}

web-console/src/entry.ts

@@ -108,7 +108,7 @@ ReactDOM.render(
 let mode: 'mouse' | 'tab' = 'mouse';
 
 function handleTab(e: KeyboardEvent) {
-  if (e.keyCode !== 9) return;
+  if (e.key !== 'Tab') return;
   if (mode === 'tab') return;
   mode = 'tab';
   document.body.classList.remove('mouse-mode');

web-console/src/views/query-view/query-output/column-rename-input/column-rename-input.tsx

@@ -44,12 +44,12 @@ export const ColumnRenameInput = React.memo(function ColumnRenameInput(
       value={newName}
       onChange={(e: any) => setNewName(e.target.value)}
       onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {
-        switch (e.keyCode) {
-          case 13: // Enter
+        switch (e.key) {
+          case 'Enter':
             maybeDone();
             break;
 
-          case 27: // Esc
+          case 'Escape':
             onDone();
             break;
         }