From 3d647534098bc49dc663b390c4bc9940ce9b437c Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Sat, 30 Jan 2021 02:52:43 +0300
Subject: [PATCH] Refactor #1790

---
 src/components/datascroller/DataScroller.js | 2 +-
 src/components/galleria/Galleria.js         | 2 +-
 src/components/galleria/GalleriaItem.js     | 6 ++++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/datascroller/DataScroller.js b/src/components/datascroller/DataScroller.js
index e497cb9c76..31284b4620 100644
--- a/src/components/datascroller/DataScroller.js
+++ b/src/components/datascroller/DataScroller.js
@@ -195,7 +195,7 @@ export class DataScroller extends Component {
         var header =this.props.header && <div className="p-datascroller-header"> {this.props.header}</div>,
             footer = this.props.footer && <div className="p-datascroller-footer"> {this.props.footer} </div>,
             content = (
-                <div ref={(el) => this.contentElement = ReactDOM.findDOMNode(el)} className="p-datascroller-content" style={{'maxHeight': this.props.scrollHeight}}>
+                <div ref={(el) => this.contentElement = el} className="p-datascroller-content" style={{'maxHeight': this.props.scrollHeight}}>
                     <ul className="p-datascroller-list">
                     {
                         this.state.dataToRender && this.state.dataToRender.map((val, i) => {
diff --git a/src/components/galleria/Galleria.js b/src/components/galleria/Galleria.js
index 10e77d3074..48e6a09f9f 100644
--- a/src/components/galleria/Galleria.js
+++ b/src/components/galleria/Galleria.js
@@ -221,7 +221,7 @@ export class Galleria extends Component {
                 { closeIcon }
                 { header }
                 <div className="p-galleria-content">
-                    <GalleriaItem ref={(el) => this.previewContent = ReactDOM.findDOMNode(el)} value={this.props.value} activeItemIndex={this.activeItemIndex} onActiveItemChange={this.onActiveItemChange}
+                    <GalleriaItem ref={(el) => this.previewContent = el} value={this.props.value} activeItemIndex={this.activeItemIndex} onActiveItemChange={this.onActiveItemChange}
                         itemTemplate={this.props.item} circular={this.props.circular} caption={this.props.caption}
                         showIndicators={this.props.showIndicators} changeItemOnIndicatorHover={this.props.changeItemOnIndicatorHover} indicator={this.props.indicator}
                         showItemNavigators={this.props.showItemNavigators} autoPlay={this.props.autoPlay} slideShowActive={this.state.slideShowActive}
diff --git a/src/components/galleria/GalleriaItem.js b/src/components/galleria/GalleriaItem.js
index 6b80a98725..2abc081b28 100644
--- a/src/components/galleria/GalleriaItem.js
+++ b/src/components/galleria/GalleriaItem.js
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { classNames } from '../utils/ClassNames';
 import { Ripple } from '../ripple/Ripple';
 
-export class GalleriaItem extends Component {
+class GalleriaItemComponent extends Component {
 
     constructor(props) {
         super(props);
@@ -192,7 +192,7 @@ export class GalleriaItem extends Component {
         const indicators = this.renderIndicators();
 
         return (
-            <div className="p-galleria-item-wrapper">
+            <div ref={(el) => {if(this.props.forwardRef) this.props.forwardRef(el)}} className="p-galleria-item-wrapper">
                 <div className="p-galleria-item-container">
                     { backwardNavigator }
                     <div className="p-galleria-item">
@@ -207,3 +207,5 @@ export class GalleriaItem extends Component {
         );
     }
 }
+
+export const GalleriaItem = React.forwardRef((props, ref) => <GalleriaItemComponent forwardRef={ref} {...props}/>);