From 38db1f08f8bcf19c2f2e521c59e8adc0bfc24a82 Mon Sep 17 00:00:00 2001
From: peter <pmargaritoff@gmail.com>
Date: Fri, 13 Nov 2020 12:33:21 -0500
Subject: [PATCH] fix: updates refs to createerf

---
 src/components/TwitterDMButton.js      | 5 +++--
 src/components/TwitterFollowButton.js  | 5 +++--
 src/components/TwitterHashtagButton.js | 5 +++--
 src/components/TwitterMentionButton.js | 5 +++--
 src/components/TwitterMomentShare.js   | 5 +++--
 src/components/TwitterOnAirButton.js   | 5 +++--
 src/components/TwitterShareButton.js   | 5 +++--
 src/components/TwitterTimelineEmbed.js | 7 ++++---
 src/components/TwitterTweetEmbed.js    | 5 +++--
 src/components/TwitterVideoEmbed.js    | 5 +++--
 src/stories/index.js                   | 1 -
 11 files changed, 31 insertions(+), 22 deletions(-)

diff --git a/src/components/TwitterDMButton.js b/src/components/TwitterDMButton.js
index 26cc65d..d7814b8 100644
--- a/src/components/TwitterDMButton.js
+++ b/src/components/TwitterDMButton.js
@@ -28,6 +28,7 @@ export default class TwitterDMButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterDMButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createDMButton(
             this.props.id,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterDMButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterFollowButton.js b/src/components/TwitterFollowButton.js
index 50cd913..1f5ca35 100644
--- a/src/components/TwitterFollowButton.js
+++ b/src/components/TwitterFollowButton.js
@@ -28,6 +28,7 @@ export default class TwitterFollowButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterFollowButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createFollowButton(
             this.props.screenName,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterFollowButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterHashtagButton.js b/src/components/TwitterHashtagButton.js
index 054eb21..714a528 100644
--- a/src/components/TwitterHashtagButton.js
+++ b/src/components/TwitterHashtagButton.js
@@ -28,6 +28,7 @@ export default class TwitterHashtagButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterHashtagButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createHashtagButton(
             this.props.tag,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterHashtagButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterMentionButton.js b/src/components/TwitterMentionButton.js
index 6414cdf..41f48a5 100644
--- a/src/components/TwitterMentionButton.js
+++ b/src/components/TwitterMentionButton.js
@@ -28,6 +28,7 @@ export default class TwitterMentionButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterMentionButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createMentionButton(
             this.props.screenName,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterMentionButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterMomentShare.js b/src/components/TwitterMomentShare.js
index caf68bb..18f850a 100644
--- a/src/components/TwitterMomentShare.js
+++ b/src/components/TwitterMomentShare.js
@@ -28,6 +28,7 @@ export default class TwitterMomentShare extends Component {
     this.state = {
       isLoading: true
     }
+    this.shareMoment = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterMomentShare extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createMoment(
             this.props.momentId,
-            this.refs.shareMoment,
+            this.shareMoment.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterMomentShare extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='shareMoment' />
+        <div ref={this.shareMoment} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterOnAirButton.js b/src/components/TwitterOnAirButton.js
index 28f05ee..8daf2bc 100644
--- a/src/components/TwitterOnAirButton.js
+++ b/src/components/TwitterOnAirButton.js
@@ -28,6 +28,7 @@ export default class TwitterOnAirButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -43,7 +44,7 @@ export default class TwitterOnAirButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createPeriscopeOnAirButton(
             this.props.username,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -68,7 +69,7 @@ export default class TwitterOnAirButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterShareButton.js b/src/components/TwitterShareButton.js
index f27e9a3..3c37f80 100644
--- a/src/components/TwitterShareButton.js
+++ b/src/components/TwitterShareButton.js
@@ -29,6 +29,7 @@ export default class TwitterShareButton extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -44,7 +45,7 @@ export default class TwitterShareButton extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createShareButton(
             this.props.url,
-            this.refs.embedContainer,
+            this.embedContainer.current,
             this.props.options
           ).then((element) => {
             this.setState({
@@ -69,7 +70,7 @@ export default class TwitterShareButton extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterTimelineEmbed.js b/src/components/TwitterTimelineEmbed.js
index f70ce3f..ac183bd 100644
--- a/src/components/TwitterTimelineEmbed.js
+++ b/src/components/TwitterTimelineEmbed.js
@@ -100,6 +100,7 @@ export default class TwitterTimelineEmbed extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   buildChromeOptions(options) {
@@ -119,7 +120,7 @@ export default class TwitterTimelineEmbed extends Component {
 
   buildOptions() {
     let options = Object.assign({}, this.props.options)
-    if (this.props.autoHeight) { options.height = this.refs.embedContainer.parentNode.offsetHeight }
+    if (this.props.autoHeight) { options.height = this.embedContainer.parentNode.offsetHeight }
 
     options = Object.assign({}, options, {
       theme: this.props.theme,
@@ -144,7 +145,7 @@ export default class TwitterTimelineEmbed extends Component {
           id: this.props.id || this.props.widgetId,
           url: this.props.url
         },
-        this.refs.embedContainer,
+        this.embedContainer.current,
         options
       ).then((element) => {
         this.setState({
@@ -184,7 +185,7 @@ export default class TwitterTimelineEmbed extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterTweetEmbed.js b/src/components/TwitterTweetEmbed.js
index b88d293..d34f321 100644
--- a/src/components/TwitterTweetEmbed.js
+++ b/src/components/TwitterTweetEmbed.js
@@ -28,6 +28,7 @@ export default class TwitterTweetEmbed extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   renderWidget() {
@@ -39,7 +40,7 @@ export default class TwitterTweetEmbed extends Component {
     if (!this.isMountCanceled) {
       window.twttr.widgets.createTweet(
         this.props.tweetId,
-        this.refs.embedContainer,
+        this.embedContainer.current,
         this.props.options
       ).then((element) => {
         this.setState({
@@ -71,7 +72,7 @@ export default class TwitterTweetEmbed extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/components/TwitterVideoEmbed.js b/src/components/TwitterVideoEmbed.js
index e038157..b7fcead 100644
--- a/src/components/TwitterVideoEmbed.js
+++ b/src/components/TwitterVideoEmbed.js
@@ -24,6 +24,7 @@ export default class TwitterVideoEmbed extends Component {
     this.state = {
       isLoading: true
     }
+    this.embedContainer = React.createRef()
   }
 
   componentDidMount() {
@@ -38,7 +39,7 @@ export default class TwitterVideoEmbed extends Component {
         if (!this.isMountCanceled) {
           window.twttr.widgets.createVideo(
             this.props.id,
-            this.refs.embedContainer
+            this.embedContainer.current
           ).then((element) => {
             this.setState({
               isLoading: false
@@ -62,7 +63,7 @@ export default class TwitterVideoEmbed extends Component {
     return (
       <React.Fragment>
         {isLoading && placeholder}
-        <div ref='embedContainer' />
+        <div ref={this.embedContainer} />
       </React.Fragment>
     )
   }
diff --git a/src/stories/index.js b/src/stories/index.js
index ddac297..123e9ad 100644
--- a/src/stories/index.js
+++ b/src/stories/index.js
@@ -635,7 +635,6 @@ storiesOf('Twitter Timeline Embed', module)
     ))
   )
 
-
 storiesOf('Twitter Share button', module)
   .add(
     'Share button',