Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-12 10:09:03 -05:00
Code Issues Activity

Add initial context menu token specific functionality

Browse source
This commit is contained in:
Akshay Gupta 2024-05-27 13:02:24 +05:30
parent 65563e2d3c
commit 370a5d9bb8
2 changed files with 35 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
frontend/src/app/main/ui/workspace/tokens/context_menu.cljs
View file

@ -27,25 +27,39 @@
(def tokens-menu-ref
(l/derived :token-context-menu refs/workspace-local))
(defn additional-actions [token-type token-id]
(case token-type
:border-radius [{:title "Top Left Corner" :action #(js/console.log "Top Left Corner")}
{:title "Bottom Left Corner" :action #(js/console.log "Bottom Left Corner")}
{:title "Top Right Corner" :action #(js/console.log "Top Right Corner")}
{:title "Bottom Right Corner" :action #(js/console.log "Bottom Right Corner")}]
[]))
(defn generate-menu-entries [token-type-props token-id token-type]
(let [{:keys [modal]} token-type-props
default-actions [{:title "Delete Token" :action #(st/emit! (dt/delete-token token-id))}
{:title "Duplicate Token" :action #(st/emit! (dt/duplicate-token token-id))}
{:title "Edit Token" :action (fn [event]
(let [{:keys [key fields]} modal
token (dt/get-token-data-from-token-id token-id)]
(st/emit! dt/hide-token-context-menu)
(dom/stop-propagation event)
(modal/show! key {:x (.-clientX ^js event)
:y (.-clientY ^js event)
:position :right
:fields fields
:token token})))}]
specific-actions (additional-actions token-type token-id)
all-actions (concat default-actions specific-actions)]
(map (fn [{:keys [title action]}]
[:& menu-entry {:title title :on-click action}])
all-actions)))
(mf/defc token-pill-context-menu
[{:keys [token-id token-type-props]}]
(let [{:keys [modal attributes title]} token-type-props
do-delete #(st/emit! (dt/delete-token token-id))
do-duplicate #(st/emit! (dt/duplicate-token token-id))
do-edit (fn [event]
(let [{:keys [key fields]} modal
token (dt/get-token-data-from-token-id token-id)]
(st/emit! dt/hide-token-context-menu)
(dom/stop-propagation event)
(modal/show! key {:x (.-clientX ^js event)
:y (.-clientY ^js event)
:position :right
:fields fields
:token token})))]
[:*
[:& menu-entry {:title "Delete Token" :on-click do-delete}]
[:& menu-entry {:title "Duplicate Token" :on-click do-duplicate}]
[:& menu-entry {:title "Edit Token" :on-click do-edit}]]))
[{:keys [token-id token-type-props token-type]}]
(let [menu-entries (generate-menu-entries token-type-props token-id token-type)]
(into [:*] menu-entries)
))
(mf/defc token-context-menu
[]
@ -76,4 +90,5 @@
(when (= :token (:type mdata))
[:ul {:class (stl/css :context-list)}
[:& token-pill-context-menu {:token-id (:token-id mdata)
:token-type-props (:token-type-props mdata)}]])]]))
:token-type-props (:token-type-props mdata)
:token-type (:token-type mdata)}]])]]))

1
frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
View file

@ -68,6 +68,7 @@
(st/emit! (dt/show-token-context-menu {:type :token
:position (dom/get-client-position event)
:token-type-props token-type-props
:token-type type
:token-id (:id token)}))))
on-toggle-open-click (mf/use-fn