From bee22937415a38f8fee6438df49e337294b28bd3 Mon Sep 17 00:00:00 2001
From: Konstantinos Kaloutas <konstantinos@logseq.com>
Date: Mon, 16 Jan 2023 18:40:07 +0200
Subject: [PATCH] fix: auto height

---
 .../src/lib/shapes/TweetShape.tsx              | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/tldraw/apps/tldraw-logseq/src/lib/shapes/TweetShape.tsx b/tldraw/apps/tldraw-logseq/src/lib/shapes/TweetShape.tsx
index a9234a02b..83907482d 100644
--- a/tldraw/apps/tldraw-logseq/src/lib/shapes/TweetShape.tsx
+++ b/tldraw/apps/tldraw-logseq/src/lib/shapes/TweetShape.tsx
@@ -31,7 +31,6 @@ export class TweetShape extends TLBoxShape<TweetShapeProps> {
   canEdit = true
   initialHeightCalculated = true
   getInnerHeight: (() => number) | null = null // will be overridden in the hook
-  ref = React.createRef<HTMLDivElement>()
 
   @computed get embedId() {
     const url = this.props.url
@@ -52,7 +51,18 @@ export class TweetShape extends TLBoxShape<TweetShapeProps> {
 
     const cpRefContainer = React.useRef<HTMLDivElement>(null)
 
-    this.useComponentSize(cpRefContainer, '.twitter-tweet')
+    const [, innerHeight] = this.useComponentSize(cpRefContainer)
+
+    React.useEffect(() => {
+      const latestInnerHeight = this.getInnerHeight?.() ?? innerHeight
+      const newHeight = latestInnerHeight
+      if (innerHeight && Math.abs(newHeight - this.props.size[1]) > 1) {
+        this.update({
+          size: [this.props.size[0], newHeight],
+        })
+        app.persist(true)
+      }
+    }, [innerHeight])
 
     React.useEffect(() => {
       if (!this.initialHeightCalculated) {
@@ -80,7 +90,9 @@ export class TweetShape extends TLBoxShape<TweetShapeProps> {
           }}
         >
           {this.embedId ? (
-              <Tweet tweetId={this.embedId}/>
+              <div ref={cpRefContainer}>
+                <Tweet tweetId={this.embedId}/>
+              </div>
           ) : (null)}
         </div>
       </HTMLContainer>