diff --git a/src/components/Topics.js b/src/components/Topics.js index d420e2a7..2d8e42ee 100644 --- a/src/components/Topics.js +++ b/src/components/Topics.js @@ -1,4 +1,4 @@ -import React, { useContext } from 'react'; +import React, { useCallback, useContext } from 'react'; import styled from 'styled-components'; import FilterContext from '../context/FilterContext'; import * as icons from '../util/icons'; @@ -8,6 +8,15 @@ export default function Topics() { FilterContext ); + const handleKeyDown = useCallback( + tagName => e => { + if (e.keyCode === 13) { + setCurrentTag(tagName); + } + }, + [setCurrentTag] + ); + return ( {tags.map(tag => ( @@ -16,6 +25,8 @@ export default function Topics() { htmlFor={`filter-${tag.name}`} key={`filter-${tag.name}`} clickable + onKeyDown={handleKeyDown(tag.name)} + tabIndex="0" >