From 473ccafee361d20237828383857ddffa01d64c19 Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Tue, 17 May 2022 12:10:15 +0300
Subject: [PATCH] forward ref to MetaRow

---
 src/common/MetaRow/MetaRow.js                             | 8 +++++---
 .../MetaRow/MetaRowPlaceholder/MetaRowPlaceholder.js      | 8 +++++---
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/common/MetaRow/MetaRow.js b/src/common/MetaRow/MetaRow.js
index 512a39983..207aea15d 100644
--- a/src/common/MetaRow/MetaRow.js
+++ b/src/common/MetaRow/MetaRow.js
@@ -10,9 +10,9 @@ const CONSTANTS = require('stremio/common/CONSTANTS');
 const MetaRowPlaceholder = require('./MetaRowPlaceholder');
 const styles = require('./styles');
 
-const MetaRow = ({ className, title, message, items, itemComponent, deepLinks, ...props }) => {
+const MetaRow = React.forwardRef(({ className, title, message, items, itemComponent, deepLinks, ...props }, ref) => {
     return (
-        <div {...props} className={classnames(className, styles['meta-row-container'])}>
+        <div {...props} ref={ref} className={classnames(className, styles['meta-row-container'])}>
             {
                 (typeof title === 'string' && title.length > 0) || (deepLinks && (typeof deepLinks.discover === 'string' || typeof deepLinks.library === 'string')) ?
                     <div className={styles['header-container']}>
@@ -59,7 +59,9 @@ const MetaRow = ({ className, title, message, items, itemComponent, deepLinks, .
             }
         </div>
     );
-};
+});
+
+MetaRow.displayName = 'MetaRow';
 
 MetaRow.Placeholder = MetaRowPlaceholder;
 
diff --git a/src/common/MetaRow/MetaRowPlaceholder/MetaRowPlaceholder.js b/src/common/MetaRow/MetaRowPlaceholder/MetaRowPlaceholder.js
index 53012d3ca..3b008ea9e 100644
--- a/src/common/MetaRow/MetaRowPlaceholder/MetaRowPlaceholder.js
+++ b/src/common/MetaRow/MetaRowPlaceholder/MetaRowPlaceholder.js
@@ -8,9 +8,9 @@ const Button = require('stremio/common/Button');
 const CONSTANTS = require('stremio/common/CONSTANTS');
 const styles = require('./styles');
 
-const MetaRowPlaceholder = ({ className, title, deepLinks, ...props }) => {
+const MetaRowPlaceholder = React.forwardRef(({ className, title, deepLinks, ...props }, ref) => {
     return (
-        <div {...props} className={classnames(className, styles['meta-row-placeholder-container'])}>
+        <div {...props} ref={ref} className={classnames(className, styles['meta-row-placeholder-container'])}>
             <div className={styles['header-container']}>
                 <div className={styles['title-container']} title={typeof title === 'string' && title.length > 0 ? title : null}>
                     {typeof title === 'string' && title.length > 0 ? title : null}
@@ -37,7 +37,9 @@ const MetaRowPlaceholder = ({ className, title, deepLinks, ...props }) => {
             </div>
         </div>
     );
-};
+});
+
+MetaRowPlaceholder.displayName = 'MetaRowPlaceholder';
 
 MetaRowPlaceholder.propTypes = {
     className: PropTypes.string,