enhance(ux): able to edit #Comments title

This commit is contained in:
Tienson Qin
2026-05-20 03:09:53 +08:00
parent 22609130c4
commit d68cbce311
5 changed files with 115 additions and 2 deletions

View File

@@ -263,6 +263,8 @@
min-height: 30px;
padding: 5px 10px;
font-size: 12px;
--ls-comments-title-font-size: 12px;
--ls-comments-title-font-weight: 600;
color: var(--ls-secondary-text-color);
}
@@ -279,8 +281,50 @@
}
.ls-comments-label {
font-weight: 600;
padding: 0;
border: 0;
background: transparent;
font-weight: var(--ls-comments-title-font-weight);
color: var(--ls-primary-text-color);
cursor: text;
font-size: var(--ls-comments-title-font-size);
line-height: inherit;
}
.ls-comments-label:hover {
text-decoration: underline;
text-underline-offset: 2px;
}
.ls-comments-title-editor {
flex: 1;
min-width: 0;
color: var(--ls-primary-text-color);
font-size: var(--ls-comments-title-font-size);
font-weight: var(--ls-comments-title-font-weight);
line-height: inherit;
}
.ls-comments-title-editor .block-content-or-editor-wrap,
.ls-comments-title-editor .block-content-or-editor-inner {
min-height: 0;
padding: 0;
}
.ls-comments-title-editor .block-row {
min-height: 0;
}
.ls-comments-title-editor .editor-wrapper,
.ls-comments-title-editor .editor-inner,
.ls-comments-title-editor .block-editor,
.ls-comments-title-editor textarea,
.ls-comments-title-editor .editor-inner .uniline-block {
min-height: 0;
color: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
}
.ls-comments-count,

View File

@@ -417,10 +417,50 @@
(reference {} uuid)
(string/trim (or (:block/title target) "")))]))])))
(defn- comments-area-title-editing?
[config block]
(let [block-uuid (:block/uuid block)
container-id (:container-id config)
editing-in-container? (state/sub-editing? [container-id block-uuid])
editing-in-unknown-container? (state/sub-editing? [:unknown-container block-uuid])]
(boolean
(and block-uuid
(or editing-in-container?
editing-in-unknown-container?)))))
(defn- comments-area-title-view
[config block editing? *hide-block-refs? *show-query? {:keys [block-content-or-editor]}]
(let [block-uuid (:block/uuid block)
edit-input-id (str "edit-block-" block-uuid)]
(if (and editing? block-content-or-editor)
[:div.ls-comments-title-editor
(block-content-or-editor
(assoc config :table-block-title? true)
(merge block (block/parse-title-and-body block-uuid
(get block :block/format :markdown)
(:block/title block)))
{:edit-input-id edit-input-id
:block-id block-uuid
:edit? true
:refs-count nil
:*hide-block-refs? *hide-block-refs?
:hide-block-refs-count? true
:*show-query? *show-query?})]
[:button.ls-comments-label
{:type "button"
:title (t :editor/click-to-edit)
:aria-label (t :editor/click-to-edit)
:on-pointer-down util/stop
:on-click (fn [e]
(util/stop e)
(comments-handler/edit-comments-area-title! block (:container-id config)))}
(comments-model/comments-area-title block)])))
(rum/defc comments-area-view
[config block children collapsed? *hide-block-refs? *show-query? renderers {:keys [focus-editor? inline?]}]
(let [*comments-list-ref (hooks/use-ref nil)
[targets-open? set-targets-open!] (hooks/use-state false)
title-editing? (comments-area-title-editing? config block)
render-token (comments-model/comments-render-token children)
summary (comments-model/comments-summary children)
count (count children)]
@@ -451,7 +491,7 @@
(comments-model/collapsed-comments-label summary)]
[:<>
[:div.ls-comments-header
[:span.ls-comments-label (t :block.comments/label)]
(comments-area-title-view config block title-editing? *hide-block-refs? *show-query? renderers)
[:span.ls-comments-count count]
(when (comments-model/comment-thread-targets-toggle-visible? block)
[:button.ls-comments-targets-toggle

View File

@@ -200,6 +200,13 @@
(:latest-author summary))
(t :block.comments/label)))
(defn comments-area-title
[comments-area]
(or (some-> (:block/title comments-area)
string/trim
not-empty)
(t :block.comments/label)))
(defn- same-local-day?
[^js a ^js b]
(and (= (.getFullYear a) (.getFullYear b))

View File

@@ -239,6 +239,11 @@
(when-let [uuid (:block/uuid (comments-area-entity comments-area))]
(editor-handler/expand-block! uuid)))
(defn edit-comments-area-title!
[comments-area container-id]
(when-let [block (comments-area-entity comments-area)]
(editor-handler/edit-block! block :max {:container-id (or container-id :unknown-container)})))
(defn- selected-block-entities
[]
(keep #(db/entity [:block/uuid %]) (state/get-selection-block-ids)))

View File

@@ -96,3 +96,20 @@
(comments-handler/reveal-comments-area!
{:block/uuid #uuid "22222222-2222-2222-2222-222222222222"})
(is (empty? @expanded))))))
(deftest edit-comments-area-title-edits-comments-block
(let [comments-uuid #uuid "22222222-2222-2222-2222-222222222222"
comments-area {:db/id 2
:block/uuid comments-uuid
:block/title "Comments"
:block/tags [{:db/ident comments-model/comments-tag-ident}]}
edited (atom nil)]
(with-redefs [db/entity (fn [lookup]
(case lookup
[:block/uuid comments-uuid] comments-area
nil))
editor-handler/edit-block! (fn [block pos opts]
(reset! edited [block pos opts]))]
(comments-handler/edit-comments-area-title! comments-area :main)
(is (= [comments-area :max {:container-id :main}]
@edited)))))