From b586cebe01273903764198666d4fe1ac36cbe22d Mon Sep 17 00:00:00 2001 From: Tienson Qin Date: Wed, 11 Oct 2023 02:39:05 +0800 Subject: [PATCH] fix: can't edit property value --- src/main/frontend/components/property.cljs | 24 ++-- .../frontend/components/property/value.cljs | 130 +++++++++--------- 2 files changed, 79 insertions(+), 75 deletions(-) diff --git a/src/main/frontend/components/property.cljs b/src/main/frontend/components/property.cljs index 811ebb05bf..3fffffa90d 100644 --- a/src/main/frontend/components/property.cljs +++ b/src/main/frontend/components/property.cljs @@ -22,7 +22,8 @@ [rum.core :as rum] [frontend.handler.route :as route-handler] [frontend.components.icon :as icon-component] - [frontend.components.dnd :as dnd])) + [frontend.components.dnd :as dnd] + [dommy.core :as dom])) (defn- update-property! [property property-name property-schema] @@ -301,7 +302,8 @@ add-new-property?) class? (contains? (:block/type block) "class") property-type (get-in property [:block/schema :type])] - [:div.property-configure.flex.flex-1.flex-col + [:div.property-configure.flex.flex-1.flex-col {:on-mouse-down #(state/set-state! :editor/mouse-down-from-property-configure? true) + :on-mouse-up #(state/set-state! :editor/mouse-down-from-property-configure? nil)} [:div.grid.gap-2.p-1 [:div.grid.grid-cols-4.gap-1.items-center.leading-8 [:label.col-span-1 "Name:"] @@ -335,7 +337,7 @@ :selected (= type (:type @*property-schema))})))] [:div.col-span-2 (if property-type - (property-type-label property-type) + (property-type-label property-type) (ui/select schema-types (fn [_e v] (let [type (keyword (string/lower-case v))] @@ -416,7 +418,9 @@ :on-click (fn [e] (util/stop e) (update-property! property @*property-name @*property-schema) - (when toggle-fn (toggle-fn)))))] + (when toggle-fn (toggle-fn)) + (when-let [input (first (dom/by-tag "textarea"))] + (.focus input)))))] (when-not hide-delete? [:hr]) @@ -446,18 +450,16 @@ *show-new-property-config?]}] (let [repo (state/get-current-repo)] ;; existing property selected or entered - (if-let [property (get-property-from-db property-name)] + (if-let [_property (get-property-from-db property-name)] (if (contains? db-property/hidden-built-in-properties (keyword property-name)) (do (notification/show! "This is a built-in property that can't be used." :error) (pv/exit-edit-property)) ;; Both conditions necessary so that a class can add its own page properties - (if (and (contains? (:block/type entity) "class") class-schema?) + (when (and (contains? (:block/type entity) "class") class-schema?) (pv/add-property! entity property-name "" {:class-schema? class-schema? - ;; Only enter property names from sub-modal as inputting - ;; property values is buggy in sub-modal - :exit-edit? page-configure?}) - (let [editor-id (str "ls-property-" (:db/id entity) "-" (:db/id property))] - (pv/set-editing! property editor-id "" "")))) + ;; Only enter property names from sub-modal as inputting + ;; property values is buggy in sub-modal + :exit-edit? page-configure?}))) ;; new property entered (if (db-property/valid-property-name? property-name) (if (and (contains? (:block/type entity) "class") page-configure?) diff --git a/src/main/frontend/components/property/value.cljs b/src/main/frontend/components/property/value.cljs index 71c58ff4c1..aa4c122cfb 100644 --- a/src/main/frontend/components/property/value.cljs +++ b/src/main/frontend/components/property/value.cljs @@ -11,7 +11,6 @@ [frontend.handler.editor :as editor-handler] [frontend.handler.page :as page-handler] [frontend.handler.property :as property-handler] - [frontend.modules.outliner.core :as outliner-core] [frontend.state :as state] [frontend.ui :as ui] [frontend.util :as util] @@ -30,12 +29,12 @@ (state/clear-edit!)) (defn set-editing! - [property editor-id dom-id v] + [property editor-id dom-id v opts] (let [v (str v) cursor-range (if dom-id (some-> (gdom/getElement dom-id) util/caret-range) "")] - (state/set-editing! editor-id v property cursor-range))) + (state/set-editing! editor-id v property cursor-range opts))) (defn add-property! "If a class and in a class schema context, add the property to its schema. @@ -130,7 +129,8 @@ (defn- select-aux [block property {:keys [items selected-choices multiple-choices?] :as opts}] - (let [clear-value (str "No " (:block/original-name property)) + (let [selected-choices (remove nil? selected-choices) + clear-value (str "No " (:block/original-name property)) items' (if (and (seq selected-choices) (not multiple-choices?)) (cons {:value clear-value :label clear-value} @@ -251,16 +251,13 @@ (defn- save-text! [repo block property value editor-id e] - (let [new-value (util/evalue e) - blank? (string/blank? new-value)] + (let [new-value (util/evalue e)] (when (not (state/get-editor-action)) (util/stop e) - (when-not blank? - (when (not= (string/trim new-value) (and value (string/trim value))) - (property-handler/set-block-property! repo (:block/uuid block) - (:block/original-name property) - new-value - :old-value value))) + (when (not= new-value value) + (property-handler/set-block-property! repo (:block/uuid block) + (:block/original-name property) + (string/trim new-value))) (when (= js/document.activeElement (gdom/getElement editor-id)) (exit-edit-property))))) @@ -287,7 +284,8 @@ :background "none"} :on-blur (fn [e] - (save-text! repo block property value editor-id e)) + (when-not (:editor/mouse-down-from-property-configure? @state/state) + (save-text! repo block property value editor-id e))) :on-key-down (fn [e] (let [enter? (= (util/ekey e) "Enter") @@ -444,19 +442,21 @@ select-f dropdown-opts)))) -(rum/defc property-scalar-value < rum/reactive db-mixins/query - [block property value {:keys [inline-text block-cp - editor-id dom-id row? - editor-box editor-args editing? - on-chosen] - :as opts}] - (let [property (model/sub-block (:db/id property)) +(rum/defcs property-scalar-value < rum/reactive db-mixins/query + (rum/local nil ::ref) + [state block property value {:keys [inline-text block-cp + editor-id dom-id row? + editor-box editor-args editing? + on-chosen] + :as opts}] + (let [*ref (::ref state) + property (model/sub-block (:db/id property)) repo (state/get-current-repo) schema (:block/schema property) type (get schema :type :default) multiple-values? (= :many (:cardinality schema)) editor-id (or editor-id (str "ls-property-" (:db/id block) "-" (:db/id property))) - editing? (or editing? (state/sub-editing? editor-id)) + editing? (or editing? (and @*ref (state/sub-editing? @*ref))) select-type? (select-type? type) select-opts {:on-chosen on-chosen}] (if (and select-type? (not= type :date)) @@ -479,52 +479,54 @@ (when (= (util/ekey e) "Enter") (add-property!)))})) ;; :others - (if editing? - [:div.flex.flex-1 - (case type - :template - (let [id (first (:classes schema)) - template (when id (db/entity [:block/uuid id]))] - (when template - (create-new-block-from-template! block property template))) + [:div.flex.flex-1 {:ref #(when-not @*ref (reset! *ref %))} + (if editing? + [:div.flex.flex-1 + (case type + :template + (let [id (first (:classes schema)) + template (when id (db/entity [:block/uuid id]))] + (when template + (create-new-block-from-template! block property template))) - (let [config {:editor-opts (new-text-editor-opts repo block property value editor-id)}] - [:div - (editor-box editor-args editor-id (cond-> config - multiple-values? - (assoc :property-value value)))]))] - (let [class (str (when-not row? "flex flex-1 ") - (when multiple-values? "property-value-content"))] - [:div {:id (or dom-id (random-uuid)) - :class class - :style {:min-height 24} - :on-click (fn [] - (when (and (= type :default) (not (uuid? value))) - (set-editing! property editor-id dom-id value)))} - (let [type (or (when (and (= type :default) (uuid? value)) :block) - type - :default)] - (if (string/blank? value) - (if (= :template type) - (let [id (first (:classes schema)) - template (when id (db/entity [:block/uuid id]))] - (when template - [:a.fade-link.pointer.text-sm - {:on-click (fn [e] - (util/stop e) - (create-new-block-from-template! block property template))} - (str "Use template #" (:block/original-name template))])) - [:div.opacity-50.pointer.text-sm "Empty"]) - (case type - :template - (property-template-value {:editor-id editor-id} - value - opts) + (let [config {:editor-opts (new-text-editor-opts repo block property value editor-id)}] + [:div + (editor-box editor-args editor-id (cond-> config + multiple-values? + (assoc :property-value value)))]))] + (let [class (str (when-not row? "flex flex-1 ") + (when multiple-values? "property-value-content"))] + [:div.cursor-text + {:id (or dom-id (random-uuid)) + :class class + :style {:min-height 24} + :on-click (fn [] + (when (and (= type :default) (not (uuid? value))) + (set-editing! property editor-id dom-id value {:ref @*ref})))} + (let [type (or (when (and (= type :default) (uuid? value)) :block) + type + :default)] + (if (string/blank? value) + (if (= :template type) + (let [id (first (:classes schema)) + template (when id (db/entity [:block/uuid id]))] + (when template + [:a.fade-link.pointer.text-sm + {:on-click (fn [e] + (util/stop e) + (create-new-block-from-template! block property template))} + (str "Use template #" (:block/original-name template))])) + [:div.opacity-50.pointer.text-sm "Empty"]) + (case type + :template + (property-template-value {:editor-id editor-id} + value + opts) - :block - (property-block-value value block-cp editor-box opts) + :block + (property-block-value value block-cp editor-box opts) - (inline-text {} :markdown (str value)))))])))))) + (inline-text {} :markdown (str value)))))]))])))) (rum/defc multiple-values < rum/reactive [block property v {:keys [on-chosen dropdown? editing?]