Merge pull request #2861 from penpot/alotor-regenerate-empty-thumbnails

🐛 Try to refresh thumbnails on empty stored data in back

frontend/src/app/main/ui/workspace/shapes/frame/thumbnail_render.cljs

@@ -18,9 +18,11 @@
    [app.main.ui.shapes.frame :as frame]
    [app.util.dom :as dom]
    [app.util.timers :as ts]
+   [app.util.webapi :as wapi]
    [beicon.core :as rx]
    [cuerdas.core :as str]
    [debug :refer [debug?]]
+   [promesa.core :as p]
    [rumext.v2 :as mf]))
 
 (defn- draw-thumbnail-canvas!
@@ -229,6 +231,16 @@
             (.disconnect @observer-ref)
             (reset! observer-ref nil)))))
 
+    ;; When the thumbnail-data is empty we regenerate the thumbnail
+    (mf/use-effect
+     (mf/deps (:selrect shape) thumbnail-data)
+     (fn []
+       (let [{:keys [width height]} (:selrect shape)]
+         (p/then (wapi/empty-png-size width height)
+                 (fn [data]
+                   (when (<= (count thumbnail-data) (+ 100 (count data)))
+                     (rx/push! updates-str :update)))))))
+
     [on-load-frame-dom
      @render-frame?
      (mf/html

frontend/src/app/util/webapi.cljs

@@ -11,7 +11,8 @@
    [app.common.logging :as log]
    [app.util.object :as obj]
    [beicon.core :as rx]
-   [cuerdas.core :as str]))
+   [cuerdas.core :as str]
+   [promesa.core :as p]))
 
 (log/set-level! :warn)
 
@@ -144,3 +145,24 @@
        (.observe ^js obs node)
        (fn []
          (.disconnect ^js obs))))))
+
+(defn empty-png-size*
+  [width height]
+  (p/create
+   (fn [resolve reject]
+     (try
+       (let [canvas (.createElement js/document "canvas")
+             _ (set! (.-width canvas) width)
+             _ (set! (.-height canvas) height)
+             _ (set! (.-background canvas) "white")
+             canvas-context (.getContext canvas "2d")]
+         (.fillRect canvas-context 0 0 width height)
+         (.toBlob canvas
+                  (fn [blob]
+                    (->> (read-file-as-data-url blob)
+                         (rx/catch (fn [err] (reject err)))
+                         (rx/subs (fn [result] (resolve result)))))))
+
+       (catch :default e (reject e))))))
+
+(def empty-png-size (memoize empty-png-size*))