diff --git a/frontend/src/app/main/ui/shapes/text/fontfaces.cljs b/frontend/src/app/main/ui/shapes/text/fontfaces.cljs index e75f0407b..5f2ae54fc 100644 --- a/frontend/src/app/main/ui/shapes/text/fontfaces.cljs +++ b/frontend/src/app/main/ui/shapes/text/fontfaces.cljs @@ -6,6 +6,7 @@ (ns app.main.ui.shapes.text.fontfaces (:require + [app.common.data :as d] [app.main.fonts :as fonts] [app.main.ui.hooks :as hooks] [app.main.ui.shapes.embed :as embed] @@ -47,19 +48,12 @@ (mf/ref-val fonts-css-ref))) -(mf/defc fontfaces-style +(mf/defc fontfaces-style-render {::mf/wrap-props false - ::mf/wrap [#(mf/memo' % (mf/check-props ["shapes"]))]} + ::mf/wrap [#(mf/memo' % (mf/check-props ["fonts"]))]} [props] - (let [shapes (obj/get props "shapes") - content (->> shapes (mapv :content)) - - ;; Retrieve the fonts ids used by the text shapes - fonts (->> content - (mapv fonts/get-content-fonts) - (reduce set/union #{}) - (hooks/use-equal-memo)) + (let [fonts (obj/get props "fonts") ;; Fetch its CSS fontfaces fonts-css (use-fonts-css fonts) @@ -75,5 +69,23 @@ ;; Creates a style tag by replacing the urls with the data uri style (replace-embeds fonts-css fonts-urls fonts-embed)] - (when (seq style) + (when (d/not-empty? style) [:style style]))) + +(mf/defc fontfaces-style + {::mf/wrap-props false + ::mf/wrap [#(mf/memo' % (mf/check-props ["shapes"]))]} + [props] + (let [shapes (->> (obj/get props "shapes") + (filterv #(= :text (:type %)))) + + content (->> shapes (mapv :content)) + + ;; Retrieve the fonts ids used by the text shapes + fonts (->> content + (mapv fonts/get-content-fonts) + (reduce set/union #{}) + (hooks/use-equal-memo))] + + (when (d/not-empty? fonts) + [:> fontfaces-style-render {:fonts fonts}]))) diff --git a/frontend/src/app/main/ui/workspace/shapes/frame.cljs b/frontend/src/app/main/ui/workspace/shapes/frame.cljs index 12cbfca7c..6f7504222 100644 --- a/frontend/src/app/main/ui/workspace/shapes/frame.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/frame.cljs @@ -7,6 +7,7 @@ (ns app.main.ui.workspace.shapes.frame (:require [app.common.geom.shapes :as gsh] + [app.common.pages :as cp] [app.main.ui.shapes.frame :as frame] [app.main.ui.shapes.shape :refer [shape-container]] [app.main.ui.shapes.text.fontfaces :as ff] @@ -76,8 +77,10 @@ objects (unchecked-get props "objects") thumbnail? (unchecked-get props "thumbnail?") - shape (gsh/transform-shape shape) - children (mapv #(get objects %) (:shapes shape)) + shape (gsh/transform-shape shape) + children (mapv #(get objects %) (:shapes shape)) + + all-children (cp/get-children-objects (:id shape) objects) rendered? (mf/use-state false) @@ -93,7 +96,7 @@ (when-not show-thumbnail? [:> shape-container {:shape shape :ref on-dom} - [:& ff/fontfaces-style {:shapes children}] + [:& ff/fontfaces-style {:shapes all-children}] [:& frame-shape {:shape shape :childs children}]])