fix: pick the closest add property button when press enter

Also, display the class properties directly on page instead of
a configure modal.
This commit is contained in:
Tienson Qin
2023-11-08 13:28:05 +08:00
parent 8f6deb15a7
commit 9e894cae25
2 changed files with 55 additions and 31 deletions

View File

@@ -558,33 +558,47 @@
edit-input-id-prefix (str "edit-block-" (:block/uuid page))
configure-opts {:selected? false
:page-configure? true}
has-viewable-properties? (property-handler/block-has-viewable-properties? page)]
(when (or has-viewable-properties? configure?)
has-viewable-properties? (property-handler/block-has-viewable-properties? page)
has-class-properties? (seq (:properties (:block/schema page)))]
(when (or configure? has-viewable-properties? has-class-properties?)
[:div.ls-page-properties.mb-4 {:style {:padding 2}}
(if configure?
(cond
(and class? (not show-page-properties?))
(and class? (not show-page-properties?) (not has-class-properties?))
[:div
[:div.mb-2 "Class properties:"]
[:div
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-schema")
(assoc configure-opts :class-schema? true))]]
[:div.mb-1 "Class properties:"]
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-schema")
(assoc configure-opts :class-schema? true))]
(not (property-handler/block-has-viewable-properties? page))
[:div
[:div.mb-2 "Page properties:"]
[:div.mb-1 "Page properties:"]
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-page")
(assoc configure-opts :class-schema? false))])
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-page")
{:selected? false
:page-configure? false
:class-schema? false}))])))
[:div.flex.flex-col.gap-4
(when has-class-properties?
[:div
(when has-viewable-properties?
[:div.mb-1.opacity-70.font-medium.text-sm "Class properties:"])
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-schema")
(assoc configure-opts :class-schema? true))])
(when has-viewable-properties?
[:div
(when has-class-properties?
[:div.mb-1.opacity-70.font-medium.text-sm "Page properties:"])
(component-block/db-properties-cp {:editor-box editor/box}
page
(str edit-input-id-prefix "-page")
{:selected? false
:page-configure? false
:class-schema? false})])])])))
(rum/defc page-properties-react < rum/reactive
[page* page-opts]
@@ -686,8 +700,7 @@
[:div.mb-4
(component-block/breadcrumb config repo block-id {:level-limit 3})]))
(when (and db-based?
(not block?))
(when (and db-based? (not block?) (not preview?) (not sidebar?))
(page-properties-react page {:configure? false}))
;; blocks

View File

@@ -383,6 +383,7 @@
(pv/exit-edit-property)
nil))}})]])]))
(defonce *last-new-property-input-id (atom nil))
(rum/defcs new-property < rum/reactive
(rum/local nil ::property-key)
(rum/local nil ::property-value)
@@ -394,15 +395,24 @@
(when-not (:editor/property-configure? @state/state)
(property-handler/set-editing-new-property! nil)))
:node (js/document.getElementById "edit-new-property"))
(mixins/on-enter state {:on-enter (fn [e]
;; FIXME: modal
(when-not (or (state/editing?)
(state/selection?))
(when (or (= "main-content-container" (.-id (.-target e)))
(= (.-tagName (.-target e)) "BODY"))
(when-let [node (first (dom/by-class "add-property"))]
(.click node)))))
:node js/window})))
(mixins/on-key-down state
;; enter
{13 (fn [e]
(reset! *last-new-property-input-id (:ui/new-property-input-id @state/state)))})
(mixins/on-enter state
{:on-enter (fn [e]
(when-not (or (state/editing?)
(state/selection?))
(when (or (= "main-content-container" (.-id (.-target e)))
(= (.-tagName (.-target e)) "BODY"))
(let [nodes (dom/by-class "add-property")
last-input-id @*last-new-property-input-id
node (if last-input-id
(some (fn [node]
(when (dom/has-class? node last-input-id) node)) nodes)
(first nodes))]
(when node (.click node))))))
:node js/window})))
[state block edit-input-id new-property? opts]
[:div.ls-new-property
(let [*property-key (::property-key state)
@@ -417,13 +427,14 @@
(not config/publishing?)
(not (:in-block-container? opts)))
[:a.fade-link.flex.add-property
{:on-click (fn []
{:class edit-input-id
:on-click (fn []
(property-handler/set-editing-new-property! edit-input-id)
(reset! *property-key nil)
(reset! *property-value nil))}
[:div.flex.flex-row.items-center.py-1
(ui/icon "circle-plus" {:size 15})
[:div.ml-1.text-sm "Add property"]]]
[:div.flex.flex-row.items-center {:style {:padding-left 1}}
(ui/icon "plus" {:size 15})
[:div.ml-1.text-sm {:style {:padding-left 2}} "Add property"]]]
:else
[:div {:style {:height 28}}]))])