Merge pull request #2786 from penpot/alotor-fix-text-loop

Fix problem with text hanging the application

frontend/src/app/main/data/workspace/modifiers.cljs

@@ -129,8 +129,8 @@
   (let [auto-width? (= :auto-width (:grow-type shape))
         auto-height? (= :auto-height (:grow-type shape))
 
-        changed-width? (not (mth/close? (:width shape) (:width old-shape)))
-        changed-height? (not (mth/close? (:height shape) (:height old-shape)))
+        changed-width? (> (mth/abs (- (:width shape) (:width old-shape))) 0.1)
+        changed-height? (> (mth/abs (- (:height shape) (:height old-shape))) 0.1)
 
         change-to-fixed? (or (and auto-width? (or changed-height? changed-width?))
                              (and auto-height? changed-height?))]
@@ -262,8 +262,7 @@
         objects
         (-> objects
             (apply-text-modifiers (get state :workspace-text-modifier)))]
-
-    (gsh/set-objects-modifiers  old-modif-tree modif-tree objects ignore-constraints snap-pixel?)))
+    (gsh/set-objects-modifiers old-modif-tree modif-tree objects ignore-constraints snap-pixel?)))
 
 (defn update-modifiers
   ([modif-tree]

frontend/src/app/main/data/workspace/texts.cljs

@@ -396,12 +396,13 @@
   (ptk/reify ::update-text-modifier
     ptk/WatchEvent
     (watch [_ state _]
-      (let [shape (wsh/lookup-shape state id)
+      (let [modifiers (get-in (:workspace-modifiers state) [id :modifiers])
 
-            text-modifier (dm/get-in state [:workspace-text-modifier id])
+            shape (-> (wsh/lookup-shape state id)
+                      (gsh/transform-shape modifiers))
 
-            current-width (or (:width text-modifier) (:width shape))
-            current-height (or (:height text-modifier) (:height shape))]
+            current-width (:width shape)
+            current-height (:height shape)]
         (rx/concat
          (rx/of (update-text-modifier-state id props))
 
@@ -411,7 +412,8 @@
                       (not (mth/close? (:height props) current-height))))
 
            (let [modif-tree (dwm/create-modif-tree [id] (ctm/reflow-modifiers))]
-             (rx/of (dwm/update-modifiers modif-tree)))
+             (->> (rx/of (dwm/update-modifiers modif-tree false true))
+                  (rx/observe-on :async)))
            (rx/empty)))))))
 
 (defn clean-text-modifier

frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs

@@ -26,7 +26,6 @@
    [app.util.object :as obj]
    [app.util.text-editor :as ted]
    [app.util.text-svg-position :as tsp]
-   [app.util.timers :as ts]
    [promesa.core :as p]
    [rumext.v2 :as mf]))
 
@@ -78,27 +77,26 @@
     (st/emit! (dwt/clean-text-modifier id))))
 
 (defn- update-text-modifier
-  [{:keys [grow-type id]} node]
-  (ts/raf
-   #(p/let [position-data (tsp/calc-position-data id)
-            props {:position-data position-data}
+  [{:keys [grow-type id] :as shape} node]
 
-            props
-            (if (contains? #{:auto-height :auto-width} grow-type)
-              (let [{:keys [width height]} (-> (dom/query node ".paragraph-set") (dom/get-client-size))
-                    width (mth/ceil width)
-                    height (mth/ceil height)]
-                (if (and (not (mth/almost-zero? width)) (not (mth/almost-zero? height)))
-                  (cond-> props
-                    (= grow-type :auto-width)
-                    (assoc :width width)
+  (p/let [position-data (tsp/calc-position-data id)
+          props {:position-data position-data}
 
-                    (or (= grow-type :auto-height) (= grow-type :auto-width))
-                    (assoc :height height))
-                  props))
-              props)]
+          props
+          (if (contains? #{:auto-height :auto-width} grow-type)
+            (let [{:keys [width height]} (-> (dom/query node ".paragraph-set") (dom/get-client-size))
+                  width (mth/ceil width)
+                  height (mth/ceil height)]
+              (if (and (not (mth/almost-zero? width)) (not (mth/almost-zero? height)))
+                (cond-> props
+                  (= grow-type :auto-width)
+                  (assoc :width width)
 
-      (st/emit! (dwt/update-text-modifier id props)))))
+                  (or (= grow-type :auto-height) (= grow-type :auto-width))
+                  (assoc :height height))
+                props))
+            props)]
+    (st/emit! (dwt/update-text-modifier id props))))
 
 (mf/defc text-container
   {::mf/wrap-props false
@@ -214,15 +212,15 @@
                            :on-update handle-update-shape}])]))
 
 (mf/defc viewport-text-editing
-  {::mf/wrap-props false}
+  {::mf/wrap-props false
+   ::mf/wrap [mf/memo]}
   [props]
 
   (let [shape   (obj/get props "shape")
 
-        ;; Join current objects with the state of the editor
-        editor-state
-        (-> (mf/deref refs/workspace-editor-state)
-            (get (:id shape)))
+        workspace-editor-state (mf/deref refs/workspace-editor-state)
+
+        editor-state (get workspace-editor-state (:id shape))
 
         text-modifier-ref
         (mf/use-memo (mf/deps (:id shape)) #(refs/workspace-text-modifier-by-id (:id shape)))
@@ -279,7 +277,12 @@
         text-shapes
         (hooks/use-equal-memo text-shapes)
 
-        editing-shape (get text-shapes edition)
+        editing-shape (mf/use-memo
+                       (mf/deps text-shapes edition)
+                       #(get text-shapes edition))
+
+        editing-shape
+        (hooks/use-equal-memo editing-shape)
 
         text-shapes-changes
         (mf/use-memo