Merge pull request #5884 from penpot/niwinz-bugfix-4

🐛 Fix update-libraries dialog disappear when clicking outside

CHANGES.md

@@ -66,6 +66,7 @@ is a number of cores)
 - Fix problem with onboarding to a team [Taiga #10143](https://tree.taiga.io/project/penpot/issue/10143)
 - Fix problem with grid layout crashing [Taiga #10127](https://tree.taiga.io/project/penpot/issue/10127)
 - Fix rename locked boards [Taiga #10174](https://tree.taiga.io/project/penpot/issue/10174)
+- Fix update-libraries dialog disappear when clicking outside [Taiga #10238](https://tree.taiga.io/project/penpot/issue/10238)
 
 ## 2.4.3
 

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

@@ -51,15 +51,12 @@
       [:label :string]
       [:callback ::sm/fn]]]]])
 
-(def ^:private valid-notification?
-  (sm/validator schema:notification))
+(def ^:private check-notification
+  (sm/check-fn schema:notification))
 
 (defn show
   [data]
-
-  (dm/assert!
-   "expected valid notification map"
-   (valid-notification? data))
+  (assert (check-notification data) "expected valid notification map")
 
   (ptk/reify ::show
     ptk/UpdateEvent
@@ -68,12 +65,16 @@
         (assoc state :notification notification)))
 
     ptk/WatchEvent
-    (watch [_ _ stream]
+    (watch [_ state stream]
       (rx/merge
-       (let [stopper (rx/filter (ptk/type? ::hide) stream)]
+       (let [stopper  (rx/filter (ptk/type? ::hide) stream)
+             route-id (dm/get-in state [:route :data :name])]
+
          (->> stream
               (rx/filter (ptk/type? :app.main.router/navigate))
-              (rx/map (fn [_] (hide)))
+              (rx/map deref)
+              (rx/filter #(not= route-id (:id %)))
+              (rx/map hide)
               (rx/take-until stopper)))
        (when (:timeout data)
          (let [stopper (rx/filter (ptk/type? ::show) stream)]

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

@@ -188,8 +188,8 @@
                   libraries)]
 
         (when needs-check?
-          (rx/concat (rx/timer 1000)
-                     (rx/of (dwl/notify-sync-file file-id))))))))
+          (->> (rx/of (dwl/notify-sync-file file-id))
+               (rx/delay 1000)))))))
 
 (defn- fetch-libraries
   [file-id]

frontend/src/app/main/data/workspace/libraries.cljs

@@ -1191,12 +1191,11 @@
   (ptk/reify ::notify-sync-file
     ptk/WatchEvent
     (watch [_ state _]
-      (let [file         (dm/get-in state [:files file-id])
+      (let [file         (dsh/lookup-file state file-id)
+
             file-data    (get file :data)
             ignore-until (get file :ignore-sync-until)
 
-
-            ;; FIXME: syntax of this can be improved
             libraries-need-sync
             (filter #(seq (assets-need-sync % file-data ignore-until))
                     (vals (get state :files)))
@@ -1212,8 +1211,7 @@
                  (st/emit! (ntf/hide)))
 
             do-dismiss
-            #(do (st/emit! ignore-sync)
-                 (st/emit! (ntf/hide)))]
+            #(st/emit! ignore-sync (ntf/hide))]
 
         (when (seq libraries-need-sync)
           (rx/of (ntf/dialog

frontend/src/app/main/ui/ds/notifications/actionable.cljs

@@ -17,34 +17,37 @@
    [:class {:optional true} :string]
    [:variant {:optional true}
     [:maybe [:enum "default" "error"]]]
-   [:acceptLabel {:optional true} :string]
-   [:cancelLabel {:optional true} :string]
-   [:onAccept {:optional true} [:fn fn?]]
-   [:onCancel {:optional true} [:fn fn?]]])
+   [:accept-label {:optional true} :string]
+   [:cancel-label {:optional true} :string]
+   [:on-accept {:optional true} [:fn fn?]]
+   [:on-cancel {:optional true} [:fn fn?]]])
 
 (mf/defc actionable*
-  {::mf/props :obj
-   ::mf/schema schema:actionable}
-  [{:keys [class variant acceptLabel cancelLabel children onAccept onCancel] :rest props}]
+  {::mf/schema schema:actionable}
+  [{:keys [class variant accept-label cancel-label children on-accept on-cancel] :rest props}]
 
-  (let [variant (or variant "default")
-        class (d/append-class class (stl/css :notification))
-        props (mf/spread-props props {:class class :data-testid "actionable"})
+  (let [variant (d/nilv variant "default")
+        class   (d/append-class class (stl/css :notification))
+        props   (mf/spread-props props
+                                 {:class class
+                                  :data-testid "actionable"})
 
-        handle-accept
+        on-accept
         (mf/use-fn
          (fn [e]
-           (when onAccept (onAccept e))))
+           (when (fn? on-accept)
+             (on-accept e))))
 
-        handle-cancel
+        on-cancel
         (mf/use-fn
          (fn [e]
-           (when onCancel (onCancel e))))]
+           (when on-cancel (on-cancel e))))]
 
-    [:> "aside" props
-     [:div {:class (stl/css :notification-message)}
-      children]
+    [:> :aside props
+     [:div {:class (stl/css :notification-message)} children]
      [:> button* {:variant "secondary"
-                  :on-click handle-cancel} cancelLabel]
+                  :on-click on-cancel}
+      cancel-label]
      [:> button* {:variant (if (= variant "default") "primary" "destructive")
-                  :on-click handle-accept} acceptLabel]]))
+                  :on-click on-accept}
+      accept-label]]))

frontend/src/app/main/ui/notifications/inline_notification.cljs

@@ -21,10 +21,10 @@
   [{:keys [content accept cancel links] :as props}]
 
   [:> actionable* {:class (stl/css :new-inline)
-                   :cancelLabel (:label cancel)
-                   :onCancel (:callback cancel)
-                   :acceptLabel (:label accept)
-                   :onAccept (:callback accept)}
+                   :cancel-label (:label cancel)
+                   :on-cancel (:callback cancel)
+                   :accept-label (:label accept)
+                   :on-accept (:callback accept)}
    content
 
    (when (some? links)