diff --git a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs index c6825f621d..5a69b066bd 100644 --- a/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/context_menu.cljs @@ -10,6 +10,7 @@ [app.common.data :as d] [app.common.data.macros :as dm] [app.main.data.events :as ev] + [app.main.data.modal :as modal] [app.main.data.shortcuts :as scd] [app.main.data.tokens :as dt] [app.main.data.workspace :as dw] @@ -27,10 +28,20 @@ (l/derived :token-context-menu refs/workspace-local)) (mf/defc token-pill-context-menu - [{:keys [token-id]}] - (let [do-delete #(st/emit! (dt/delete-token token-id)) + [{: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 #(js/console.log "Editing")] + 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}] @@ -64,4 +75,5 @@ :on-context-menu prevent-default} (when (= :token (:type mdata)) [:ul {:class (stl/css :context-list)} - [:& token-pill-context-menu {:token-id (:token-id mdata)}]])]])) \ No newline at end of file + [:& token-pill-context-menu {:token-id (:token-id mdata) + :token-type-props (:token-type-props mdata)}]])]])) \ No newline at end of file diff --git a/frontend/src/app/main/ui/workspace/tokens/modal.cljs b/frontend/src/app/main/ui/workspace/tokens/modal.cljs index 5420fc9b50..5529d328aa 100644 --- a/frontend/src/app/main/ui/workspace/tokens/modal.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/modal.cljs @@ -43,18 +43,24 @@ (mf/defc tokens-properties-form {::mf/wrap-props false} - [{:keys [token-type x y position fields]}] + [{:keys [token-type x y position fields token]}] (let [vport (mf/deref viewport) style (calculate-position vport position x y) - name (mf/use-var nil) + name (mf/use-var (or (:name token) "")) on-update-name #(reset! name (dom/get-target-val %)) name-ref (mf/use-ref) - description (mf/use-var nil) + token-value (mf/use-var (or (:value token) "")) + + description (mf/use-var (or (:description token) "")) on-update-description #(reset! description (dom/get-target-val %)) - state (mf/use-state fields) + initial-fields (mapv (fn [field] + (assoc field :value (or (:value token) ""))) + fields) + state (mf/use-state initial-fields) + on-update-state-field (fn [idx e] (->> (dom/get-target-val e) (assoc-in @state [idx :value]) @@ -66,9 +72,10 @@ (first) (val)) token (cond-> {:name @name - :type token-type + :type (or (:type token) token-type) :value token-value} - @description (assoc :description @description))] + @description (assoc :description @description) + (:id token) (assoc :id (:id token)))] (st/emit! (dt/add-token token)) (modal/hide!)))] @@ -82,6 +89,7 @@ :on-submit on-submit} [:div {:class (stl/css :token-rows)} [:& tokens.common/labeled-input {:label "Name" + :default-value @name :on-change on-update-name :input-ref name-ref}] (for [[idx {:keys [type label]}] (d/enumerate @state)] @@ -89,8 +97,10 @@ (case type :box-shadow [:p "TODO BOX SHADOW"] [:& tokens.common/labeled-input {:label label + :default-value @token-value :on-change #(on-update-state-field idx %)}])]) [:& tokens.common/labeled-input {:label "Description" + :default-value @description :on-change #(on-update-description %)}] [:div {:class (stl/css :button-row)} [:button {:class (stl/css :button) diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs index edca4db0cd..64800f9621 100644 --- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs @@ -67,6 +67,7 @@ (dom/stop-propagation event) (st/emit! (dt/show-token-context-menu {:type :token :position (dom/get-client-position event) + :token-type-props token-type-props :token-id (:id token)})))) on-toggle-open-click (mf/use-fn