diff --git a/frontend/src/app/main/ui/workspace/tokens/sets.cljs b/frontend/src/app/main/ui/workspace/tokens/sets.cljs index a3d04a4c15..09398f8242 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sets.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sets.cljs @@ -119,7 +119,7 @@ (st/emit! (wdt/show-token-set-context-menu {:position (dom/get-client-position event) - :group? true + :is-group true :path tree-path}))))) on-collapse-click @@ -227,7 +227,7 @@ (st/emit! (wdt/show-token-set-context-menu {:position (dom/get-client-position event) - :group? false + :is-group false :path tree-path}))))) on-double-click diff --git a/frontend/src/app/main/ui/workspace/tokens/sets_context_menu.cljs b/frontend/src/app/main/ui/workspace/tokens/sets_context_menu.cljs index b95da308fd..55da39183a 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sets_context_menu.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sets_context_menu.cljs @@ -7,6 +7,7 @@ (ns app.main.ui.workspace.tokens.sets-context-menu (:require-macros [app.main.style :as stl]) (:require + [app.common.data.macros :as dm] [app.main.data.tokens :as wdt] [app.main.refs :as refs] [app.main.store :as st] @@ -59,24 +60,27 @@ [:& menu-entry {:title (tr "labels.rename") :on-click edit-name}] [:& menu-entry {:title (tr "labels.delete") :on-click delete-set}]])) -(mf/defc sets-context-menu +(mf/defc sets-context-menu* [] - (let [mdata (mf/deref sets-menu-ref) - top (+ (get-in mdata [:position :y]) 5) - left (+ (get-in mdata [:position :x]) 5) - width (mf/use-state 0) - dropdown-ref (mf/use-ref)] - (mf/use-effect - (mf/deps mdata) - (fn [] - (when-let [node (mf/ref-val dropdown-ref)] - (reset! width (.-offsetWidth node))))) - [:& dropdown {:show (boolean mdata) - :on-close #(st/emit! wdt/hide-token-set-context-menu)} + (let [{:keys [position is-group path]} + (mf/deref sets-menu-ref) + + position-top + (+ (dm/get-prop position :y) 5) + + position-left + (+ (dm/get-prop position :x) 5) + + on-close + (mf/use-fn + #(st/emit! wdt/hide-token-set-context-menu))] + + [:& dropdown {:show (some? position) + :on-close on-close} [:div {:class (stl/css :token-set-context-menu) :data-testid "tokens-context-menu-for-set" - :ref dropdown-ref - :style {:top top :left left} + :style {:top position-top + :left position-left} :on-context-menu prevent-default} - [:& menu {:group? (:group? mdata) - :path (:path mdata)}]]])) + [:& menu {:group? is-group + :path path}]]])) diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index 6a92a239c8..6830117575 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -32,7 +32,7 @@ [app.main.ui.workspace.tokens.errors :as wte] [app.main.ui.workspace.tokens.sets :refer [sets-list*]] [app.main.ui.workspace.tokens.sets-context :as sets-context] - [app.main.ui.workspace.tokens.sets-context-menu :refer [sets-context-menu]] + [app.main.ui.workspace.tokens.sets-context-menu :refer [sets-context-menu*]] [app.main.ui.workspace.tokens.style-dictionary :as sd] [app.main.ui.workspace.tokens.theme-select :refer [theme-select]] [app.main.ui.workspace.tokens.token-pill :refer [token-pill*]] @@ -270,7 +270,7 @@ (get permissions :can-edit)] [:& sets-context/provider {} - [:& sets-context-menu] + [:> sets-context-menu*] [:article {:data-testid "token-themes-sets-sidebar" :class (stl/css :sets-section-wrapper) :style {"--resize-height" (str resize-height "px")}}