From b1a6bb9941afa40806ba62f41fbd67725c18cf51 Mon Sep 17 00:00:00 2001
From: Afrisal Yodi Purnama <afrisalyp@gmail.com>
Date: Mon, 22 Jul 2019 20:55:01 +0700
Subject: [PATCH 1/3] Issue-2909 header menu up/down key.

---
 src/shared/components/TopcoderHeader/index.jsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/shared/components/TopcoderHeader/index.jsx b/src/shared/components/TopcoderHeader/index.jsx
index cf6c9727ec..1d4c503dad 100644
--- a/src/shared/components/TopcoderHeader/index.jsx
+++ b/src/shared/components/TopcoderHeader/index.jsx
@@ -240,6 +240,16 @@ export default class TopcoderHeader extends React.Component {
               this.addGlobalTouchListener();
             }
           }}
+          onKeyDown={(event) => {
+            if (event.key === 'ArrowDown') {
+              event.preventDefault();
+              openMenu(item, event.target);
+            }
+            else if (event.key === 'ArrowUp') {
+              event.preventDefault();
+              closeMenu();
+            }
+          }}
           styleName={styleName}
         >
           {item.url ? (

From 2c064486d4d6ab5529492e195136370e3453fbcb Mon Sep 17 00:00:00 2001
From: Afrisal Yodi Purnama <afrisalyp@gmail.com>
Date: Wed, 24 Jul 2019 09:50:34 +0700
Subject: [PATCH 2/3] Fix lint error.

---
 .../components/TopcoderHeader/index.jsx       | 23 +++++++++----------
 1 file changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/shared/components/TopcoderHeader/index.jsx b/src/shared/components/TopcoderHeader/index.jsx
index 1d4c503dad..8f354439f9 100644
--- a/src/shared/components/TopcoderHeader/index.jsx
+++ b/src/shared/components/TopcoderHeader/index.jsx
@@ -219,6 +219,15 @@ export default class TopcoderHeader extends React.Component {
       let styleName = 'main-menu-item';
       if (openedMenu && openedMenu.title === item.title) styleName += ' opened';
       if (item.title === currentNav.menuTitle) styleName += ' current';
+      const onMainMenuKeyDown = (event) => {
+        if (event.key === 'ArrowDown') {
+          event.preventDefault();
+          openMenu(item, event.target);
+        } else if (event.key === 'ArrowUp') {
+          event.preventDefault();
+          closeMenu();
+        }
+      };
       return (
         <li
           key={item.title}
@@ -240,23 +249,13 @@ export default class TopcoderHeader extends React.Component {
               this.addGlobalTouchListener();
             }
           }}
-          onKeyDown={(event) => {
-            if (event.key === 'ArrowDown') {
-              event.preventDefault();
-              openMenu(item, event.target);
-            }
-            else if (event.key === 'ArrowUp') {
-              event.preventDefault();
-              closeMenu();
-            }
-          }}
           styleName={styleName}
         >
           {item.url ? (
-            <Link to={item.url}>
+            <Link to={item.url} onKeyDown={onMainMenuKeyDown}>
               {item.title}
             </Link>
-          ) : <span role="link" tabIndex={0}>{item.title}</span>}
+          ) : <span role="link" tabIndex={0} onKeyDown={onMainMenuKeyDown}>{item.title}</span>}
         </li>
       );
     });

From 4e9f17cecb5b9f04c957cf161564c41e171a13a8 Mon Sep 17 00:00:00 2001
From: Afrisal Yodi Purnama <afrisalyp@gmail.com>
Date: Wed, 24 Jul 2019 11:50:53 +0700
Subject: [PATCH 3/3] Update snapshots.

---
 .../TopcoderHeader/__snapshots__/index.jsx.snap          | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap b/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
index c93ee74e02..dfbae27501 100644
--- a/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
+++ b/__tests__/shared/components/TopcoderHeader/__snapshots__/index.jsx.snap
@@ -31,6 +31,7 @@ exports[`Default render 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >
@@ -45,6 +46,7 @@ exports[`Default render 1`] = `
         onTouchStart={[Function]}
       >
         <Link
+          onKeyDown={[Function]}
           to="https://www.topcoder-dev.com/community/learn"
         >
           Tracks
@@ -58,6 +60,7 @@ exports[`Default render 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >
@@ -307,6 +310,7 @@ exports[`Render with open menu 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >
@@ -321,6 +325,7 @@ exports[`Render with open menu 1`] = `
         onTouchStart={[Function]}
       >
         <Link
+          onKeyDown={[Function]}
           to="https://www.topcoder-dev.com/community/learn"
         >
           Tracks
@@ -334,6 +339,7 @@ exports[`Render with open menu 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >
@@ -594,6 +600,7 @@ exports[`Render with specified profile 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >
@@ -608,6 +615,7 @@ exports[`Render with specified profile 1`] = `
         onTouchStart={[Function]}
       >
         <Link
+          onKeyDown={[Function]}
           to="https://www.topcoder-dev.com/community/learn"
         >
           Tracks
@@ -621,6 +629,7 @@ exports[`Render with specified profile 1`] = `
         onTouchStart={[Function]}
       >
         <span
+          onKeyDown={[Function]}
           role="link"
           tabIndex={0}
         >