From eb4e7e0f0c098e11e9d47e432866a59d2babde37 Mon Sep 17 00:00:00 2001
From: Andrey Antukh <niwi@niwi.nz>
Date: Tue, 18 Jan 2022 12:10:30 +0100
Subject: [PATCH] :bug: Fix dashboard grid thumbnails cache invalidation.

---
 backend/src/app/rpc/queries/files.clj        |  9 ++--
 frontend/src/app/main/ui/dashboard/grid.cljs | 53 +++++++++++---------
 2 files changed, 35 insertions(+), 27 deletions(-)

diff --git a/backend/src/app/rpc/queries/files.clj b/backend/src/app/rpc/queries/files.clj
index 07ee421cd..5495de9f8 100644
--- a/backend/src/app/rpc/queries/files.clj
+++ b/backend/src/app/rpc/queries/files.clj
@@ -165,6 +165,7 @@
           f.created_at,
           f.modified_at,
           f.name,
+          f.revn,
           f.is_shared
      from file as f
     where f.project_id = ?
@@ -214,9 +215,6 @@
       (some-> (retrieve-file cfg id)
               (assoc :permissions perms)))))
 
-(s/def ::page
-  (s/keys :req-un [::profile-id ::file-id]))
-
 (defn remove-thumbnails-frames
   "Removes from data the children for frames that have a thumbnail set up"
   [data]
@@ -244,7 +242,12 @@
 
     (update data :objects update-objects)))
 
+(s/def ::page
+  (s/keys :req-un [::profile-id ::file-id]))
+
 (sv/defmethod ::page
+  "Retrieves the first page of the file. Used mainly for render
+  thumbnails on dashboard."
   [{:keys [pool] :as cfg} {:keys [profile-id file-id strip-thumbnails]}]
   (db/with-atomic [conn pool]
     (check-read-permissions! conn profile-id file-id)
diff --git a/frontend/src/app/main/ui/dashboard/grid.cljs b/frontend/src/app/main/ui/dashboard/grid.cljs
index 8058a178f..c6d84161e 100644
--- a/frontend/src/app/main/ui/dashboard/grid.cljs
+++ b/frontend/src/app/main/ui/dashboard/grid.cljs
@@ -6,6 +6,7 @@
 
 (ns app.main.ui.dashboard.grid
   (:require
+   [app.common.logging :as log]
    [app.common.math :as mth]
    [app.main.data.dashboard :as dd]
    [app.main.data.messages :as dm]
@@ -30,6 +31,8 @@
    [promesa.core :as p]
    [rumext.alpha :as mf]))
 
+(log/set-level! :warn)
+
 ;; --- Grid Item Thumbnail
 
 (def ^:const CACHE-NAME "penpot")
@@ -40,9 +43,10 @@
   [file]
 
   (let [cache-url (str CACHE-URL (:id file) "/" (:revn file) ".svg")
+
         get-thumbnail
         (mf/use-callback
-         (mf/deps file)
+         (mf/deps cache-url)
          (fn []
            (p/let [response (.match js/caches cache-url)]
              (when (some? response)
@@ -58,50 +62,51 @@
 
         cache-thumbnail
         (mf/use-callback
-         (mf/deps file)
+         (mf/deps cache-url)
          (fn [{:keys [svg fonts]}]
            (p/let [cache    (.open js/caches CACHE-NAME)
                    blob     (js/Blob. #js [svg] #js {:type "image/svg"})
                    fonts    (str/join "," fonts)
                    headers  (js/Headers. #js {"X-PENPOT-FONTS" fonts})
                    response (js/Response. blob #js {:headers headers})]
-             (.put cache cache-url response))))
+             (.put cache cache-url response))))]
 
-        generate-thumbnail
-        (mf/use-callback
-         (mf/deps file)
-         (fn []
-           (->> (rx/from (get-thumbnail))
-                (rx/merge-map
-                 (fn [thumb-data]
-                   (if (some? thumb-data)
-                     (rx/of thumb-data)
-                     (->> (wrk/ask! {:cmd :thumbnails/generate
-                                     :file-id (:id file)
-                                     :page-id (get-in file [:data :pages 0])})
-                          (rx/tap cache-thumbnail)))))
+    (mf/use-callback
+     (mf/deps (:id file) (:revn file))
+     (fn []
+       (->> (rx/from (get-thumbnail))
+            (rx/merge-map
+             (fn [thumb-data]
+               (log/debug :msg "retrieve thumbnail" :file (:id file) :revn (:revn file)
+                          :cache (if (some? thumb-data) :hit :miss))
 
-                ;; If we have a problem we delegate to the thumbnail generation
-                (rx/catch #(wrk/ask! {:cmd :thumbnails/generate
-                                      :file-id (:id file)
-                                      :page-id (get-in file [:data :pages 0])})))))]
+               (if (some? thumb-data)
+                 (rx/of thumb-data)
+                 (->> (wrk/ask! {:cmd :thumbnails/generate
+                                 :file-id (:id file)
+                                 :page-id (get-in file [:data :pages 0])})
+                      (rx/tap cache-thumbnail)))))
 
-    generate-thumbnail))
+            ;; If we have a problem we delegate to the thumbnail generation
+            (rx/catch #(wrk/ask! {:cmd :thumbnails/generate
+                                  :file-id (:id file)
+                                  :page-id (get-in file [:data :pages 0])})))))))
 
 (mf/defc grid-item-thumbnail
   {::mf/wrap [mf/memo]}
   [{:keys [file] :as props}]
   (let [container (mf/use-ref)
-        generate-thumbnail (use-thumbnail-cache file)]
+        generate  (use-thumbnail-cache file)]
 
     (mf/use-effect
      (mf/deps file)
      (fn []
-       (->> (generate-thumbnail)
+       (->> (generate)
             (rx/subs (fn [{:keys [svg fonts]}]
                        (run! fonts/ensure-loaded! fonts)
                        (when-let [node (mf/ref-val container)]
-                         (set! (.-innerHTML ^js node) svg)))))))
+                         (dom/set-html! node svg)))))))
+
     [:div.grid-item-th {:style {:background-color (get-in file [:data :options :background])}
                         :ref container}
      i/loader-pencil]))