Merge pull request #4867 from penpot/ladybenko-8348-fix-pencil-loader

🐛 Fix pencil loader in dashboard

CHANGES.md

@@ -1,6 +1,12 @@
 # CHANGELOG
 
-## 2.1.0
+## 2.1.1
+
+### :bug: Bugs fixed
+
+- Fix pencil loader [Taiga #8348](https://tree.taiga.io/project/penpot/issue/8348)
+
+## 2.1.0 - Things can only get better!
 
 ### :rocket: Epics and highlights
 
@@ -54,6 +60,7 @@
 - Fix 'Detach instance' shortcut is not working [Taiga #8102](https://tree.taiga.io/project/penpot/issue/8102)
 - Fix import file message does not detect 0 as error [Taiga #6824](https://tree.taiga.io/project/penpot/issue/6824)
 - Image Color Library is not persisted when exporting/importing in .zip [Taiga #8131](https://tree.taiga.io/project/penpot/issue/8131)
+- Fix export files including libraries [Taiga #8266](https://tree.taiga.io/project/penpot/issue/8266)
 
 ## 2.0.3
 

backend/resources/app/onboarding.edn

@@ -30,4 +30,10 @@
   :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Open-Color-Scheme.penpot"}
  {:id "flex-layout-playground"
   :name "Flex Layout Playground"
-  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Flex-Layout-Playground.penpot"}]
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Flex-Layout-Playground.penpot"}
+ {:id "prototype-examples"
+  :name "Prototipe template"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/prototype-examples.penpot"}
+ {:id "penpot-design-system"
+  :name "Design system example"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Penpot-Design-system.penpot"}]

backend/src/app/auth/oidc.clj

@@ -420,12 +420,6 @@
 
 (defn- get-info
   [{:keys [::provider ::setup/props] :as cfg} {:keys [params] :as request}]
-  (when-let [error (get params :error)]
-    (ex/raise :type :internal
-              :code :error-on-retrieving-code
-              :error-id error
-              :error-desc (get params :error_description)))
-
   (let [state  (get params :state)
         code   (get params :code)
         state  (tokens/verify props {:token state :iss :oauth})
@@ -609,9 +603,11 @@
 (defn- callback-handler
   [cfg request]
   (try
-    (let [info    (get-info cfg request)
-          profile (get-profile cfg info)]
-      (process-callback cfg request info profile))
+    (if-let [error (dm/get-in request [:params :error])]
+      (redirect-with-error "unable-to-auth" error)
+      (let [info    (get-info cfg request)
+            profile (get-profile cfg info)]
+        (process-callback cfg request info profile)))
     (catch Throwable cause
       (l/err :hint "error on oauth process" :cause cause)
       (redirect-with-error "unable-to-auth" (ex-message cause)))))

backend/src/app/binfile/common.clj

@@ -15,6 +15,7 @@
    [app.common.files.migrations :as fmg]
    [app.common.files.validate :as fval]
    [app.common.logging :as l]
+   [app.common.types.file :as ctf]
    [app.common.uuid :as uuid]
    [app.config :as cf]
    [app.db :as db]
@@ -331,54 +332,12 @@
 
 (defn embed-assets
   [cfg data file-id]
-  (letfn [(walk-map-form [form state]
-            (cond
-              (uuid? (:fill-color-ref-file form))
-              (do
-                (vswap! state conj [(:fill-color-ref-file form) :colors (:fill-color-ref-id form)])
-                (assoc form :fill-color-ref-file file-id))
-
-              (uuid? (:stroke-color-ref-file form))
-              (do
-                (vswap! state conj [(:stroke-color-ref-file form) :colors (:stroke-color-ref-id form)])
-                (assoc form :stroke-color-ref-file file-id))
-
-              (uuid? (:typography-ref-file form))
-              (do
-                (vswap! state conj [(:typography-ref-file form) :typographies (:typography-ref-id form)])
-                (assoc form :typography-ref-file file-id))
-
-              (uuid? (:component-file form))
-              (do
-                (vswap! state conj [(:component-file form) :components (:component-id form)])
-                (assoc form :component-file file-id))
-
-              :else
-              form))
-
-          (process-group-of-assets [data [lib-id items]]
-            ;; NOTE: there is a possibility that shape refers to an
-            ;; non-existant file because the file was removed. In this
-            ;; case we just ignore the asset.
-            (if-let [lib (get-file cfg lib-id)]
-              (reduce (partial process-asset lib) data items)
-              data))
-
-          (process-asset [lib data [bucket asset-id]]
-            (let [asset (get-in lib [:data bucket asset-id])
-                  ;; Add a special case for colors that need to have
-                  ;; correctly set the :file-id prop (pending of the
-                  ;; refactor that will remove it).
-                  asset (cond-> asset
-                          (= bucket :colors) (assoc :file-id file-id))]
-              (update data bucket assoc asset-id asset)))]
-
-    (let [assets (volatile! [])]
-      (walk/postwalk #(cond-> % (map? %) (walk-map-form assets)) data)
-      (->> (deref assets)
-           (filter #(as-> (first %) $ (and (uuid? $) (not= $ file-id))))
-           (d/group-by first rest)
-           (reduce (partial process-group-of-assets) data)))))
+  (let [library-ids (get-libraries cfg [file-id])]
+    (reduce (fn [data library-id]
+              (let [library (get-file cfg library-id)]
+                (ctf/absorb-assets data (:data library))))
+            data
+            library-ids)))
 
 (defn- fix-version
   [file]

backend/src/app/binfile/v1.clj

@@ -130,7 +130,6 @@
   (.writeLong output (long data))
   (swap! *position* + 8))
 
-
 (defn read-long!
   [^DataInputStream input]
   (let [v (.readLong input)]

common/src/app/common/types/file.cljc

@@ -633,19 +633,24 @@
   "Find all assets of a library that are used in the file, and
   move them to the file local library."
   [file-data library-data]
-  (let [used-components (find-asset-type-usages file-data library-data :component)
-        used-colors (find-asset-type-usages file-data library-data :color)
-        used-typographies (find-asset-type-usages file-data library-data :typography)]
+  (let [used-components   (find-asset-type-usages file-data library-data :component)
+        file-data         (cond-> file-data
+                            (d/not-empty? used-components)
+                            (absorb-components used-components library-data))
+                            ;; Note that absorbed components may also be using colors
+                            ;; and typographies. This is the reason of doing this first
+                            ;; and accumulating file data for the next ones.
 
-    (cond-> file-data
-      (d/not-empty? used-components)
-      (absorb-components used-components library-data)
+        used-colors       (find-asset-type-usages file-data library-data :color)
+        file-data         (cond-> file-data
+                            (d/not-empty? used-colors)
+                            (absorb-colors used-colors))
 
-      (d/not-empty? used-colors)
-      (absorb-colors used-colors)
-
-      (d/not-empty? used-typographies)
-      (absorb-typographies used-typographies))))
+        used-typographies (find-asset-type-usages file-data library-data :typography)
+        file-data         (cond-> file-data
+                            (d/not-empty? used-typographies)
+                            (absorb-typographies used-typographies))]
+    file-data))
 
 ;; Debug helpers
 

frontend/src/app/main/data/dashboard.cljs

@@ -299,7 +299,19 @@
   (ptk/reify ::libraries-fetched
     ptk/UpdateEvent
     (update [_ state]
-      (assoc state :builtin-templates libraries))))
+      (let [templates-a-b-test? (cf/external-feature-flag "dashboard-01" "test")
+            remove-ids (if templates-a-b-test?
+                         #{"wireframing-kit" "prototype-examples" "plants-app" "penpot-design-system"}
+                         #{"prototype-examples" "penpot-design-system"})
+            libraries (cond->> libraries
+                        :always
+                        (remove #(contains? remove-ids (:id %)))
+                        templates-a-b-test?
+                        (concat [{:id "wireframing-kit", :name "Wireframe library"}
+                                 {:id "prototype-examples", :name "Prototype template"}
+                                 {:id "plants-app", :name "UI mockup example"}
+                                 {:id "penpot-design-system", :name "Design system example"}]))]
+        (assoc state :builtin-templates libraries)))))
 
 (defn fetch-builtin-templates
   []

frontend/src/app/main/data/users.cljs

@@ -696,15 +696,20 @@
   (ptk/reify ::show-redirect-error
     ptk/WatchEvent
     (watch [_ _ _]
-      (let [hint (case error
-                   "registration-disabled"
-                   (tr "errors.registration-disabled")
-                   "profile-blocked"
-                   (tr "errors.profile-blocked")
-                   "auth-provider-not-allowed"
-                   (tr "errors.auth-provider-not-allowed")
-                   "email-domain-not-allowed"
-                   (tr "errors.email-domain-not-allowed")
-                   :else
-                   (tr "errors.generic"))]
+      (when-let [hint (case error
+                        "registration-disabled"
+                        (tr "errors.registration-disabled")
+                        "profile-blocked"
+                        (tr "errors.profile-blocked")
+                        "auth-provider-not-allowed"
+                        (tr "errors.auth-provider-not-allowed")
+                        "email-domain-not-allowed"
+                        (tr "errors.email-domain-not-allowed")
+
+                        ;; We explicitly do not show any error here, it a explicit user operation.
+                        "unable-to-auth"
+                        nil
+
+                        (tr "errors.generic"))]
+
         (rx/of (msg/warn hint))))))

frontend/src/app/main/ui/components/radio_buttons.cljs

@@ -58,7 +58,7 @@
 
 (mf/defc radio-buttons
   {::mf/props :obj}
-  [{:keys [children on-change selected class wide encode-fn decode-fn allow-empty] :as props}]
+  [{:keys [name children on-change selected class wide encode-fn decode-fn allow-empty] :as props}]
   (let [encode-fn (d/nilv encode-fn identity)
         decode-fn (d/nilv decode-fn identity)
         nitems    (if (array? children)
@@ -94,5 +94,6 @@
 
     [:& (mf/provider context) {:value context-value}
      [:div {:class (dm/str class " " (stl/css :radio-btn-wrapper))
-            :style {:width width}}
+            :style {:width width}
+            :key (dm/str name "-" selected)}
       children]]))

frontend/src/app/main/ui/dashboard/placeholder.cljs

@@ -41,5 +41,5 @@
 (mf/defc loading-placeholder
   []
   [:div {:class (stl/css :grid-empty-placeholder :loader)}
-   [:div {:class (stl/css :icon)} i/loader]
+   [:div {:class (stl/css :icon)} i/loader-pencil]
    [:div {:class (stl/css :text)} (tr "dashboard.loading-files")]])

frontend/src/app/main/ui/dashboard/placeholder.scss

@@ -23,8 +23,7 @@
     svg {
       width: $s-64;
       height: $s-64;
-      stroke: $df-secondary;
-      fill: none;
+      fill: $df-secondary;
     }
   }