Merge pull request #2505 from penpot/palba-filter-comments-st

Fix displaying comments settings are not applied via "Comments" menu …

CHANGES.md

@@ -14,6 +14,7 @@
 - Fix transform to path RMB menu item is not relevant if shape is already path [Taiga #4302](https://tree.taiga.io/project/penpot/issue/4302)
 - Fix join nodes icon is active when 2 already joined nodes are selected [Taiga #4370](https://tree.taiga.io/project/penpot/issue/4370)
 - Fix path nodes panel. "To curve" and "To corner" icons are active if node is already curved/cornered [Taiga #4371](https://tree.taiga.io/project/penpot/issue/4371)
+- Fix displaying comments settings are not applied via "Comments" menu drop-down on the top navbar on view mode [Taiga #4389](https://tree.taiga.io/project/penpot/issue/4389)
 
 ## 1.16.0-beta
 

frontend/src/app/main/ui/viewer/comments.cljs

@@ -6,7 +6,6 @@
 
 (ns app.main.ui.viewer.comments
   (:require
-   [app.common.data :as d]
    [app.common.geom.matrix :as gmt]
    [app.common.geom.point :as gpt]
    [app.common.geom.shapes :as gsh]
@@ -27,21 +26,26 @@
   {::mf/wrap [mf/memo]
    ::mf/wrap-props false}
   []
-  (let [local           (mf/deref refs/comments-local)
+  (let [{cmode :mode cshow :show show-sidebar? :show-sidebar?} (mf/deref refs/comments-local)
-        owner-filter    (:owner-filter local)
-        status-filter   (:status-filter local)
-        show-sidebar?   (:show-sidebar? local)
 
         show-dropdown?  (mf/use-state false)
         toggle-dropdown (mf/use-fn #(swap! show-dropdown? not))
         hide-dropdown   (mf/use-fn #(reset! show-dropdown? false))
 
-        update-option   (mf/use-fn
+        update-mode
-                         (fn [event]
+        (mf/use-callback
-                           (let [target (dom/get-current-target event)
+         (fn [mode]
-                                 key    (d/read-string (dom/get-attribute target "data-key"))
+           (st/emit! (dcm/update-filters {:mode mode}))))
-                                 val    (d/read-string (dom/get-attribute target "data-val"))]
+
-                             (st/emit! (dcm/update-options {key val})))))]
+        update-show
+        (mf/use-callback
+         (fn [mode]
+           (st/emit! (dcm/update-filters {:show mode}))))
+
+        update-options
+        (mf/use-callback
+         (fn [mode]
+           (st/emit! (dcm/update-options {:show-sidebar? mode}))))]
 
     [:div.view-options {:on-click toggle-dropdown}
      [:span.label (tr "labels.comments")]
@@ -50,34 +54,26 @@
                    :on-close hide-dropdown}
 
       [:ul.dropdown.with-check
-       [:li {:class (dom/classnames :selected (= :all owner-filter))
+       [:li {:class (dom/classnames :selected (or (= :all cmode) (nil? cmode)))
-             :data-key ":owner-filter"
+             :on-click #(update-mode :all)}
-             :data-val ":all"
-             :on-click update-option}
         [:span.icon i/tick]
         [:span.label (tr "labels.show-all-comments")]]
 
-       [:li {:class (dom/classnames :selected (= :yours owner-filter))
+       [:li {:class (dom/classnames :selected (= :yours cmode))
-             :data-key ":owner-filter"
+             :on-click #(update-mode :yours)}
-             :data-val ":yours"
-             :on-click update-option}
         [:span.icon i/tick]
         [:span.label (tr "labels.show-your-comments")]]
 
        [:hr]
 
-       [:li {:class (dom/classnames :selected (= :pending status-filter))
+       [:li {:class (dom/classnames :selected (= :pending cshow))
-             :data-key ":status-filter"
+             :on-click #(update-show (if (= :pending cshow) :all :pending))}
-             :data-val (if (= :pending status-filter) ":all" ":pending")
-             :on-click update-option}
         [:span.icon i/tick]
         [:span.label (tr "labels.hide-resolved-comments")]]
 
        [:hr]
        [:li {:class (dom/classnames :selected show-sidebar?)
-             :data-key ":show-sidebar?"
+             :on-click #(update-options (not show-sidebar?))}
-             :data-val (if show-sidebar? "false" "true")
-             :on-click update-option}
         [:span.icon i/tick]
         [:span.label (tr "labels.show-comments-list")]]]]]))