diff --git a/src/routes/Addons/Addon/Addon.js b/src/routes/Addons/Addon/Addon.js
index 4d70be4f7..496a27168 100644
--- a/src/routes/Addons/Addon/Addon.js
+++ b/src/routes/Addons/Addon/Addon.js
@@ -2,13 +2,17 @@ const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
 const Icon = require('stremio-icons/dom');
-const { Button, useTabIndex } = require('stremio/common');
+const { Button } = require('stremio/common');
 const styles = require('./styles');
 
 const Addon = ({ className, id, name, logo, description, types, version, transportUrl, installed, toggle }) => {
-    const tabIndex = useTabIndex();
+    const onKeyUp = React.useCallback((event) => {
+        if (event.key === 'Enter' && typeof toggle === 'function') {
+            toggle(event);
+        }
+    }, [toggle]);
     return (
-        <div className={classnames(styles['addon-container'], className)} tabIndex={tabIndex} data-id={id}>
+        <Button className={classnames(styles['addon-container'], className)} data-id={id} onKeyUp={onKeyUp}>
             <div className={styles['logo-container']}>
                 {
                     typeof logo === 'string' && logo.length > 0 ?
@@ -56,7 +60,7 @@ const Addon = ({ className, id, name, logo, description, types, version, transpo
                     <div className={styles['label']}>Share addon</div>
                 </Button>
             </div>
-        </div>
+        </Button>
     );
 };
 
diff --git a/src/routes/Addons/Addon/styles.less b/src/routes/Addons/Addon/styles.less
index f51036aa5..8d634928f 100644
--- a/src/routes/Addons/Addon/styles.less
+++ b/src/routes/Addons/Addon/styles.less
@@ -5,6 +5,7 @@
     align-items: flex-start;
     padding: 1rem;
     background-color: var(--color-backgroundlighter);
+    cursor: inherit;
 
     .logo-container {
         flex: none;