mirror of
https://github.com/penpot/penpot.git
synced 2025-01-23 23:18:48 -05:00
💄 Add minor cosmetic improvements to viewer comments code
Mainly on comments and header namespace
This commit is contained in:
parent
6660ca8e6f
commit
9db714b25d
2 changed files with 30 additions and 23 deletions
|
@ -8,6 +8,7 @@
|
|||
(:require-macros [app.main.style :as stl])
|
||||
(:require
|
||||
[app.common.data :as d]
|
||||
[app.common.data.macros :as dm]
|
||||
[app.common.geom.matrix :as gmt]
|
||||
[app.common.geom.point :as gpt]
|
||||
[app.common.geom.rect :as grc]
|
||||
|
@ -26,16 +27,20 @@
|
|||
[rumext.v2 :as mf]))
|
||||
|
||||
(mf/defc comments-menu
|
||||
{::mf/wrap [mf/memo]
|
||||
::mf/wrap-props false}
|
||||
{::mf/props :obj
|
||||
::mf/memo true}
|
||||
[]
|
||||
(let [{cmode :mode cshow :show show-sidebar? :show-sidebar?} (mf/deref refs/comments-local)
|
||||
(let [state (mf/deref refs/comments-local)
|
||||
cmode (:mode state)
|
||||
cshow (:show state)
|
||||
show-sidebar? (:show-sidebar? state false)
|
||||
|
||||
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-mode
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(let [mode (-> (dom/get-current-target event)
|
||||
(dom/get-data "value")
|
||||
|
@ -43,7 +48,7 @@
|
|||
(st/emit! (dcm/update-filters {:mode mode})))))
|
||||
|
||||
update-show
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(let [mode (-> (dom/get-current-target event)
|
||||
(dom/get-data "value")
|
||||
|
@ -51,8 +56,7 @@
|
|||
(st/emit! (dcm/update-filters {:show mode})))))
|
||||
|
||||
update-options
|
||||
(mf/use-callback
|
||||
(mf/deps show-sidebar?)
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(let [mode (-> (dom/get-target event)
|
||||
(dom/get-data "value")
|
||||
|
@ -106,7 +110,7 @@
|
|||
|
||||
[:li {:class (stl/css-case :dropdown-element true
|
||||
:selected show-sidebar?)
|
||||
:data-value (str show-sidebar?)
|
||||
:data-value (dm/str show-sidebar?)
|
||||
:on-click update-options}
|
||||
|
||||
[:span {:class (stl/css :label)} (tr "labels.show-comments-list")]
|
||||
|
@ -114,7 +118,8 @@
|
|||
[:span {:class (stl/css :icon)} i/tick-refactor])]]]]))
|
||||
|
||||
|
||||
(defn- update-thread-position [positions {:keys [id] :as thread}]
|
||||
(defn- update-thread-position
|
||||
[positions {:keys [id] :as thread}]
|
||||
(if-let [data (get positions id)]
|
||||
(-> thread
|
||||
(assoc :position (:position data))
|
||||
|
@ -122,7 +127,8 @@
|
|||
thread))
|
||||
|
||||
(mf/defc comments-layer
|
||||
[{:keys [zoom file users frame page] :as props}]
|
||||
{::mf/props :obj}
|
||||
[{:keys [zoom file users frame page]}]
|
||||
(let [profile (mf/deref refs/profile)
|
||||
local (mf/deref refs/comments-local)
|
||||
|
||||
|
|
|
@ -34,7 +34,8 @@
|
|||
(modal/show! :login-register {}))
|
||||
|
||||
(mf/defc zoom-widget
|
||||
{::mf/wrap [mf/memo]}
|
||||
{::mf/memo true
|
||||
::mf/props :obj}
|
||||
[{:keys [zoom
|
||||
on-increase
|
||||
on-decrease
|
||||
|
@ -102,38 +103,38 @@
|
|||
[:span {:class (stl/css :shortcuts)}
|
||||
(for [sc (scd/split-sc (sc/get-tooltip :toggle-zoom-style))]
|
||||
[:span {:class (stl/css :shortcut-key)
|
||||
:key (str "zoom-fit-" sc)} sc])]]
|
||||
:key (dm/str "zoom-fit-" sc)} sc])]]
|
||||
[:li {:class (stl/css :zoom-option)
|
||||
:on-click on-zoom-fill}
|
||||
(tr "workspace.header.zoom-fill")
|
||||
[:span {:class (stl/css :shortcuts)}
|
||||
(for [sc (scd/split-sc (sc/get-tooltip :toggle-zoom-style))]
|
||||
[:span {:class (stl/css :shortcut-key)
|
||||
:key (str "zoom-fill-" sc)} sc])]]
|
||||
:key (dm/str "zoom-fill-" sc)} sc])]]
|
||||
[:li {:class (stl/css :zoom-option)
|
||||
:on-click on-fullscreen}
|
||||
(tr "workspace.header.zoom-full-screen")
|
||||
[:span {:class (stl/css :shortcuts)}
|
||||
(for [sc (scd/split-sc (sc/get-tooltip :toggle-fullscreen))]
|
||||
[:span {:class (stl/css :shortcut-key)
|
||||
:key (str "zoom-fullscreen-" sc)} sc])]]]]]))
|
||||
:key (dm/str "zoom-fullscreen-" sc)} sc])]]]]]))
|
||||
|
||||
(mf/defc header-options
|
||||
[{:keys [section zoom page file index permissions interactions-mode]}]
|
||||
(let [fullscreen? (mf/deref fullscreen-ref)
|
||||
|
||||
toggle-fullscreen
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [] (st/emit! dv/toggle-fullscreen)))
|
||||
|
||||
go-to-workspace
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps page)
|
||||
(fn []
|
||||
(st/emit! (dv/go-to-workspace (:id page)))))
|
||||
|
||||
open-share-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps page)
|
||||
(fn []
|
||||
(modal/show! :share-link {:page page :file file})
|
||||
|
@ -209,22 +210,22 @@
|
|||
show-dropdown? (mf/use-state false)
|
||||
|
||||
toggle-thumbnails
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn []
|
||||
(st/emit! dv/toggle-thumbnails-panel)))
|
||||
|
||||
open-dropdown
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn []
|
||||
(reset! show-dropdown? true)))
|
||||
|
||||
close-dropdown
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn []
|
||||
(reset! show-dropdown? false)))
|
||||
|
||||
navigate-to
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [page-id]
|
||||
(st/emit! (dv/go-to-page page-id))
|
||||
(reset! show-dropdown? false)))]
|
||||
|
@ -245,8 +246,8 @@
|
|||
(for [id (get-in file [:data :pages])]
|
||||
[:li {:class (stl/css-case :dropdown-element true
|
||||
:selected (= page-id id))
|
||||
:id (str id)
|
||||
:key (str id)
|
||||
:id (dm/str id)
|
||||
:key (dm/str id)
|
||||
:on-click (partial navigate-to id)}
|
||||
[:span {:class (stl/css :label)}
|
||||
(get-in file [:data :pages-index id :name])]
|
||||
|
|
Loading…
Add table
Reference in a new issue