From 7b53c99482354d766db690cc662f626ecaf8b301 Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Thu, 2 Apr 2026 23:02:07 +0000 Subject: [PATCH] :recycle: Convert workspace shapes/text components to * suffix (Batch 3) Migrate ::mf/wrap-props false components in shapes/text/: - editor.cljs: text-shape-edit-html* (forward-ref), text-editor-svg* (block-component and selection-component kept as-is, used by DraftJS internals) - v3_editor.cljs: text-editor* - viewport_texts_html.cljs: text-container*, text-changes-renderer*, text-modifiers-renderer*, viewport-text-editing*, viewport-texts* (viewport-texts* preserves custom check-props memo wrap) - Update call sites in viewport.cljs and viewport_wasm.cljs --- .../main/ui/workspace/shapes/text/editor.cljs | 12 ++- .../ui/workspace/shapes/text/v3_editor.cljs | 9 +-- .../shapes/text/viewport_texts_html.cljs | 75 +++++++------------ .../src/app/main/ui/workspace/viewport.cljs | 6 +- .../app/main/ui/workspace/viewport_wasm.cljs | 10 +-- 5 files changed, 45 insertions(+), 67 deletions(-) diff --git a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs index 616cd17b98..3f05d5c1ab 100644 --- a/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/text/editor.cljs @@ -95,12 +95,11 @@ "bottom" "flex-end" nil)) -(mf/defc text-shape-edit-html +(mf/defc text-shape-edit-html* {::mf/wrap [mf/memo] - ::mf/wrap-props false ::mf/forward-ref true} - [props _] - (let [{:keys [id content] :as shape} (obj/get props "shape") + [{:keys [shape]} _] + (let [{:keys [id content]} shape state-map (mf/deref refs/workspace-editor-state) state (get state-map id empty-editor-state) @@ -269,8 +268,7 @@ (-> (gpt/subtract pt box) (gpt/multiply zoom))))) -(mf/defc text-editor-svg - {::mf/wrap-props false} +(mf/defc text-editor-svg* [{:keys [shape modifiers]}] (let [shape-id (dm/get-prop shape :id) modifiers (dm/get-in modifiers [shape-id :modifiers]) @@ -343,6 +341,6 @@ [:foreignObject {:x x :y y :width width :height height} [:div {:style style} - [:& text-shape-edit-html + [:> text-shape-edit-html* {:shape shape :key (dm/str shape-id)}]]]])) diff --git a/frontend/src/app/main/ui/workspace/shapes/text/v3_editor.cljs b/frontend/src/app/main/ui/workspace/shapes/text/v3_editor.cljs index 8a2138bb99..42c0e301cf 100644 --- a/frontend/src/app/main/ui/workspace/shapes/text/v3_editor.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/text/v3_editor.cljs @@ -17,7 +17,6 @@ [app.render-wasm.api :as wasm.api] [app.render-wasm.text-editor :as text-editor] [app.util.dom :as dom] - [app.util.object :as obj] [cuerdas.core :as str] [rumext.v2 :as mf])) @@ -40,12 +39,10 @@ (if (>= (count lang) 3) (str/capital lang) (str/upper lang))) "Noto Color Emoji")) -(mf/defc text-editor +(mf/defc text-editor* "Contenteditable element positioned over the text shape to capture input events." - {::mf/wrap-props false} - [props] - (let [shape (obj/get props "shape") - shape-id (dm/get-prop shape :id) + [{:keys [shape]}] + (let [shape-id (dm/get-prop shape :id) clip-id (dm/str "text-edition-clip" shape-id) diff --git a/frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs b/frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs index fda9e4e911..2ad157e4f4 100644 --- a/frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/text/viewport_texts_html.cljs @@ -23,7 +23,6 @@ [app.main.ui.hooks :as hooks] [app.main.ui.shapes.text.html-text :as html] [app.util.dom :as dom] - [app.util.object :as obj] [app.util.text-editor :as ted] [app.util.text-svg-position :as tsp] [app.util.text.content :as content] @@ -116,14 +115,10 @@ props)))) (p/fmap #(st/emit! (dwt/update-text-modifier id %))))) -(mf/defc text-container - {::mf/wrap-props false - ::mf/wrap [mf/memo]} - [props] - (let [shape (obj/get props "shape") - on-update (obj/get props "on-update") - - handle-update +(mf/defc text-container* + {::mf/wrap [mf/memo]} + [{:keys [shape on-update]}] + (let [handle-update (mf/use-callback (mf/deps shape on-update) (fn [node] @@ -147,12 +142,9 @@ (mth/close? (dm/get-prop shape :width) (dm/get-prop other :width)) (mth/close? (dm/get-prop shape :height) (dm/get-prop other :height))))) -(mf/defc text-changes-renderer - {::mf/wrap-props false} - [props] - (let [text-shapes (unchecked-get props "text-shapes") - - prev-text-shapes (hooks/use-previous text-shapes) +(mf/defc text-changes-renderer* + [{:keys [text-shapes]}] + (let [prev-text-shapes (hooks/use-previous text-shapes) ;; We store in the state the texts still pending to be calculated so we can ;; get its position @@ -191,15 +183,13 @@ [:.text-changes-renderer (for [{:keys [id] :as shape} changed-texts] - [:& text-container {:key (dm/str "text-container-" id) - :shape shape - :on-update handle-update-shape}])])) + [:> text-container* {:key (dm/str "text-container-" id) + :shape shape + :on-update handle-update-shape}])])) -(mf/defc text-modifiers-renderer - {::mf/wrap-props false} - [props] - (let [text-shapes (-> (obj/get props "text-shapes") - (update-vals fix-position)) +(mf/defc text-modifiers-renderer* + [{:keys [text-shapes]}] + (let [text-shapes (update-vals text-shapes fix-position) prev-text-shapes (hooks/use-previous text-shapes) @@ -223,16 +213,14 @@ [:.text-changes-renderer (for [{:keys [id] :as shape} changed-texts] - [:& text-container {:key (dm/str "text-container-" id) - :shape shape - :on-update handle-update-shape}])])) + [:> text-container* {:key (dm/str "text-container-" id) + :shape shape + :on-update handle-update-shape}])])) -(mf/defc viewport-text-editing - {::mf/wrap-props false - ::mf/wrap [mf/memo]} - [props] - (let [shape (obj/get props "shape") - shape-id (:id shape) +(mf/defc viewport-text-editing* + {::mf/wrap [mf/memo]} + [{:keys [shape]}] + (let [shape-id (:id shape) workspace-editor-state (mf/deref refs/workspace-editor-state) workspace-v2-editor-state (mf/deref refs/workspace-v2-editor-state) @@ -271,8 +259,8 @@ (fn [] #(st/emit! (dwt/remove-text-modifier (:id shape))))) - [:& text-container {:shape shape - :on-update handle-update-shape}])) + [:> text-container* {:shape shape + :on-update handle-update-shape}])) (defn check-props [new-props old-props] @@ -283,15 +271,10 @@ (= (unchecked-get new-props "edition") (unchecked-get old-props "edition")))) -(mf/defc viewport-texts - {::mf/wrap-props false - ::mf/wrap [#(mf/memo' % check-props)]} - [props] - (let [objects (obj/get props "objects") - edition (obj/get props "edition") - modifiers (obj/get props "modifiers") - - text-shapes +(mf/defc viewport-texts* + {::mf/wrap [#(mf/memo' % check-props)]} + [{:keys [objects edition modifiers]}] + (let [text-shapes (mf/use-memo (mf/deps objects) (fn [] @@ -334,7 +317,7 @@ [:* (when editing-shape - [:& viewport-text-editing {:shape editing-shape}]) + [:> viewport-text-editing* {:shape editing-shape}]) - [:& text-modifiers-renderer {:text-shapes text-shapes-modifiers}] - [:& text-changes-renderer {:text-shapes text-shapes-changes}]])) + [:> text-modifiers-renderer* {:text-shapes text-shapes-modifiers}] + [:> text-changes-renderer* {:text-shapes text-shapes-changes}]])) diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index 7539e97e36..6f1eaad5bb 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -339,7 +339,7 @@ ;; some opacity because to debug auto-width events will fill the screen :opacity 0.6}} (when (and (:can-edit permissions) (not read-only?)) - [:& stvh/viewport-texts + [:> stvh/viewport-texts* {:key (dm/str "texts-" page-id) :page-id page-id :objects objects @@ -442,8 +442,8 @@ [:> editor-v2/text-editor* {:shape editing-shape :canvas-ref canvas-ref :modifiers modifiers}] - [:& editor-v1/text-editor-svg {:shape editing-shape - :modifiers modifiers}])) + [:> editor-v1/text-editor-svg* {:shape editing-shape + :modifiers modifiers}])) (when show-frame-outline? (let [outlined-frame-id diff --git a/frontend/src/app/main/ui/workspace/viewport_wasm.cljs b/frontend/src/app/main/ui/workspace/viewport_wasm.cljs index 5245d0e5a9..61bf322c05 100644 --- a/frontend/src/app/main/ui/workspace/viewport_wasm.cljs +++ b/frontend/src/app/main/ui/workspace/viewport_wasm.cljs @@ -514,17 +514,17 @@ (when show-text-editor? (cond (features/active-feature? @st/state "text-editor-wasm/v1") - [:& editor-v3/text-editor {:shape editing-shape - :canvas-ref canvas-ref - :ref text-editor-ref}] + [:> editor-v3/text-editor* {:shape editing-shape + :canvas-ref canvas-ref + :ref text-editor-ref}] (features/active-feature? @st/state "text-editor/v2") [:> editor-v2/text-editor* {:shape editing-shape :canvas-ref canvas-ref :ref text-editor-ref}] - :else [:& editor-v1/text-editor-svg {:shape editing-shape - :ref text-editor-ref}])) + :else [:> editor-v1/text-editor-svg* {:shape editing-shape + :ref text-editor-ref}])) (when show-frame-outline? (let [outlined-frame-id