diff --git a/src/common/MetaItem/MetaItem.js b/src/common/MetaItem/MetaItem.js
index 13e090e8a..b8af7e582 100644
--- a/src/common/MetaItem/MetaItem.js
+++ b/src/common/MetaItem/MetaItem.js
@@ -14,7 +14,7 @@ const ICON_FOR_TYPE = Object.assign(Object.create(null), {
     'tv': 'ic_tv'
 });
 
-const MetaItem = React.memo(({ className, menuClassName, id, type, name, posterShape = 'square', poster, title, subtitle, progress, playIcon, menuOptions, onClick, menuOptionOnSelect }) => {
+const MetaItem = React.memo(({ className, id, type, name, posterShape = 'square', poster = '', title = '', subtitle = '', progress = 0, playIcon = false, menuOptions = [], onClick, menuOptionOnSelect }) => {
     const menuRef = React.useRef(null);
     const [menuOpen, onMenuOpen, onMenuClose] = useBinaryState(false);
     const onContextMenu = React.useCallback((event) => {
@@ -76,12 +76,16 @@ const MetaItem = React.memo(({ className, menuClassName, id, type, name, posterS
                                 Array.isArray(menuOptions) && menuOptions.length > 0 ?
                                     <Popup ref={menuRef} onOpen={onMenuOpen} onClose={onMenuClose}>
                                         <Popup.Label>
-                                            <Icon className={classnames(styles['menu-icon'], { 'active': menuOpen })} icon={'ic_more'} />
+                                            <Button className={classnames(styles['menu-button-container'], { 'active': menuOpen })} tabIndex={-1}>
+                                                <Icon className={styles['menu-icon']} icon={'ic_more'} />
+                                            </Button>
                                         </Popup.Label>
-                                        <Popup.Menu className={classnames(menuClassName, styles['menu-container'])} tabIndex={-1}>
-                                            <div className={styles['menu-items-container']}>
+                                        <Popup.Menu>
+                                            <div className={styles['menu-buttons-container']}>
                                                 {menuOptions.map(({ label, type }) => (
-                                                    <Button key={type} className={styles['menu-item']} data-id={id} data-type={type} onClick={menuOptionOnSelect}>{label}</Button>
+                                                    <Button key={type} className={styles['menu-button']} data-id={id} data-type={type} onClick={menuOptionOnSelect}>
+                                                        {label}
+                                                    </Button>
                                                 ))}
                                             </div>
                                         </Popup.Menu>
@@ -110,7 +114,6 @@ MetaItem.displayName = 'MetaItem';
 
 MetaItem.propTypes = {
     className: PropTypes.string,
-    menuClassName: PropTypes.string,
     id: PropTypes.string,
     type: PropTypes.string,
     name: PropTypes.string,
diff --git a/src/common/MetaItem/styles.less b/src/common/MetaItem/styles.less
index 9241a8596..16af7047c 100644
--- a/src/common/MetaItem/styles.less
+++ b/src/common/MetaItem/styles.less
@@ -11,8 +11,10 @@
                 color: var(--color-backgrounddarker);
             }
 
-            .menu-icon {
-                fill: var(--color-backgrounddarker);
+            .menu-button-container {
+                .menu-icon {
+                    fill: var(--color-backgrounddarker);
+                }
             }
         }
     }
@@ -136,37 +138,39 @@
             }
         }
 
-        .menu-icon {
+        .menu-button-container {
             flex: none;
-            display: block;
             width: 2.5rem;
             height: 2.5rem;
             padding: 0.6rem;
-            fill: var(--color-surfacelighter);
 
             &:hover, &:global(.active) {
                 background-color: var(--color-surface80);
             }
+
+            .menu-icon {
+                display: block;
+                width: 100%;
+                height: 100%;
+                fill: var(--color-surfacelighter);
+            }
         }
     }
 }
 
-.menu-container {
-    .menu-items-container {
-        min-width: 8em;
-        max-width: 12em;
-        background-color: var(--color-surfacelighter);
+.menu-buttons-container {
+    min-width: 8rem;
+    max-width: 12rem;
+    background-color: var(--color-surfacelighter);
 
-        .menu-item {
-            width: 100%;
-            font-size: 1.2em;
-            padding: 0.5em;
-            color: var(--color-backgrounddarker);
-            cursor: pointer;
+    .menu-button {
+        font-size: 1.1rem;
+        padding: 0.5rem;
+        color: var(--color-backgrounddarker);
+        outline: none;
 
-            &:hover, &:focus {
-                background-color: var(--color-surfacelight);
-            }
+        &:hover, &:focus {
+            background-color: var(--color-surfacelight);
         }
     }
 }
\ No newline at end of file